var map;
var markers = [];

function LoadEmUp(){
	ResizeMap();
	
	map = new GMap2( document.getElementById( "map_canvas" ) );

	//============================================================================
	// this is good if traveling to california from arizona
	//map.setCenter(new GLatLng(34.900, -114.000), 6);
	// this is good for all around metro phx
	//	map.setCenter(new GLatLng(33.3880, -111.8980), 10);
	// this is good if going to Flagstaff
	map.setCenter(new GLatLng(33.46563, -111.886433), 10);
	//============================================================================

	// Add zoom/pan & type controls
	// map.addControl(new GSmallMapControl());
	map.addControl(new GLargeMapControl());

	// Traffic Button
	map.addControl(new ExtMapTypeControl({showTraffic: true, showTrafficKey: true}));

	// Enable Scroll Wheel Zoom feature			
	map.enableScrollWheelZoom();

	// Enable keyboard shortcuts
	new GKeyboardHandler(map);

	// Add a map overview
	map.addControl(new GOverviewMapControl(new GSize(200,200)));

	//Search Option
	map.enableGoogleBar();
	
	ResizeMap();
	GetGaugeData();
}

function ResizeMap(){
	var newHeight = ( YAHOO.util.Dom.getViewportHeight() - 30 );
	YAHOO.util.Dom.setStyle( "map_canvas", "height", newHeight + 'px' );
}

function GetGaugeData(){
	var callback = {
		success: function( o ){
			DrawGauges( o.responseText );
		},
		failure: function( o ){},
		timeout: 60000
	};
	
	var now = new Date();
	var sUrl = '/rain/fetch_data.php?=' + now.getTime();
	var transaction = YAHOO.util.Connect.asyncRequest('GET', sUrl, callback, null);
}

function DrawGauges( json_data ){
	var gauge_data = YAHOO.lang.JSON.parse( json_data );
	
	for( var gauge in gauge_data ){
		//alert( gauge );
		if( gauge != '0000' && gauge_data[gauge]['meta'] && gauge_data[gauge]['rain'] ){
			//alert( gauge_data[gauge]['rain']['15m'] );//.rain.15m );
	
			var point = new GLatLng( gauge_data[gauge]['meta']['lat'], gauge_data[gauge]['meta']['lng'] );

			var thisMarker = CreateMarker( point, gauge_data[gauge] );
			var newlen = markers.push( thisMarker );
			map.addOverlay( markers[newlen - 1] );
			//return;
		}
	}
	
	var qs = new Querystring();
	if( qs.get( 'hidezeros' ) == '1' ){
		HideZeros();
	}
}

function HideZeros(){
	for( var marker in markers ){
		if( markers[marker].displayed_value && markers[marker].displayed_value == '0.00' ){
			markers[marker].hide();
		}else{
			//alert( 'Not zero: ' + markers[marker].displayed_value );
		}
	}
	
	YAHOO.util.Dom.get( 'hidezeros' ).innerHTML = '<a href="javascript:ShowZeros();">Show Zeros</a>';
}

function ShowZeros(){
	for( var marker in markers ){
		if( markers[marker].displayed_value && markers[marker].displayed_value == '0.00' ){
			markers[marker].show();
		}else{
			//alert( 'Not zero: ' + markers[marker].displayed_value );
		}
	}
	YAHOO.util.Dom.get( 'hidezeros' ).innerHTML = '<a href="javascript:HideZeros();">Hide Zeros</a>';
	
}

function CreateMarker( point, data ){
	
	var qs = new Querystring();
	switch( qs.get( 'range' ) ){
		case '15m':
			range = '15m';
			break;
		
		case '1h':
			range = '1h';
			break;
		
		case '3h':
			range = '3h';
			break;
		
		case '6h':
			range = '6h';
			break;
		
		default:
			range = '24h';
			break;
	}
	
	var icon 		= new GIcon();
	icon.image 		=  'icons/' + data['rain'][range] + '.png';
	icon.iconSize 	= new GSize(35, 35);
	icon.iconAnchor = new GPoint(17, 28);
	icon.infoWindowAnchor = new GPoint(5, 2);
	
	var marker = new GMarker(point, icon);
	marker.displayed_value = data['rain'][range];

	var loc = data['meta']['loc'];
	
	GEvent.addListener(marker, "click", function() {
	    var myHtml = "<a target=\"_blank\" href=\"station.php?id=" + data['meta']['id'] + "\">Station <b>" + data['meta']['id'] + "</b></a><br />" + data['meta']['loc'] + "<br />" +
					 "<a target=\"_blank\" href=\"http://156.42.96.39/alert/Rain/Master/" + data['meta']['id'] + ".jpg\">Photo</a><br />" +
					 '<table>' +
					 '<tr><td>15m</td><td>' + data['rain']['15m'] + "</td></tr>" +
					 '<tr><td>1h</td><td>' + data['rain']['1h'] + "</td></tr>" +
					 '<tr><td>3h</td><td>' + data['rain']['3h'] + "</td></tr>" +
					 '<tr><td>6h</td><td>' + data['rain']['6h'] + "</td></tr>" +
					 '<tr><td>24h</td><td>' + data['rain']['24h'] + "</td></tr>" +
					 '</table>';
					
	    map.openInfoWindowHtml(point, myHtml);
	  });
	
	return marker;
}

YAHOO.util.Event.addListener(window, "resize", ResizeMap );
YAHOO.util.Event.onDOMReady( LoadEmUp );