//<![CDATA[

// global variables
var pWidth;
var map;

// select a region
var regionSelect = false;
var bounds = [];
var clickCounter = 0;

// default views
var view_main		= new GLatLng(43.34, -142.27);
var view_alaska		= new GLatLng(57.751, -156.368);
var view_hawaii		= new GLatLng(20.6, -157.4);
var view_cascades	= new GLatLng(45.3, -118.0);
var view_yellow		= new GLatLng(44.3, -111.2);
var view_lv			= new GLatLng(37.4, -120.5);

// default zooms
var zoom_main		= 5;
var zoom_alaska		= 5;
var zoom_hawaii		= 7;
var zoom_cascades	= 6;
var zoom_yellow		= 6;
var zoom_lv			= 6;

// create the marker manager
var mgr = '';

// create number->overlay name markers
var webicorder_overlay	= [];
var webcam_overlay		= [];
var volcano_overlay		= [];
var othervolc_overlay	= [];
var eq_overlay			= [];
var stn_overlay			= [];

var icon_path = '/images/icons/gmap/';

// stn icon
var stn_icon = new GIcon();
stn_icon.image = icon_path + 'seismometer_2.png';
stn_icon.iconSize = new GSize(18,18);
stn_icon.infoWindowAnchor = new GPoint(5,1);
stn_icon.iconAnchor = new GPoint(9,9);

// eq icon
var eq_icon = new GIcon();
eq_icon.image = icon_path + 'hypocenter_0.png';
eq_icon.infoWindowAnchor = new GPoint(5,1);

// webcam icon
var webcam_icon = new GIcon();
webcam_icon.image = icon_path + 'webcam.gif';
webcam_icon.iconSize = new GSize(20, 20);
webcam_icon.iconAnchor = new GPoint(10, 10);
webcam_icon.infoWindowAnchor = new GPoint(5,1);

var webi_icon = new GIcon();
webi_icon.image = icon_path + 'seismic.gif';
webi_icon.iconSize = new GSize(20, 15);
webi_icon.iconAnchor = new GPoint(10,10);
webi_icon.infoWindowAnchor = new GPoint(5,1);


// create the map element
function map_loadMap(volcs, othervolcs){
	if(GBrowserIsCompatible()){
		// get width of browser window, and set map div to some %				
		var gmap = document.getElementById('map');		
		map_resize();

		map = new GMap2(gmap);
		//mgr = new GMarkerManager(map);
		map.addControl(new GLargeMapControl());
		map.addControl(new GOverviewMapControl());
		map.addControl(new GMapTypeControl());
		map.addControl(new GScaleControl());
		map.setCenter(view_alaska, zoom_alaska, G_PHYSICAL_MAP);
		//map_loadMarkers();
		
		// load monitored volcanoes
		if(volcs){
			map_loadVolcs(document.getElementById('volcanoes'));
		}
		if(othervolcs){
			map_loadVolcs(document.getElementById('othervolcs'), 'other');
		}
	}
}

// set the view of the map
function map_setLoc(sel){
	val = sel.options[sel.selectedIndex].value;
	items = val.split(',');
	loc = new GLatLng(items[0], items[1]);
	map.setCenter(loc, parseInt(items[2]));
}

function map_resize(){
	var gmap = document.getElementById('map');		
	pWidth = document.documentElement.clientWidth;
	var divsize = pWidth - 220;
	var mapsize = divsize;
	gmap.style.width = mapsize + 'px';
}

// parse the return from the selected area
function map_listVolcs(){
	if(checkHTTPStatus()){
		alert(http.responseText);
	}
}

// change the view to a specific region
function map_setView(view){
	switch(view){
		case 'Alaska':
		map.setCenter(view_alaska, zoom_alaska);
		break;

		case 'Cascades':
		map.setCenter(view_cascades, zoom_cascades);
		break;

		case 'Hawaii':
		map.setCenter(view_hawaii, zoom_hawaii);
		break;

		case 'Yellowstone':
		map.setCenter(view_yellow, zoom_yellow);
		break;

		case 'Long Valley':
		map.setCenter(view_lv, zoom_lv);
		break;

		default:
		map.setCenter(view_main, zoom_main);
		break;
	}
}

