/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * *  *
 * 
 *  load specific Icons for our map
 *
 * it's easy to change, so we can take rapidly our own icons
 * 
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *  */
var execdir = 'events/eventplaner/';

var customIcons = [];
customIcons["autoevents"]       = iconGreen;
customIcons["autotreffen"]      = iconYellow;
customIcons["messen"]           = iconBlue;
customIcons["oldtimerevents"]   = iconRed;

var gmarkers = [];
var sidebar = "";
var i = 0;

var map, contextmenu, selmarker;

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * *  *
 * 
 *  Google map function to get object properties
 * 
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *  */
function objProperties(myObject){
	var out = new Array();
	for( property in myObject ) { 
		out.push(property + " = " + myObject[property]); 
	}
	return out;
}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * *  *
 * 
 * if sb. click in a marker, it will show information about this
 * 
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *  */
function clickShowPlace(i) {
	GEvent.trigger(gmarkers[i], "click");
}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * *  *
 * 
 *  Google map function to load coordinates, zoom etc.
 * 
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *  */
//<![CDATA[
// event_id is event_id, state is information about past or future (for XML generation)
function load(event_id, state) {
// check, browser can laod google map
   if (GBrowserIsCompatible()) {
	
   var clickedPixel;
	var xmlParseUrl;
	
	if (state == 0) {
		xmlParseUrl = execdir+'xml.php';
	} else {
		xmlParseUrl = execdir+'xml.php?state=past&id='+event_id;
	}
        
	// create a new GMap-Object and set it on the <div>-tag with id "map"
	map = new GMap2(document.getElementById("map"));
	
	// add zoom an navigation control
	map.addControl(new GSmallMapControl());
	
	// add the map type selection
	map.addControl(new GMapTypeControl());

	// load php function to generate xml file from database information
	//GDownloadUrl("phpsqlajax_genxml.php", function(data) {
	GDownloadUrl(xmlParseUrl, function(data, responseCode) {
		// set xml variable
		var xml = GXml.parse(data);
	
		// create markers from xml file
		var markers = xml.documentElement.getElementsByTagName("marker");
		
		// for each marker, create a new marker
		for (var i = 0; i < markers.length; i++) {
			var eid = markers[i].getAttribute("idEvents");
			if (eid == event_id) {
				var name = markers[i].getAttribute("Event_Name");
				var type = markers[i].getAttribute("Category");
				var lat = markers[i].getAttribute("Latitude");
				var lng = markers[i].getAttribute("Longitude");
				var city = markers[i].getAttribute("City");
				
				point = new GLatLng(parseFloat(lat), parseFloat(lng));
                                
                                // here you can set the zoom level
				map.setCenter(point, 12);
				var marker = createMarker(point, name, type, city);
				selmarker = marker;
				map.enableScrollWheelZoom();
                                
				GEvent.addListener( map, "wheelup", function(point){
				if (map.getZoomLevel() > 0 ) {
				 map.centerAndZoom(p.scaleRelative( map.getCenterLatLng() ),  map.getZoomLevel() - 1);
				 }
				});
			      
				GEvent.addListener( map, "wheeldown", function(point){
				if (map.getZoomLevel() <= 16 )
				  map.centerAndZoom(
				    p.scaleRelative( map.getCenterLatLng(), -1 ),
				    map.getZoomLevel() + 1
				  );
				});
				map.addOverlay(marker);
			}
		}
 
	});
        
        
      // this all is for context menu (right click)  
      
      /*  
      // === create the context menu div ===
      contextmenu = document.createElement("div");
      contextmenu.style.visibility="hidden";
      contextmenu.style.background="#ffffff";
      contextmenu.style.border="1px solid #8888FF";

      contextmenu.innerHTML = '<a href="javascript:zoomIn()"><div class="context">&nbsp;&nbsp;Zoom in&nbsp;&nbsp;</div></a>'
                            + '<a href="javascript:zoomOut()"><div class="context">&nbsp;&nbsp;Zoom out&nbsp;&nbsp;</div></a>'
                            + '<a href="javascript:zoomInHere()"><div class="context">&nbsp;&nbsp;Zoom in here&nbsp;&nbsp;</div></a>'
                            + '<a href="javascript:zoomOutHere()"><div class="context">&nbsp;&nbsp;Zoom out here&nbsp;&nbsp;</div></a>'
                            + '<a href="javascript:centreMapHere()"><div class="context">&nbsp;&nbsp;Centre map here&nbsp;&nbsp;</div></a>';

      map.getContainer().appendChild(contextmenu);

      // === listen for singlerightclick ===
      GEvent.addListener(map,"singlerightclick",function(pixel,tile) {
        // store the "pixel" info in case we need it later
        // adjust the context menu location if near an egde
        // create a GControlPosition
        // apply it to the context menu, and make the context menu visible
        clickedPixel = pixel;
        var x=pixel.x;
        var y=pixel.y;
        if (x > map.getSize().width - 120) { x = map.getSize().width - 120 }
        if (y > map.getSize().height - 100) { y = map.getSize().height - 100 }
        var pos = new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(x,y));  
        pos.apply(contextmenu);
        contextmenu.style.visibility = "visible";
      });


      // === If the user clicks on the map, close the context menu ===
      GEvent.addListener(map, "click", function() {
        contextmenu.style.visibility="hidden";
      });
      */
    } // close GBrowserIsCompatible
}

