var clickArea, zoomBox, mapImage, mapHolder, refImage;
var mapWindow;
var firstclick, mousedrag;
var mapData = [];
var mapClicked = false, processing = false;
var resizeTimer, loadingTimer;
var lastHeight = 0;
var loadingText;
var extentHistory = [];
var ZOOMIN = "2", ZOOMOUT = "-2", ZOOMPAN = "1";

function Initialize(){
	WindowResize();

	zoomBox = document.getElementById('zoombox');
	clickArea = document.getElementById('clickarea');
	mapImage = document.getElementById('mapimage');
	mapHolder = document.getElementById('mapholder');
	refImage = document.getElementById('refimage');

	clickArea.onmousedown = MapClick;
	document.onmousemove = MapDrag;
	document.onmouseup = MapUnClick;
	clickArea.onmousewheel = MapWheel;
	if(clickArea.addEventListener){
        clickArea.addEventListener('DOMMouseScroll', MapWheel, false);
	}
	refImage.onmousedown = RefClick;
	window.onresize = WindowResize;

	if(typeof(zoomBox.style.filter) != "undefined"){
		zoomBox.style.filter = "alpha(opacity=20)";
	}
}

function MapClick(evt){
	if(processing){
		return false;
	}

	evt = evt || window.event;
	var button = GetMouseButton(evt);

	if(button == "RIGHT"){
		return;
	}
	if(button == "MIDDLE"){
		ChangeZoom(ZOOMPAN);
	}

	mapClicked = true;
	firstclick = XyFetch(evt);
	mapData["x1"] = firstclick.x - mapWindow.x;
	mapData["y1"] = firstclick.y - mapWindow.y;
	if(mapData["zoom"] != ZOOMPAN){
		SetObjDim(zoomBox, new rect(firstclick.x, firstclick.y, 1, 1));
	}
}

function MapDrag(evt){
	evt = evt || window.event;
	mousedrag =  XyFetch(evt);

	if(!mapClicked){
		return;
	}

	var diffx = mousedrag.x - firstclick.x;
	var diffy = mousedrag.y - firstclick.y;
	if(mapData["zoom"] == ZOOMPAN){
		mapImage.style.left = diffx + 'px';
		mapImage.style.top = diffy + 'px';
	}
	else{
		var zoomRect = new rect(0, 0, 10, 10);
		zoomRect.width = Math.abs(diffx);
		zoomRect.height = Math.abs(diffy);
		
		zoomBox.style.visibility = (zoomRect.width > 10 && zoomRect.height > 10) ? 'visible' : 'hidden';

		zoomRect.x = (diffx < 0) ? (firstclick.x + diffx) : firstclick.x;
		zoomRect.y = (diffy < 0) ? (firstclick.y + diffy) : firstclick.y;

		if(zoomRect.x < mapWindow.x || zoomRect.y < mapWindow.y || mapWindow.width < (zoomRect.width + zoomRect.x - mapWindow.x) || mapWindow.height < (zoomRect.height + zoomRect.y - mapWindow.y)){
			return; 
		}
			
		SetObjDim(zoomBox, new rect(zoomRect.x, zoomRect.y, zoomRect.width, zoomRect.height));
	}

	if(button == "MIDDLE"){
		if(evt.preventDefault){
			evt.preventDefault();
		}
		evt.returnValue = false;
	}
}

function MapUnClick(evt){
	if(!mapClicked){
		return;
	}
	evt = evt || window.event;
	var button = GetMouseButton(evt);
	if(button == "RIGHT"){
		return;
	}

	mapClicked = false;

	var finalclick = XyFetch(evt);
	mapData["x2"] = finalclick.x - mapWindow.x;
	mapData["y2"] = finalclick.y - mapWindow.y;
	SendXMLHTTPRequest();
}

function MapWheel(evt){	
	if(processing){
		return false;
	}

	evt = evt || window.event;

	var delta = 0;
	if(evt.wheelDelta){
		delta = evt.wheelDelta;
	}
	else if(evt.detail){
		delta = -1 * evt.detail;
	}

	if(delta > 0){
		ChangeZoom(ZOOMIN);
	}	
	else if(delta < 0){
		ChangeZoom(ZOOMOUT);
	}

	mapData["x1"] = mousedrag.x - mapWindow.x;
	mapData["y1"] = mousedrag.y - mapWindow.y;
	mapData["x2"] = mousedrag.x - mapWindow.x;
	mapData["y2"] = mousedrag.y - mapWindow.y;
	SendXMLHTTPRequest();

	if(evt.preventDefault){
		evt.preventDefault();
	}
	evt.returnValue = false;
}