// remove webicorders from the map
function map_removeItems(arr){
	var x = arr.length;
	for(var i = 0; i < x; i++){
		wm = arr.pop();
		map.removeOverlay(wm);
	}
}

// load seismic stations onto the map
function map_loadStn(c){
	if(!c.checked){
			map_removeItems(stn_overlay);
	}
	else{
		GDownloadUrl('returns.php?display=stn',
			function(data, code){
				var xml = GXml.parse(data);
				var markers = xml.documentElement.getElementsByTagName('marker');
				var len = markers.length;
				for(var x = 0; x < len; x++){
					var marker = new GLatLng(parseFloat(markers[x].getAttribute('lat')), parseFloat(markers[x].getAttribute('lon')));
					var stn = map_createStnMarker(marker, markers[x]);

					// add stn marker to overlays
					stn_overlay.push(stn);
					map.addOverlay(stn);
				}
			}
		);
	}
}
function map_createStnMarker(point, marker){
	var name	= marker.getAttribute('name');

	var html = marker.childNodes[0].data;
	html = html.replace(/\[/g, '<');
	html = html.replace(/\]/g, '>');
	var marker = new GMarker(point, stn_icon);
	GEvent.addListener(marker, 'click', function(){marker.openInfoWindowHtml(html);});

	/*
	GEvent.addListener(marker, "mouseover", function() {
	    marker.openVolcName(name);
	    });

	GEvent.addListener(marker, "mouseout", function() {
	    marker.closeVolcName();
	    });
	*/

	return marker;
}

// load recent earthquakes onto the map
function map_loadEQ(c){
	if(!c.checked){
		map_removeItems(eq_overlay);
		document.getElementById('eq_legend').style.display = 'none';
	}
	else{
		// show eq legend
		document.getElementById('eq_legend').style.display = 'block';
		GDownloadUrl('returns.php?display=eq',
			function(data, code){
				var xml = GXml.parse(data);
				var markers = xml.documentElement.getElementsByTagName('marker');
				var len = markers.length;
				for(var x = 0; x < len; x++){
					var marker = new GLatLng(parseFloat(markers[x].getAttribute('lat')), parseFloat(markers[x].getAttribute('lon')));
					var eq = map_createEQMarker(marker, markers[x]);

					// add eq marker to overlays
					eq_overlay.push(eq);
					map.addOverlay(eq);
				}
			}
		);
	}
}
function map_createEQMarker(point, marker){
	var name	= marker.getAttribute('name');
	var scale	= marker.getAttribute('scale');
	var color	= marker.getAttribute('color');
	var img		= marker.getAttribute('icon');

	// get size from scale, and apply it to icon
	var size = 32 * scale;

	// change icon image based on xml file
	eq_icon.image = icon_path + img;
	eq_icon.iconSize = new GSize(size, size);
	eq_icon.iconAnchor = new GPoint(size/2, size/2);

	var html = marker.childNodes[0].data;
	html = html.replace(/\[/g, '<');
	html = html.replace(/\]/g, '>');
	var marker = new GMarker(point, eq_icon);
	GEvent.addListener(marker, 'click', function(){marker.openInfoWindowHtml(html);});

	/*
	GEvent.addListener(marker, "mouseover", function() {
	    marker.openVolcName(name);
	    });

	GEvent.addListener(marker, "mouseout", function() {
	    marker.closeVolcName();
	    });
	*/

	return marker;
}

