var localVar = {
			//variable for host URL to do absolut referneces
			hostUrl 		: "",
			customer 		: "",
			iconImage 		: "",
			iconSize 		: [32, 32],
			iconShadowSize 	: [32, 32],
			flyoutAnchor	: [32, 32],
			centerCoords	: [36.0, 22.0, 2],
			stemSize		: [269, 40],
			smallControls	: false,
			fade			: false,
		
			//boolean to change style on maplayout change (ATTENTION: _dark and _light CSS musst exist!!!)
			handleStyleChange: false,
			
			//Style used to display InfoWindow
			flyoutStyle		: "dataInfoWindow_dark",
	
			//@variable	: <object> container for the map
			mapGlobal 		: null,

			// Contains the marker, spefified by their categories 
			// a[id][x] = marker of category with the number "id"
			arrMarker 		: {}, 
			
			// timeout saver
			markerTimeout 	: null,
			
			// container for the markers, whick are created during
			// the adding prozess
			markers 		: {},
			
			// container for markers which are created from the search
			categories		: {},
			
			// our icons for the marker
			icon 			: {},
			
			ieBelow7 		: false
			
}// end localVar

	/**
	 * 
	 * Init functions. These functions are called by the onload
	 * function, after the map is loaded.
	 * 
	 */
	function load() 
	{
		if (GBrowserIsCompatible())
		{
			loadVariables();
			drawMap();
			load_Bindings();
			cb_getPoints( pois );
			fillDropDowns();
			
			if (localVar.isNok)
			{
				$("td.gas").hide();
			}
		}
		else {
	      alert("Sorry, the Google Maps API is not compatible with this browser");
	    }
	}
	
	/**
	 * 
	 * Unload functions.
	 * 
	 */
	function unload() 
	{
			GUnload();
	}
	
	/** 
	 * 
	 * This functions initialize the global variables, which are needed 
	 * for this programm. Also the Icons are set.
	 * 
	 *
	 */
	function loadVariables()
	{
		localVar.markers 			= new Array();
		
		// creating the icons for the map
		localVar.icon 				= new GIcon(G_DEFAULT_ICON);
		localVar.icon.iconSize 		= new GSize(localVar.iconSize[0], localVar.iconSize[1]);
		localVar.icon.iconAnchor 	= new GPoint(localVar.iconSize[0]/2, localVar.iconSize[1]);
		localVar.icon.infoWindowAnchor = new GPoint(localVar.flyoutAnchor[0], localVar.flyoutAnchor[1]);
	}
	
	/**
	 * 
	 * Google Map: Drawing the map with custom controls
	 *
	 */
	function drawMap()
	{
		G_NORMAL_MAP.getTileLayers()[0].getOpacity = function () {return 1;};
		G_SATELLITE_MAP.getTileLayers()[0].getOpacity = function () {return 1;};
		G_HYBRID_MAP.getTileLayers()[0].getOpacity = function () {return 1;};
		G_HYBRID_MAP.getTileLayers()[1].getOpacity = function () {return 0.6;};
	
		// Controls setzen
		localVar.mapGlobal = new GMap2(document.getElementById("divmap"));
		var map = localVar.mapGlobal;
		
		// Add Controls
		if(localVar.smallControls)
		{
			map.addControl(new GSmallMapControl());
		}
		else
		{
			map.addControl(new GLargeMapControl());
		}
		map.addControl(new GMapTypeControl());
		
		//Center and Activate Mousebehaves
		map.setCenter(new GLatLng(localVar.centerCoords[0],localVar.centerCoords[1]),localVar.centerCoords[2]);
		map.enableDoubleClickZoom();
	
		//Getting Map-Div
		document.getElementById("divmap").style.backgroundColor="#fff";
		
		//MarkerManager init
		localVar.markerManager = new GMarkerManager(map);
	
		// Create an EWindow -- Anzeigefenster
		ew = new EWindow(map, E_STYLE_1);      
		map.addOverlay(ew);
	
		// =================================
		// Bind events to the map
		// =================================
		GEvent.addListener(map, "click", function(marker,point) {
		  if (point)
		  {
		  	//markerObj = null;
		    ew.hide();
		  }
		});
		
		GEvent.addListener(map, "zoomend", function(oldLevel, newLevel) {
			
		 if (markerObj == null) return;
		 
		 // Get Koordinates of current marker
		  var latLng = markerObj.getLatLng();
		  // Center to the coordinates
		  localVar.mapGlobal.setCenter(latLng);
		  
		  // after centering call click to set the window
		  // to the right position
		  var myMarker  = markerObj;
		  markerObj		= null;
		  GEvent.trigger(myMarker, "click");
		});
		
		// =================================
		//MapTypeSwitch Trigger
		// =================================
		if(localVar.handleStyleChange)
		{
			localVar.flyoutStyle = "dataInfoWindow_dark";
	
			GEvent.addListener(map, "maptypechanged", function() {
			  //Hide when not IE7 couse display mistakes
			  //if(localVar.ieBelow7) 
			  var wasOpened = false;
			  var markerTemp = null;
			  if(ew.visible){
			  	markerTemp = markerObj;
			  	hideFlyout("EWindowMain","EWindowSub");
			  	wasOpened = true;
			  }
			  if (map.getCurrentMapType() == G_NORMAL_MAP) {
			    if(document.getElementById('dataInfoWindow')){
			    	document.getElementById('dataInfoWindow').className = 'dataInfoWindow_dark';
	   				localVar.flyoutStyle = 'dataInfoWindow_dark';
			    }else{
	   				localVar.flyoutStyle = 'dataInfoWindow_dark';
			    }
			  }else{
			  	if(document.getElementById('dataInfoWindow')){
			    	document.getElementById('dataInfoWindow').className = 'dataInfoWindow_light';
	   				localVar.flyoutStyle = 'dataInfoWindow_light';
			    }else{
	   				localVar.flyoutStyle = 'dataInfoWindow_light';
			    }
			  }

			  if(wasOpened)
			  {
			  	markerObj = null;
			  	GEvent.trigger(markerTemp, "click");
			  }  	
			});	
		}
		
	}
	
	
	var markerObj = null;
	/** 
	 * This function creates a GMarker Object.
	 *
	 * @param #1	{hash} 
	* 		Returning JSON Values
	 * @param #2	{boolean} 
	 *		shows, if the points are added after a search or not
	 * @param #3	{array} 
	 *		This parameter contains the infos about categories
	 * @return 	{GMarker}
	*		A Google Map Marker Object
	 */
	function createMarker(point, data, arrInfos) 
	{
		var myIcon			= createIcon( arrInfos );
		var marker 			= new GMarker(point, myIcon);
		
		GEvent.addListener(marker, "click", function() {
			if(!(markerObj === marker)){
				ew.openOnMarker(marker, flyout(data));
				GEvent.clearListeners(marker, "mouseout");
				markerObj = marker;
			}
		});
		
		return marker;
	}
	
	
	 /** 
	  * This function create an icon for the marker.
	  *
	  * @param #1	{array} 	Array containing the categories 
	  * 						ex: ('red', 'circle'). The name of the image
	  * 						for the icon is created by the category names.
	  * 						ex: red_circle.gif
	  * 
	  * @return 	{GIcon}		A Google Map Icon Object
	  * ========================================================================
	  */ 
	function createIcon( arrInfos )
	{
		// Map names to icon names
		var arrMapNames = new Array();
		var Icon 		= new GIcon(G_DEFAULT_ICON);
		var strIconName = arrInfos.join('_') + '.png';
		
		Icon.image 		= localVar.hostUrl + "/img/icons/" + strIconName;
		Icon.shadowSize = new GSize(0,0);
		Icon.iconSize 	= new GSize(15, 15);
		Icon.iconAnchor = new GPoint(9, 9);
		Icon.infoWindowAnchor = new GPoint(141, 10);

		return Icon;
	}
	
	/** 
	 * This function adds a point into the google map.
	 *
	 * @param	{hash} 	JSON Values
	 */
	
	function addPoint(data) 
	{
		// get data from hash
		if (data == null) return;
		if (data['lat'] == null || data['lng'] == null) return;
		if (localVar.isNok && (data['nok'] == 0) ) return;
		
		var iLat  		= data['lat'];
		var iLong 		= data['lng'];
	
		var point 		= new GLatLng(iLat,iLong); 
		var arrIconCat	= new Array();	

		// create the marker with the category
		arrIconCat.push( data['type'] ); // <-- Name of the icon	
		var marker	= createMarker(point, data, arrIconCat);
		
		// add Additional Info to the markers
		marker.inMap 	= true;
		marker.type 	= data['type'];
		marker.state 	= (data['state'] == '') ? 'DE' : data['state'];
		marker.id		= iLat+'_'+iLong;
		
		localVar.markers.push(marker);
		localVar.mapGlobal.addOverlay( marker );
	}
	
	/** 
	 * This callback function gets the Points from the called Java function
	 * and adds them to the map.
	 * 
	 * @param	{array} Containing the position information for google maps
	 */
	function cb_getPoints(data)
	{
		// pois is a global variable containing the poi 
		// data 
		var iLength 	= pois.length;
		var hashKanton 	= {};
		var poiState, poiCompany;
		var iLat, iLong, intID;
		
		if (data != null && typeof data == 'object') 
		{	
			var iLength = data.length;
			for (var i=0; i < iLength; i++)
			{
				addPoint( data[i] );
			}
			
			mapCategory = new Category();
			mapCategory.init(localVar.markers);
		} 
	}
	
	
	// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	// Other useful functions
	// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	
	/** 
	 * GMAP extension
	 * This method add multiple marker at once into the map.
	 * The marker are shown in groups of ten, so that
	 * a fast interaction is possible
	 * 
	 * @param	{array} an array of GMarker
	 */
	GMap2.prototype.addOverlays = function(overlays)
	{
		var i   = overlays.length - 1;
	
		myMap	= this;
		
		loadDelayedMarker = function ( c )
		{
			if (c < 0)
			{
				$('#transparentpopup').hide()
				 return; 
			}
			var from = c;
			var till = c - 20;
			if (till < 0) till = -1;
			
			do {
				myMap.addOverlay(overlays[from]);
				from--;
			} while (from > till )
			window.setTimeout("loadDelayedMarker("+till+")", 5);
		}
		
		window.setTimeout("loadDelayedMarker("+ i +")", 5);
	}
