//<![CDATA[

 var map, actual;
 var gmarkers = [];

 var previousCenterPoint ; 
 var previousZoom ; 


 // kat 1
 var cat1 = new GIcon();
 cat1.image= "/backstage/harz_card/picpool/common/icons/cat_1.png";
 addIcon(cat1);

 // kat 2
 var cat2 = new GIcon();
 cat2.image= "/backstage/harz_card/picpool/common/icons/cat_2.png";
 addIcon(cat2);
 
 // kat 3
 var cat3 = new GIcon();
 cat3.image= "/backstage/harz_card/picpool/common/icons/cat_3.png";
 addIcon(cat3);
 
 // kat 4
 var cat4 = new GIcon();
 cat4.image= "/backstage/harz_card/picpool/common/icons/cat_4.png";
 addIcon(cat4);
 
 // kat 5
 var cat5 = new GIcon();
 cat5.image= "/backstage/harz_card/picpool/common/icons/cat_5.png";
 addIcon(cat5); 
 
 // kat 6
 var cat6 = new GIcon();
 cat6.image= "/backstage/harz_card/picpool/common/icons/cat_6.png";
 addIcon(cat6); 
 
 // kat 7
 var cat7 = new GIcon();
 cat7.image= "/backstage/harz_card/picpool/common/icons/cat_7.png";
 addIcon(cat7);
 
 
 var icons = { "1": cat1, "2": cat2, "3": cat3, "4": cat4, "5": cat5, "6": cat6, "7": cat7 };

function addIcon(icon) { // Add icon attributes for all icons

 icon.shadow = "/backstage/harz_card/picpool/common/icons/shadow.png";
 icon.iconSize = new GSize(12, 20);
 icon.shadowSize = new GSize(22, 20);
 icon.iconAnchor = new GPoint(9, 34);
 icon.infoWindowAnchor = new GPoint(19, 2);
 icon.infoShadowAnchor = new GPoint(18, 25);
}

 // Create the markers and set up the event window
 function createMarker(point, name, html, category, id) {
  var marker = new PdMarker(point, icons[category] );

   // Store category, name, id and icon as marker properties
   marker.category = category;
   marker.name = name;
   marker.id = id;
   marker.icon = icons[category];
   GEvent.addListener(marker, "click", function() {
    marker.openInfoWindowHtml(html);
    previousCenterPoint = map.getCenter(); 
    previousZoom = map.getZoom(); 
   });
  // Hovering over the markers
  GEvent.addListener(marker, "mouseover", function() {
   marker.setImage("/backstage/harz_card/picpool/common/icons/white-dot.png");
   marker.setTitle(marker.name);
   var hovered = document.getElementById(id);
   if(hovered) {
    hovered.className = "focus";
    actual = hovered; // Store this element
   }
  });

  GEvent.addListener(marker, "mouseout", function() {
    marker.setImage(icons[category].image);
     if(actual) { actual.className= "normal"; }
  });
/*
  GEvent.addListener(map, "infowindowclose", function() { 
    map.setCenter(previousCenterPoint,previousZoom); 
    // add your code to inform user here 
    }); 
*/

  gmarkers.push(marker);
  return marker;
 }


var hover = { // Hovering over the links
 over: function(id) {
  // Set another background color for the link
  var hovered = document.getElementById(id);
  hovered.className = "focus";

  // Set another marker icon
  for(var i =0; i < gmarkers.length; i++) {
   if(gmarkers[i].id == id) {
    gmarkers[i].setImage("/backstage/harz_card/picpool/common/icons/white-dot.png");
   }
  }
 },

 out: function(id) {
  // Set the default link background
  var hovered = document.getElementById(id);
  hovered.className = "normal";

  // Set the default marker icon
  for(var i =0; i < gmarkers.length; i++) {
   if(gmarkers[i].id == id) {
    gmarkers[i].setImage(gmarkers[i].icon.image);
   }
  }
 }
}