// load webicorders onto the map
function map_loadWebicorders(c){
	if(!c.checked){
		map_removeItems(webicorder_overlay);
	}
	else{
		GDownloadUrl('returns.php?display=webicorders', 
			function(data, responseCode){
				var xml = GXml.parse(data);
	
				var markers = xml.documentElement.getElementsByTagName('marker');
				var len = markers.length;
				for(var x = 0; x < len; x++){
					var marker = new GLatLng(parseFloat(markers[x].getAttribute('lat')), parseFloat(markers[x].getAttribute('long')));
					var wm = map_createWebiMarker(marker, markers[x]);
	
					// add webicorder marker to map and to overlays array, so we can remove it later on
					webicorder_overlay.push(wm);
					map.addOverlay(wm);
				}
			}
		);
	}
}
function map_createWebiMarker(point, marker){
	var name	= marker.getAttribute('name');
	var img		= marker.getAttribute('image');

	var img = '<img width="320" height="240" src="/webicorders/' + img + '" />';
	var html = img;
	var marker = new GMarker(point, webi_icon);
	GEvent.addListener(marker, 'click', function(){marker.openInfoWindowHtml(html);});

	GEvent.addListener(marker, "mouseover", function() {
	    marker.openVolcName(name);
	    });

	GEvent.addListener(marker, "mouseout", function() {
	    marker.closeVolcName();
	    });

	return marker;
}

function map_loadVolcs(c,type){
	arr = (type == 'other') ? othervolc_overlay : volcano_overlay;
	if(!c.checked){
		map_removeItems(arr);
	}
	else{
		addLoader();
		param = (type == 'other') ? 'other_volcs' : 'volcanoes';
		GDownloadUrl('returns.php?display=' + param,
			function(data, responseCode){
				var xml = GXml.parse(data);
				var markers = xml.documentElement.getElementsByTagName('marker');
				var len = markers.length;
				for(var x = 0; x < len; x++){
					var marker = new GLatLng(parseFloat(markers[x].getAttribute('lat')), parseFloat(markers[x].getAttribute('long')));
					wm = map_createVolcMarker(marker, markers[x]);

					arr.push(wm);
					map.addOverlay(wm);
				}
			}
		);
		removeLoader();
	}
}
function map_createVolcMarker(point, marker){
	var name	= marker.getAttribute('name');
	var c		= marker.getAttribute('color');
	var a		= marker.getAttribute('alert');
	var icon	= map_chooseIcon(c, a);

	var html = marker.childNodes[0].data;
	html = html.replace(/\[/g, '<');
	html = html.replace(/\]/g, '>');

	var marker = new GMarker(point, icon);

	GEvent.addListener(marker, 'click', function(){marker.openInfoWindowHtml(html);});

	GEvent.addListener(marker, "mouseover", function() {
	    marker.openVolcName(name);
	    });

	GEvent.addListener(marker, "mouseout", function() {
	    marker.closeVolcName();
	    });

	return marker;
}

// load webcams onto the map
function map_loadWebcams(c){
	if(!c.checked){
		map_removeItems(webcam_overlay);
	}
	else{
		GDownloadUrl('returns.php?display=webcams', 
			function(data, responseCode){
				var xml = GXml.parse(data);
				var markers = xml.documentElement.getElementsByTagName('marker');
				var len = markers.length;
				for(var x = 0; x < len; x++){
					var marker = new GLatLng(parseFloat(markers[x].getAttribute('lat')), parseFloat(markers[x].getAttribute('long')));
					wm = map_createCamMarker(marker, markers[x])
	
					webcam_overlay.push(wm);
					map.addOverlay(wm);
				}
				//mgr.addMarkers(webcam_overlay, 8);
				//mgr.refresh();
			}
		);
	}
}
function map_createCamMarker(point, marker){
	var name	= marker.getAttribute('name');
	var img		= marker.getAttribute('image');

	var img = '<img width="320" height="240" src="/webcam/' + img + '" />';
	var html = img;
	var marker = new GMarker(point, webcam_icon);

	GEvent.addListener(marker, 'click', function(){marker.openInfoWindowHtml(html);});

	GEvent.addListener(marker, "mouseover", function() {
	    marker.openVolcName(name);
	    });

	GEvent.addListener(marker, "mouseout", function() {
	    marker.closeVolcName();
	    });

	return marker;
}