function RefClick(evt){
	evt = evt || window.event;
	var button = GetMouseButton(evt);
	if(button == "RIGHT"){
		return;
	}

	firstclick = XyFetch(evt);
	var refWindow = BlockToRect(refImage);
	mapData["refx"] = firstclick.x - refWindow.x;
	mapData["refy"] = firstclick.y - refWindow.y;
	SendXMLHTTPRequest();
}

function ProcessXMLData(reqxml){
	var mapWidth = reqxml.getElementsByTagName('width')[0].getAttribute('value');
	var mapHeight = reqxml.getElementsByTagName('height')[0].getAttribute('value');

	mapImage.src = "images/nothing.gif";
	mapImage.src = reqxml.getElementsByTagName('img_url')[0].getAttribute('value');
	mapImage.width = mapWidth;
	mapImage.height = mapHeight;

	refImage.src = reqxml.getElementsByTagName('ref_img_url')[0].getAttribute('value');

	mapData["mapext"] = reqxml.getElementsByTagName('mapext')[0].getAttribute('value');
	mapData["x1"] = "";
	mapData["y1"] = "";
	mapData["x2"] = "";
	mapData["y2"] = "";
	mapData["refx"] = "";
	mapData["refy"] = "";

	extentHistory.push(mapData["mapext"]);

	ChangeZoom(reqxml.getElementsByTagName('zoom')[0].getAttribute('value'));

	mapWindow = new rect(0, 0, mapWidth, mapHeight);
	SetObjDim(mapImage, mapWindow);
	SetObjDim(clickArea, mapWindow);
	SetObjDim(mapHolder, mapWindow);

	zoomBox.style.visibility = 'hidden';
	ToggleLoadScreen(false);

	var layerList = document.getElementById('layerlist');
	while(layerList.childNodes.length > 0){
		layerList.removeChild(layerList.childNodes[0]);
	}
	var layerGroups = reqxml.getElementsByTagName('layergroup');
	for(var i=0; i<layerGroups.length; i++){
		var layerValue = layerGroups[i].getAttribute('value');
		var layerName = layerGroups[i].getAttribute('name');
		var bDisabled = (layerValue > 1) ? 1 : 0;
		var bChecked = layerValue % 2;

		var listItem = document.createElement("li");
		listItem.className = (bDisabled) ? "disabled" : "";

		var checkBox = document.createElement("input");
		checkBox.type = "checkbox";
		checkBox.name = (bDisabled) ? "layerGroup_disabled[" + layerName + "]" : "layerGroup[" + layerName + "]";
		listItem.appendChild(checkBox);

		mapData["layerGroup[" + layerName + "]"] = bChecked;
		checkBox.checked = bChecked;
		checkBox.disabled = bDisabled;

		var sText = (bDisabled) ? layerName + "*" : layerName;
		var textNode = document.createTextNode(sText);
		listItem.appendChild(textNode);

		layerList.appendChild(listItem);
	}

	var legendList = document.getElementById('legendlist');
	while(legendList.childNodes.length > 0){
		legendList.removeChild(legendList.childNodes[0]);
	}
	var legendItems = reqxml.getElementsByTagName('legenditem');
	for(var i=0; i<legendItems.length; i++){
		var listItem = document.createElement("li");

		var textNode = document.createTextNode(legendItems[i].getAttribute('name'));
		listItem.appendChild(textNode);

		var legendImage = document.createElement("img");
		legendImage.alt = legendItems[i].getAttribute('name');
		legendImage.src = legendItems[i].getAttribute('value');
		listItem.appendChild(legendImage);

		legendList.appendChild(listItem);
	}

	processing = false;
}

function SendXMLHTTPRequest(){

	var qry_string = "";
	for(var j in mapData){
		qry_string = qry_string + j + "=" + mapData[j] + "&";
	}

	var xmlreq = CreateXMLHTTPRequest();
	if(xmlreq){
		processing = true;
		ToggleLoadScreen(true);
		xmlreq.onreadystatechange = function(){
			if(xmlreq.readyState == 4){
				if(xmlreq.status == 200){
					if(!xmlreq.responseXML){
						alert(xmlreq.responseText);
					}
					else{
						ProcessXMLData(xmlreq.responseXML);
					}
				}
				else{
					alert("There was a problem retrieving the XML data:\n" + xmlreq.statusText);
				}
			}
		};
		xmlreq.open('GET', 'get_map.php?' + qry_string, true);
		xmlreq.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
		xmlreq.send(null);
	}
}

