// Writen by George Vlachos
// 6-6-2010 ver 1.0
// Χάρτης Αμβρακικού

// Set custom map Home Control
function HomeControl(controlDiv, map, latlng, myZoom)
{
	// Set CSS styles for the DIV containing the control
	// Setting padding to 5 px will offset the control
	// from the edge of the map
	controlDiv.style.padding = '5px';
	
	// Set CSS for the control border
	var controlUI = document.createElement('DIV');
	controlUI.style.backgroundColor = 'white';
	controlUI.style.borderStyle = 'solid';
	controlUI.style.borderWidth = '2px';
	controlUI.style.cursor = 'pointer';
	controlUI.style.textAlign = 'center';
	controlUI.title = 'Επαναφορά του χάρτη στην Αρχική Θέση';
	controlDiv.appendChild(controlUI);
	
	// Set CSS for the control interior
	var controlText = document.createElement('DIV');
	controlText.style.fontFamily = 'Arial,sans-serif';
	controlText.style.fontSize = '12px';
	controlText.style.paddingLeft = '4px';
	controlText.style.paddingRight = '4px';
	controlText.innerHTML = 'Επαναφορά';
	controlUI.appendChild(controlText);
	
	// Setup the click event listeners: simply set the map to
	// original center and zoom size
	google.maps.event.addDomListener(controlUI, 'click', function() {
		map.setCenter( latlng );
		map.setZoom(myZoom);
		map.setMapTypeId('CUSTOM');
	});
    
}

// Close all marker infowindows
function closeInfowindows( map, MyMarkers, Myinfowindows )
{
	for( var i in MyMarkers )
	{
		Myinfowindows[i].close(map, MyMarkers[i]);
	}

}


// Open InfoWindow when user clicks on map marker
function listenMarker( myMarker, MyContent, MyMap )
{
	var infowindow = new google.maps.InfoWindow({
		content: MyContent });

	google.maps.event.addListener(myMarker, 'click', function() {
		infowindow.open(MyMap, myMarker)
	});
		
	return infowindow;
}


// Initialize Google map  
function initialize()
{
	// Center map here and set inittiale zoom------------------------------------
	var latlng = new google.maps.LatLng(39.04, 20.946667);
	var myZoom = 10;
	var map;

	// marker Array
	var STmarker = [];
	
	// InfowWindow Array
	var STinfowindow = [];

	// Stations information [ Name, Lat, Lng, image, stationID ]
	var Stations = [
	['Σταθμός Φλάμπουρα', 39.081775, 20.765736, './templates/ground.jpg', '200'],
	['Σταθμός Γέφυρα Μαγκλάρα', 39.067086, 20.876289, './templates/ground.jpg', '100'],
	['Σταθμός Νέα Κερασούντα', 39.1516, 20.861364, './templates/ground.jpg', '300'],
	['Σταθμός Νεοχώρι', 39.070789, 21.024928, './templates/ground.jpg', '500'],
	['Κινητός Σταθμός', 39.078917, 20.884739, './templates/mobile.jpg', '400'],
	['Πλωτός Σταθμός No 1', 38.948269, 20.928869, './templates/float.jpg', '600'],
	['Πλωτός Σταθμός No 2', 38.945997, 20.757142, './templates/float.jpg', '700'],
	['Πλωτός Σταθμός No 3', 38.995986, 20.800061, './templates/float.jpg', '800'],
	['Πλωτός Σταθμός No 4', 38.946869, 21.067508, './templates/float.jpg', '900']
	];
		
	var myOptions = {
		zoom: myZoom,
		scrollwheel: false,
		mapTypeControl: true,
		mapTypeControlOptions: {
			mapTypeIds: [ 'CUSTOM', google.maps.MapTypeId.TERRAIN, google.maps.MapTypeId.SATELLITE],
			style: google.maps.MapTypeControlStyle.DROPDOWN_MENU },
		navigationControl: true,
		navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL},
		center: latlng,
		mapTypeId: google.maps.MapTypeId.ROADMAP };
	
	map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
	
	var stylez = [
	  {
	    featureType: "road",
	    elementType: "all",
	    stylers: [
	      { hue: "#ff9100" },
	      { lightness: 49 }
	    ]
	  },
	  {
	      featureType: "water",
	      elementType: "geometry",
	      stylers: [
	        { lightness: 9 },
	        { hue: "#00ffff" }
	      ]
	    }
	];
	
	var styledMapOptions = {
	      map: map,
	      name: "Χάρτης"
	}
	
	var myMapType =  new google.maps.StyledMapType(stylez, styledMapOptions);
	map.mapTypes.set('CUSTOM', myMapType);
	map.setMapTypeId('CUSTOM');
	
	// Create the DIV to hold the control and
	// call the HomeControl() constructor passing
	// in this DIV.
	var homeControlDiv = document.createElement('DIV');
	var homeControl = new HomeControl(homeControlDiv, map, latlng, myZoom);
	
	homeControlDiv.index = 1;
	map.controls[google.maps.ControlPosition.TOP_RIGHT].push(homeControlDiv)
	
	// GUI Event Handlers
	google.maps.event.addListener(map, 'zoom_changed', function() {
		zoomLevel = map.getZoom();
		if (zoomLevel < 7 ) {
			map.setZoom(7);
		}
		if (zoomLevel > 18) {
			map.setZoom(18);
		}
	});
	
	google.maps.event.addListener(map, 'click', function() {
		closeInfowindows(map, STmarker, STinfowindow)
	});
	
				       		 
	// Create all Markers
	for( var i in Stations )
	{
		var location = Stations[i];
		
		var markerLatlng = new google.maps.LatLng(location[1], location[2]);
				
		STmarker[i] = new google.maps.Marker({
		position: markerLatlng,
		map: map,
		title: location[0]+' (ID '+location[4]+')' });
		
	           
		var contentString = '<div style="text-align:center; font-size:13px;">'+
		'<b>'+location[0]+'</b><br />'+
		'<img width="75" height="60" src="http:./'+location[3]+'"/><br />'+
		'<a href="http:./values.php?stID='+location[4]+'&stName='+location[0]+'" title="τιμές σταθμού"'+
		'target="_self"> Πατήστε εδώ</a> για να δείτε τις<br />μετρήσεις του σταθμού  (ID '+location[4]+')</div>';
           
		STinfowindow[i] = listenMarker( STmarker[i], contentString, map );
		
	}
	
	// Create server marker
	var markerLatlng = new google.maps.LatLng(39.151358, 20.977172);
	var mTitle = "Σταθμός Λήψης Δεδομένων";
	var mIcon = "./templates/computer.png";
			
	var marker = new google.maps.Marker({
	position: markerLatlng,
	map: map,
	icon: mIcon,
	title: mTitle });
	
	STmarker.push( marker );
	    
	var contentString = '<div style="text-align:center; font-size:13px;">'+
	'<b>'+mTitle+'</b><br />'+
	'Εδώ στεγάζονται οι υπολογιστές και ο λοιπός<br />απαραίτητος εξοπλισμός για την αποθήκευση και την<br />'+
	'επεξεργασία των μετρήσεων που συλλέγονται από<br />τους τηλεμετρικούς σταθμούς του δικτύου.</div>';		          

	var infowindow = new google.maps.InfoWindow({
		content: contentString });

	google.maps.event.addListener(marker, 'click', function() {
		infowindow.open(map, marker)
	});		
	
	STinfowindow.push( infowindow );        
			
}