// choose an icon image based on color code and hazard code
function map_chooseIcon(c,h){
	var imgdir = '/images/icons/gmap/';
	var icon = new GIcon();
	icon.infoWindowAnchor = new GPoint(10,10);
	icon.iconAnchor = new GPoint(10,10);

	switch(c){
		case 'GREEN':
		icon.image = imgdir + 'normal_green.png';
		icon.iconSize = new GSize(21,16);
		break;

		case 'YELLOW':
		icon.image = imgdir + 'advisory_yellow.png';
		icon.iconSize = new GSize(27,20);
		icon.iconAnchor = new GPoint(13,13);
		break;

		case 'ORANGE':
		icon.image = imgdir + 'watch_orange.png';
		icon.iconSize = new GSize(33,33);
		icon.iconAnchor = new GPoint(15,15);
		break;

		case 'RED':
		icon.image = imgdir + 'warning_red.png';
		icon.iconSize = new GSize(40,40);
		break;

		default:
		icon.image = imgdir + 'nocolor.gif';
		icon.iconSize = new GSize(10,10);
		icon.iconAnchor = new GPoint(5,5);
		break;
	}

	return icon;
}

// Mouseover functions (from Dina)
function volc(m,h,w){
	this.html = h;
	this.width = (w ? w + 'px' : 'auto');
	this.marker = m;
}

volc.prototype = new GOverlay();

volc.prototype.initialize = function(map){
	var div = document.createElement('div');
	div.style.display = 'none';
	map.getPane(G_MAP_FLOAT_PANE).appendChild(div);
	this.map = map;
	this.container = div;
}

volc.prototype.remove = function(){
	this.container.parentNode.removeChild(this.container);
}

volc.prototype.copy = function(){
	return new volc(this.html);
}

volc.prototype.redraw = function(force){
	if(!force){
		return;
	}
	var pl = this.map.fromLatLngToDivPixel(this.marker.getPoint());
	var c = this.container;
	var s = c.style;
	c.innerHTML = this.html;
	s.position = 'absolute';
	s.left = (pl.x + 21) + 'px';
	s.top = (pl.y - 10) + 'px';
	s.width = this.width;
	s.font = 'bold 10px/10px verdana, arial, sans';
	s.border = '1px solid black';
	s.background = '#ccccff';
	s.padding = '4px';
	s.whiteSpace = 'nowrap';
	s.display = 'block';
}

GMarker.prototype.VolcNameInstance = null;

GMarker.prototype.openVolcName = function(content){
	if(this.VolcNameInstance == null){
		this.VolcNameInstance = new volc(this,content);
		map.addOverlay(this.VolcNameInstance);
	}
}

GMarker.prototype.closeVolcName = function() {
	if(this.VolcNameInstance != null) {
		map.removeOverlay(this.VolcNameInstance);
		this.VolcNameInstance = null;
	}
}

// write a "loading" image to the center of the screen
function addLoader(){
	/*
	 * check to see if the loader exists
	 */
	if(!document.getElementById('http_loader')){
		var w = screen.width;
		var h = screen.height;
		var loader = document.createElement('div');
		loader.setAttribute('id', 'http_loader');
		loader.setAttribute('style', 'position:fixed;top:50px;left:50px;background-color:#fff;padding:2px;border;1px solid #999');
		loader.innerHTML = '<div style="padding:2px;border:1px solid #999;background-color:#fff;"><b>LOADING DATA</b><br /><img src="/images/loading.gif" alt="loading data" /></div>';
		document.body.appendChild(loader);
	}
	else{
		document.getElementById('http_loader').style.display = 'block';
	}
}
function removeLoader(){
	if(document.getElementById('http_loader')){
		document.getElementById('http_loader').style.display = 'none';
	}
}

//]]>