function ChangeZoom(zoomVal){
	mapData["zoom"] = zoomVal;

	var imgSrc = "";
	var zoomTools = [];
	zoomTools["2"] = "btnZin";
	zoomTools["-2"] = "btnZout";
	zoomTools["1"] = "btnPan";
	for(var i in zoomTools){
		imgSrc = document.getElementById(zoomTools[i]).src;
		imgSrc = (i == zoomVal) ? imgSrc.replace(/1/,"2") : imgSrc.replace(/2/,"1");
		document.getElementById(zoomTools[i]).src = imgSrc;
	}

	if(mapData["zoom"] == ZOOMPAN){
		clickArea.style.cursor = 'url("images/pan.cur"), move';
	}
	else if(mapData["zoom"] == ZOOMIN){
		clickArea.style.cursor = 'url("images/zoomin.cur"), crosshair';
	}
	else if(mapData["zoom"] == ZOOMOUT){
		clickArea.style.cursor = 'url("images/zoomout.cur"), crosshair';
	}
}

function ToggleLayers(){
	var layerHolder = document.getElementById('layers');
	var layerButton = document.getElementById('btnLyr');
	layerButton.src = (layerHolder.style.display == 'block') ? layerButton.src.replace(/2/,"1") : layerButton.src.replace(/1/,"2");
	layerHolder.style.display = (layerHolder.style.display == 'block') ? 'none' : 'block';
}

function ToggleLegend(){
	var legendHolder = document.getElementById('legend');
	var legendButton = document.getElementById('btnLgd');
	legendButton.src = (legendHolder.style.display == 'block') ? legendButton.src.replace(/2/,"1") : legendButton.src.replace(/1/,"2");
	legendHolder.style.display = (legendHolder.style.display == 'block') ? 'none' : 'block';
}

function RedrawMap(){
	var layerHolder = document.getElementById('layers');
	var layerInputs = layerHolder.getElementsByTagName('input');
	for(var i=0; i<layerInputs.length; i++){
		mapData[layerInputs[i].name] = (layerInputs[i].checked == true) ? 1 : 0;
	}
	SendXMLHTTPRequest();
}

function ZoomPrevious(){
	if(extentHistory.length > 1){
		extentHistory.pop();
	}
	mapData["mapext"] = extentHistory.pop();
	SendXMLHTTPRequest();
}

function ZoomExtents(){
	mapData["mapext"] = "";
	SendXMLHTTPRequest();
}

function WindowResize() {
	if(lastHeight != document.documentElement.clientHeight){
		window.clearTimeout(resizeTimer);
		resizeTimer = window.setTimeout(ResizeMap, 100);
		lastHeight = document.documentElement.clientHeight;
	}
}

function ResizeMap(){
	mapData['width'] = document.documentElement.clientWidth;
	mapData['height'] = document.documentElement.clientHeight;
	SendXMLHTTPRequest();
}

function PrintMap(){
	window.print();
}

function ToggleRef(obj){
	obj.src = (refImage.style.display == "none") ? "images/refcontract.gif" : "images/refexpand.gif";
	refImage.style.display = (refImage.style.display == "none") ? "block" : "none";
}

function ToggleLoadScreen(bShow){
	if(bShow == true){
		loadingTimer = window.setTimeout(AnimateLoadScreen, 0);
		document.getElementById('loadscreen').style.visibility = 'visible';
	}
	else{
		document.getElementById('loadscreen').style.visibility = 'hidden';
		window.clearTimeout(loadingTimer);
		if(loadingText){
			loadingText.nodeValue = 'Loading';
		}
	}
}

function AnimateLoadScreen(){
	var nodes = document.getElementById('loadscreen').childNodes;
	var sDots;
	
	for(i=0; i<nodes.length; i++){
		if(nodes[i].nodeType == 3){
			loadingText = nodes[i];
			break;
		}
	}

	sTxt = loadingText.nodeValue;
	loadingText.nodeValue = 'Loading';

	if(loadingText){
		sDots = sTxt.substring(7);
		if(sDots.length < 5){
			for(i=0; i<sDots.length + 1; i++){
				loadingText.nodeValue += '.';
			}
		}
	}

	loadingTimer = window.setTimeout(AnimateLoadScreen, 300);
}

function GetMouseButton(evt){
	if (evt.which == null)
		/* IE case */
		button= (evt.button < 2) ? "LEFT" : ((evt.button == 4) ? "MIDDLE" : "RIGHT");
	else
		/* All others */
		button= (evt.which < 2) ? "LEFT" : ((evt.which == 2) ? "MIDDLE" : "RIGHT");
	return button;
}