//<![CDATA[

    var iconYellow = new GIcon();
    iconYellow.image = 'http://labs.google.com/ridefinder/images/mm_20_yellow.png';
    iconYellow.shadow = 'http://labs.google.com/ridefinder/images/mm_20_shadow.png';
    iconYellow.iconSize = new GSize(12, 20);
    iconYellow.shadowSize = new GSize(22, 20);
    iconYellow.iconAnchor = new GPoint(6, 20);
    iconYellow.infoWindowAnchor = new GPoint(5, 1);

    var iconRed = new GIcon();
    iconRed.image = 'http://labs.google.com/ridefinder/images/mm_20_red.png';
    iconRed.shadow = 'http://labs.google.com/ridefinder/images/mm_20_shadow.png';
    iconRed.iconSize = new GSize(12, 20);
    iconRed.shadowSize = new GSize(22, 20);
    iconRed.iconAnchor = new GPoint(6, 20);
    iconRed.infoWindowAnchor = new GPoint(5, 1);




// this variable will collect the html which will eventually be placed in the side_bar
    var side_bar_html = "";

// arrays to hold copies of the markers used by the side_bar
// because the function closure trick doesnt work there
    var gmarkers = [];
    var customIcons = [];
    customIcons["base"] = iconYellow;
    customIcons[""] = iconRed;

     function createTabbedMarker(point,title,html,html1,html2,label1,label2, name, address_1, address_2, postcode, std_code, phone, type, notes, image) {
      var marker = new GMarker(point, customIcons[type]);
      var WINDOW_HTML = ""+ '<div style="width:200px; height:190px; padding-top:5px">' + '<img src=' + image + '> '  + "<br /><b>" + name + "</b> <br/>" + notes + "</div>";
 //      var html2 = "<b>Style and Product Range</b>" + '<div style="width:200px; padding-top:5px>' + '</div>';
      GEvent.addListener(marker, 'click', function() {
 //   GEvent.addListener(marker,"mouseover", function() {
         marker.openInfoWindowHtml(WINDOW_HTML);
      });

       // save the info we need to use later for the side_bar
        gmarkers.push(marker);
        // add a line to the side_bar html
        side_bar_html += '<a href="javascript:myclick(' + (gmarkers.length-1) + ')">' + name + '<\/a>';
        return marker;
    }

      // This function picks up the click and opens the corresponding info window
      function myclick(i) {
        GEvent.trigger(gmarkers[i], "click");
      }

    function load() {
      if (GBrowserIsCompatible()) {
        var map = new GMap2(document.getElementById("map"));
        map.addControl(new GSmallMapControl());
        map.addControl(new GMapTypeControl());
       	map.setCenter(new GLatLng(40.721242, 14.276733), 10);
       	map.setMapType(G_SATELLITE_MAP);

        GDownloadUrl("excursions_query_web.php", function(data) {
          var xml = GXml.parse(data);
          var markers = xml.documentElement.getElementsByTagName("marker");
          for (var i = 0; i < markers.length; i++) {
            var name = markers[i].getAttribute("name");
            var address = markers[i].getAttribute("address");
            var address_1 = markers[i].getAttribute("address_1");
            var address_2 = markers[i].getAttribute("address_2");
            var address_3 = markers[i].getAttribute("address_3");
            var postcode = markers[i].getAttribute("postcode");
             var std_code = markers[i].getAttribute("std_code");
             var phone = markers[i].getAttribute("phone");
            var type = markers[i].getAttribute("type");
            var html = markers[i].getAttribute("postcode");
            var title = markers[i].getAttribute("name");
            var notes = markers[i].getAttribute("notes");
           var image = markers[i].getAttribute("image");
            var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
                                    parseFloat(markers[i].getAttribute("lng")));
            var marker = createTabbedMarker(point,title,html,"", "", "Outlet", "Styles", name, address_1, address_2, postcode, std_code, phone, type, notes, image);
            map.addOverlay(marker);
          }
   // put the assembled side_bar_html contents into the side_bar div
        document.getElementById("side_bar").innerHTML = side_bar_html;
        });
      }
    }
    //]]>