var page_html = "";
var gmarkers = [];
var htmls = [];

// Creates a marker whose info window displays the given number
function createMarker(point, i, text, addr, logo, link) {
    var marker = new GMarker(point);

    // Show this marker's index in the info window when it is
    // clicked
    var popup_html = "<nobr><b>" + text + "</b></nobr>";
    if (addr) {
        popup_html += ("<br /><nobr>" + addr + "</nobr>");
    }
    if (logo && link) {
        popup_html += ("<br /><a href='" + link + "'><img src='"

            + logo + "' style='border: none' /></a>");
    }
    else if (logo) {
        popup_html += ("<br /><img src='" + logo
            + "' style='border: none' />");
    }
    else if (link) {
        popup_html += ("<br /><nobr><a href='" + link
        + "'>view site</a></nobr>");
    }

    page_html += ('<tr><td><a href="javascript:myclick('
        + i + ')">' + text  + "</a></td><td>" +  addr + "</td></tr>"
    );

    gmarkers[i] = marker;
    htmls[i]    = popup_html;

    GEvent.addListener(marker, "click", function() {
        marker.openInfoWindowHtml(popup_html);
    });

    return marker;
}

// This function picks up the click and opens the corresponding
// info window
function myclick(i) {
    gmarkers[i].openInfoWindowHtml(htmls[i]);
}

function rendermap (map_elem, loc_elem, xmlfile) {
    var map_node = document.getElementById(map_elem);
    
    if ( map_node ) {
        var map = new GMap(map_node);
        map.addControl(new GSmallMapControl());
        map.addControl(new GMapTypeControl());   // 38.952734,-95.257301
        map.centerAndZoom(new GPoint(-95.257301, 38.952734), 5);

        // Download the data in data.xml and load it on the map. The
        // format
        // we
        // expect is:
        // <markers>
        //   <marker lat="37.441" lng="-122.141"/>
        //   <marker lat="37.322" lng="-121.213"/>
        // </markers>
        var request = GXmlHttp.create();
        request.open("GET", xmlfile, true);
        request.onreadystatechange = function() {
            if (request.readyState == 4) {
                var xmlDoc = request.responseXML;
                var markers =
                xmlDoc.documentElement.getElementsByTagName("marker");


                for (var i = 0; i < markers.length; i++) {
                    var point = 
    					new GPoint(parseFloat(markers[i].getAttribute("lng")),
                            parseFloat(markers[i].getAttribute("lat")));

                    var marker =
                        createMarker(point, i,
                            markers[i].getAttribute("label"),
                            markers[i].getAttribute("address"),
                            markers[i].getAttribute("logo"),
                            markers[i].getAttribute("link"));

                    map.addOverlay(marker);
                    document.getElementById(loc_elem).innerHTML =
                        ("<table>" + page_html + "</table>");
                }
            }
        }
        request.send(null);
    }
}