var map;
var markerRedOptions;
var markerBlueOptions;
var markerYellowOptions;

function initialize2() {
  if($("#map-canvas").length) {
   if (GBrowserIsCompatible()) {

    map = new GMap2(document.getElementById("map-canvas"));
    map.setCenter(new GLatLng(49.3335, 13.2075337), 16);
    map.setUIToDefault();
    map.disableScrollWheelZoom();
    map.setMapType(G_HYBRID_MAP);

    var redIcon = new GIcon();
    redIcon.image = "img/red-dot.png";
    redIcon.shadow = "img/shadow.png";
    redIcon.iconSize = new GSize(32, 32);
    redIcon.shadowSize = new GSize(52, 32);
    redIcon.iconAnchor = new GPoint(16, 32);
    redIcon.infoWindowAnchor = new GPoint(14, 4);
    redIcon.imageMap = [19,0,20,1,21,2,22,3,23,4,24,5,24,6,24,7,24,8,24,9,24,10,24,11,24,12,23,13,23,14,22,15,21,16,20,17,20,18,19,19,19,20,18,21,18,22,17,23,17,24,17,25,17,26,16,27,16,28,16,29,16,30,16,31,14,31,14,30,14,29,14,28,14,27,14,26,13,25,13,24,13,23,12,22,12,21,12,20,11,19,10,18,10,17,9,16,8,15,7,14,7,13,6,12,6,11,6,10,6,9,6,8,6,7,6,6,7,5,7,4,8,3,9,2,10,1,11,0,19,0];
    markerRedOptions = { icon:redIcon };
    var blueIcon = new GIcon();
    blueIcon.image = "img/blue-dot.png";
    blueIcon.shadow = "img/shadow.png";
    blueIcon.iconSize = new GSize(32, 32);
    blueIcon.shadowSize = new GSize(52, 32);
    blueIcon.iconAnchor = new GPoint(16, 32);
    blueIcon.infoWindowAnchor = new GPoint(14, 4);
    blueIcon.imageMap = [19,0,20,1,21,2,22,3,23,4,24,5,24,6,24,7,24,8,24,9,24,10,24,11,24,12,23,13,23,14,22,15,21,16,20,17,20,18,19,19,19,20,18,21,18,22,17,23,17,24,17,25,17,26,16,27,16,28,16,29,16,30,16,31,14,31,14,30,14,29,14,28,14,27,14,26,13,25,13,24,13,23,12,22,12,21,12,20,11,19,10,18,10,17,9,16,8,15,7,14,7,13,6,12,6,11,6,10,6,9,6,8,6,7,6,6,7,5,7,4,8,3,9,2,10,1,11,0,19,0];
    markerBlueOptions = { icon:blueIcon };
    var yellowIcon = new GIcon();
    yellowIcon.image = "img/yellow-dot.png";
    yellowIcon.shadow = "img/shadow.png";
    yellowIcon.iconSize = new GSize(32, 32);
    yellowIcon.shadowSize = new GSize(52, 32);
    yellowIcon.iconAnchor = new GPoint(16, 32);
    yellowIcon.infoWindowAnchor = new GPoint(14, 4);
    yellowIcon.imageMap = [19,0,20,1,21,2,22,3,23,4,24,5,24,6,24,7,24,8,24,9,24,10,24,11,24,12,23,13,23,14,22,15,21,16,20,17,20,18,19,19,19,20,18,21,18,22,17,23,17,24,17,25,17,26,16,27,16,28,16,29,16,30,16,31,14,31,14,30,14,29,14,28,14,27,14,26,13,25,13,24,13,23,12,22,12,21,12,20,11,19,10,18,10,17,9,16,8,15,7,14,7,13,6,12,6,11,6,10,6,9,6,8,6,7,6,6,7,5,7,4,8,3,9,2,10,1,11,0,19,0];
    markerYellowOptions = { icon:yellowIcon };


    addMarkersFromXML();
    
   } 
  }
}

function addMarkersFromXML(){
    $("#map-coords").find("div.row").each(function() {
         var xmlcellLongitude = $(this).find(".longitude").text();
	var xmlcellLatitude = $(this).find(".latitude").text();
	var point = new GLatLng(parseFloat(xmlcellLatitude), parseFloat(xmlcellLongitude));

	var celltextcompany = $(this).find(".company").html();
	var celltextdesc = $(this).find(".description").html();
	var celltextcolor = $(this).find(".color").text();

	var htmlString = '<div style="overflow:hidden;padding-bottom:10px"><h3 style="margin-bottom:8px">' + celltextcompany + '</h3>' + celltextdesc + '</div>';
	var marker = createMarker(point,celltextcolor,htmlString);
	map.addOverlay(marker);
    });
}
     
function createMarker(point,color,html) {
    if(color=="blue") {
      var marker = new GMarker(point, markerBlueOptions);
    } else {
      if(color=="yellow") {
        var marker = new GMarker(point, markerYellowOptions);      
      } else {
        var marker = new GMarker(point, markerRedOptions);
      }
    }
    GEvent.addListener(marker, "mouseover", function() {
    marker.openInfoWindowHtml(html, {maxWidth: 280});
  });
  return marker;
}