var map, box;
var draggable = false, resizable = false;
var mouseX, mouseY, drawnX, drawnY, diffX, diffY;
var typecontrol = new GMapTypeControl(true);


window.onload = function() {
	// Make the variable box global
	box = document.getElementById("drag");
	// Register mouse move listener
	document.onmousemove= watchMouse;
}


window.onunload = function(){
	// Make sure that GUnload() is called when necessary on unload
	if(box.style.visibility == "visible")
	GUnload();
}


// Mouse move listener
function watchMouse(e) {
	
	// Include possible scroll values
	var sx = window.scrollX || document.documentElement.scrollLeft|| 0;
	var sy = window.scrollY || document.documentElement.scrollTop|| 0;
	
	if(!e) e = window.event; // IEs event definition
	mouseX = e.clientX + sx;
	mouseY = e.clientY + sy;
	
	/* Direction of mouse movement
	*  deltaX: -1 for left, 1 for right
	*  deltaY: -1 for up, 1 for down
	*/
	var deltaX = mouseX - diffX;
	var deltaY = mouseY - diffY;
	// Store difference in global variables
	diffX = mouseX;
	diffY = mouseY;
	
	if(resizable) { // The resize button is being held
		changeMapSize(deltaX, deltaY);
	}
	
	else if(draggable) { // The box is being dragged
		box.style.left= (mouseX - drawnX) + "px";
		box.style.top = (mouseY - drawnY) + "px";
	}
	return false;
}


function dragstart(e) { // Calculate mouse position for dragging

	draggable = true;
	drawnX = mouseX - parseInt(box.style.left);
	drawnY = mouseY - parseInt(box.style.top);
	
	/* Avoid selecting the content
	* of the box while dragging
	*/
	if(e.cancelable) { e.preventDefault(); }
	if(window.event) { window.event.returnValue = false; }
	
	// The box is being dropped
	box.onmouseup = function() { draggable = false; }
}


function loadMap(lat, lng, name) {

	if(GBrowserIsCompatible()) {
		
		var point = new GLatLng(lat, lng);
		map = new GMap2(document.getElementById("map"));
		map.setCenter(point, 14, G_HYBRID_MAP);
		map.addControl(new GSmallZoomControl());
		map.addControl(new GMapTypeControl());
		var marker = new GMarker(point);
		map.addOverlay(marker);
		GEvent.addListener(marker, "click", function() {
			marker.openInfoWindowHtml(name);
		});
		marker.openInfoWindowHtml(name);
		// Add the self created ResizeControl
		map.addControl(new ResizeControl());
		box.style.visibility = "visible";
		// Add control to switch map types if mapdiv was broad enough
		if(typecontrol.visible) map.addControl(typecontrol);
	}
}


function hideMap() {
	box.style.visibility = "hidden";
	GUnload();
}


function ResizeControl(){};
ResizeControl.prototype= new GControl();

ResizeControl.prototype.initialize=function(map) {
	
	var resizeButton = document.createElement("div");
	resizeButton.style.width = "20px";
	resizeButton.style.height = "20px";
	resizeButton.style.backgroundImage = "url('../layout/resize.gif')";
	
	resizeButton.onmousedown = function() { resizable = true; }
	document.onmouseup = function() { resizable = false; }
	var container = map.getContainer();
	container.appendChild(resizeButton);
	
	/* Move the Terms of Use 25px to the left
	* to make sure that it s fully readable
	*/
	var terms = container.childNodes[2];
	terms.style.marginRight = "25px";
	return resizeButton;
}


ResizeControl.prototype.getDefaultPosition=function() {
	return new GControlPosition(G_ANCHOR_BOTTOM_RIGHT,new GSize(0,0));
}


// Resizes the map s width and height by the given increment
function changeMapSize(dx, dy) {
	
	var mapdiv = map.getContainer();
	var width = parseInt(mapdiv.style.width);
	var height =  parseInt(mapdiv.style.height);
	
	/* Take care that the map s width or height do not get
	* a negative value. Unexpected things will happen.
	*/
	if(width < 100) { width = 100; }
	if(height < 50) { height = 50; }
	
	if(width > 400) { 
		map.addControl(typecontrol); // Switch map types
		typecontrol.visible = true;
	}
	else {
		map.removeControl(typecontrol);
		typecontrol.visible = false;
	}
	
	mapdiv.style.width = (width + dx) + "px";
	mapdiv.style.height= (height + dy) + "px";
	map.checkResize();
}