/*
     // === functions that perform the context menu options ===
      function zoomIn() {
        // perform the requested operation
        map.zoomIn();
        // hide the context menu now that it has been used
        contextmenu.style.visibility="hidden";
      }      
      function zoomOut() {
        // perform the requested operation
        map.zoomOut();
        // hide the context menu now that it has been used
        contextmenu.style.visibility="hidden";
      }      
      function zoomInHere() {
        // perform the requested operation
        var point = map.fromContainerPixelToLatLng(clickedPixel)
        map.zoomIn(point,true);
        // hide the context menu now that it has been used
        contextmenu.style.visibility="hidden";
      }      
      function zoomOutHere() {
        // perform the requested operation
        var point = map.fromContainerPixelToLatLng(clickedPixel)
        map.setCenter(point,map.getZoom()-1); // There is no map.zoomOut() equivalent
        // hide the context menu now that it has been used
        contextmenu.style.visibility="hidden";
      }      
      function centreMapHere() {
        // perform the requested operation
        var point = map.fromContainerPixelToLatLng(clickedPixel)
        map.setCenter(point);
        // hide the context menu now that it has been used
        contextmenu.style.visibility="hidden";
      }        
*/

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * *  *
 * 
 *  function to change map view size
 * 
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *  */
function changeview() {
    var htmltmp;
    var textinfo = document.getElementById('textinfo');
    var textinfo2 = document.getElementById('textinfo2');
    var changeviewtext = document.getElementById('changeview');
    var mapdiv = document.getElementById('map');
    var mapbigheight = '500px';
    var mapbigwidth  = '640px';
    var textinfo2height = 'auto';
    var textinfo2width  = '330px';
    var textinfoheight = '300px';
    var textinfowidth = '330px';
    var mapsmallheight = '300px';
    var mapsmallwidth = '300px';
    
    if (mapdiv.style.width == mapbigwidth) {
        htmltmp = textinfo2.innerHTML;
        textinfo.innerHTML = htmltmp;
        textinfo.style.width = textinfowidth;
        textinfo.style.height = textinfoheight;
        changeviewtext.innerHTML = '<a href="javascript: changeview();">größere Ansicht</a>';
        mapdiv.style.width = mapsmallwidth;
        mapdiv.style.height = mapsmallheight;
        map.checkResize();
        map.setCenter(selmarker.getLatLng());
        textinfo2.innerHTML = '';
        textinfo2.style.width = '0px';
        textinfo2.style.height = '0px';
    } else {
        textinfo.style.width = '0px';
        textinfo.style.height = '0px';
        htmltmp = textinfo.innerHTML;
        textinfo.innerHTML = '';
        changeviewtext.innerHTML = '<a href="javascript: changeview();">kleinere Ansicht</a>';
        mapdiv.style.width = mapbigwidth;
        mapdiv.style.height = mapbigheight;
        map.checkResize();
        map.setCenter(selmarker.getLatLng());

        textinfo2.style.width = textinfo2width;
        textinfo2.style.height = textinfo2height;
        textinfo2.innerHTML = htmltmp;
    }
}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * *  *
 * 
 *  function to create Marker for map
 * 
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *  */
function createMarker(poing, name, type, city) {
	var marker = new GMarker(poing, customIcons[type]);
	var html = "<b>" + name + "</b> <br /><br /><br /><div style='float: left;'><a href=\"http://maps.google.de/maps?sll="+poing+"&saddr="+city+"&daddr=\" target=\"_blank\">Route berechnen</a></div>";
	GEvent.addListener(marker, 'click', function() {
		marker.openInfoWindowHtml(html);
	});

	gmarkers[i] = marker;
	sidebar += '<a href="javascript:clickShowPlace(' + i + ')">' + name + '</a><br />';
	i++;
	return marker;
	}

//]]>