var visible= { // Make a category (un)visible
 show: function(category) {
  // Show all markers of one category
  for(var i= 0; i < gmarkers.length; i++) {
   if(gmarkers[i].category == category) {
    gmarkers[i].show();
   }
   else if(category =="all"){    
    gmarkers[i].show();
   }
  }
   // Set the checkbox to true
   if(category == "all"){
   document.getElementById("map1").checked = true;
   document.getElementById("map2").checked = true;
   document.getElementById("map3").checked = true;
   document.getElementById("map4").checked = true;
   document.getElementById("map5").checked = true;
   document.getElementById("map6").checked = true;
   document.getElementById("map7").checked = true;
}
else {
   document.getElementById("map" + category).checked = true;    
}

 },

 hide: function(category) {
  // Hide all markers of one category
  for(var i= 0; i < gmarkers.length; i++) {
   if(gmarkers[i].category == category) {
    gmarkers[i].hide();
   }
   else if(category =="all"){    
    gmarkers[i].hide();   
   }
  }
  // Clear the checkbox of a hidden category
   if(category == "all"){
   document.getElementById("map1").checked = false;
   document.getElementById("map2").checked = false;
   document.getElementById("map3").checked = false;
   document.getElementById("map4").checked = false;
   document.getElementById("map5").checked = false;
   document.getElementById("map6").checked = false;
   document.getElementById("map7").checked = false;
}
else {
   document.getElementById("map" + category).checked = false;    
}

  map.closeInfoWindow();
 }
}

 function boxclick(box, category) {

  // Hide or show the category of the clicked checkbox
  if(box.checked) { visible.show(category); }
  else { visible.hide(category); }

  // Rebuild the sidebar
 // makeSidebar();
 }

 function showAll(wert) {

  var button = document.getElementById("showAll");

  // Hide or show the category of the clicked checkbox
  if(wert == "Alle anzeigen") { 
     button.value="Alle ausblenden"; 
     visible.show("all");
}
  else { 
     button.value="Alle anzeigen"; 
     visible.hide("all");     
    }

  // Rebuild the sidebar
 // makeSidebar();
 }


 // Trigger the clicks from the sidebar to open the appropriate infowindow
 function Info(i) {
  GEvent.trigger(gmarkers[i],"click");
 }


 // Rebuild the sidebar to match currently displayed markers
 function makeSidebar() {

  var oldheader;

  var html = "";
  for(var i= 0; i < gmarkers.length; i++) {
   if(!gmarkers[i].isHidden()) {

   var header = gmarkers[i].category;
   header = header.replace(/^./, header.charAt(0).toUpperCase());
    if (oldheader != header) html += "<b>"+ header+"s</b><br \/>";
    html += '<a id="'+ gmarkers[i].id+'" href="javascript:Info('+i+')" onmouseover="hover.over(this.id)" onmouseout="hover.out(this.id)">' + gmarkers[i].name + '<\/a><br \/>';
    oldheader = header;
   }
  }
  // document.getElementById("sidebar").innerHTML = html;
 }

 // Create the map
 function load() {
  if(GBrowserIsCompatible()) {
   map = new GMap2(document.getElementById("map"));
   map.addControl(new GLargeMapControl());
   // map.addControl(new GMapTypeControl());
   map.setCenter(new GLatLng(51.76359,10.784454),8);
   readData(); 
  }
 }


function readData() {

 var request = GXmlHttp.create();
 request.open("GET", "../partnereinrichtungen/liste-xml-karte.xml", true);
 request.onreadystatechange = function() {
  if(request.readyState == 4) {
  // Use the browsers XML parser
  // var xml = request.responseXML;


  // Use Googles XML parser
  var xml = GXml.parse(request.responseText);

   var markers = xml.documentElement.getElementsByTagName("marker");


   for(var i = 0; i < markers.length; i++) {
    // Obtain the attribues of each marker
    var lat = parseFloat(markers[i].getAttribute("lat"));
    var lng = parseFloat(markers[i].getAttribute("lng"));
    var point = new GLatLng(lat,lng);
    var address = markers[i].getAttribute("address");
    var id = markers[i].getAttribute("nr");
    var name = markers[i].getAttribute("name");    
    var html = address;
    var category = markers[i].getAttribute("category");
    // Create the markers
    map.addOverlay(createMarker(point, name, html, category, id));
   }

 if(gmarkers) {

   // Sort categories and names to display
   // both in alphabetic order
   gmarkers.sort(compareCats);
   
 }
   // Show or hide the categories initially   
visible.show("all");
/*
   visible.hide("1");   
   visible.hide("2");
   visible.hide("3");
   visible.hide("4");
   visible.hide("5");
   visible.hide("6");
   visible.hide("7");   
*/
   
   makeSidebar();
  }
 }; request.send(null);
}


var compareCats = function(a, b) {

 var n1 = a.name;
 // Treat German umlauts like non-umlauts
 n1 = n1.toLowerCase();
 n1 = n1.replace(/ä/g,"a");
 n1 = n1.replace(/ö/g,"o");
 n1 = n1.replace(/ü/g,"u");
 n1 = n1.replace(/ß/g,"s");

 var n2 = b.name;

 n2 = n2.toLowerCase();
 n2 = n2.replace(/ä/g,"a");
 n2 = n2.replace(/ö/g,"o");
 n2 = n2.replace(/ü/g,"u");
 n2 = n2.replace(/ß/g,"s");

 var c1 = a.category;
 var c2 = b.category;

 // Sort categories and names
 if(a.category == b.category){
  if(a.name == b.name){
   return 0;
  }
   return (a.name < b.name) ? -1 : 1;
 }

 return (a.category < b.category) ? -1 : 1;
}

//]]>