var R_ZOOM_CONTROL_BUTTON_WIDTH = 26;
var R_ZOOM_CONTROL_BUTTON_HEIGHT = 26;
var R_ZOOM_CONTROL_BUTTON_SPACE = 4;
var R_ZOOM_CONTROL_SLIDER_SPACE = 8;
var R_ZOOM_CONTROL_SLIDER_WIDTH = 26;
var R_ZOOM_CONTROL_SLIDER_HEIGHT = 120;
var R_ZOOM_CONTROL_HANDLE_WIDTH = 26;
var R_ZOOM_CONTROL_HANDLE_HEIGHT = 10;

function ReallyZoomControl() {
}

ReallyZoomControl.prototype = new GControl();

ReallyZoomControl.prototype.initialize = function(map) {
	this.container = document.createElement("div");

	this.drag = null;

	var moveUpElement = this.createButtonElement("img_btn_up.png", R_ZOOM_CONTROL_BUTTON_WIDTH + R_ZOOM_CONTROL_BUTTON_SPACE, 0);
	this.container.appendChild(moveUpElement);
	GEvent.addDomListener(moveUpElement, "click", function() {
		map.panDirection(0, 1);
	});

	var moveLeftElement = this.createButtonElement("img_btn_left.png", 0, R_ZOOM_CONTROL_BUTTON_HEIGHT + R_ZOOM_CONTROL_BUTTON_SPACE);
 	this.container.appendChild(moveLeftElement);
	GEvent.addDomListener(moveLeftElement, "click", function() {
		map.panDirection(1, 0);
	});

	var returnToSavedElement = this.createButtonElement("img_btn_center.png", R_ZOOM_CONTROL_BUTTON_WIDTH + R_ZOOM_CONTROL_BUTTON_SPACE, R_ZOOM_CONTROL_BUTTON_HEIGHT + R_ZOOM_CONTROL_BUTTON_SPACE);
	this.container.appendChild(returnToSavedElement);
	GEvent.addDomListener(returnToSavedElement, "click", function() {
		map.returnToSavedPosition();
	});

	var moveRightElement = this.createButtonElement("img_btn_right.png", (R_ZOOM_CONTROL_BUTTON_WIDTH + R_ZOOM_CONTROL_BUTTON_SPACE) * 2, R_ZOOM_CONTROL_BUTTON_HEIGHT + R_ZOOM_CONTROL_BUTTON_SPACE);
	this.container.appendChild(moveRightElement);
	GEvent.addDomListener(moveRightElement, "click", function() {
		map.panDirection(-1, 0);
	});

	var moveDownElement = this.createButtonElement("img_btn_down.png", R_ZOOM_CONTROL_BUTTON_WIDTH + R_ZOOM_CONTROL_BUTTON_SPACE, (R_ZOOM_CONTROL_BUTTON_HEIGHT + R_ZOOM_CONTROL_BUTTON_SPACE) * 2);
	this.container.appendChild(moveDownElement);
	GEvent.addDomListener(moveDownElement, "click", function() {
		map.panDirection(0, -1);
	});

	var zoomInElement = this.createButtonElement("img_btn_zoomin.png", R_ZOOM_CONTROL_BUTTON_WIDTH + R_ZOOM_CONTROL_BUTTON_SPACE, ((R_ZOOM_CONTROL_BUTTON_HEIGHT + R_ZOOM_CONTROL_BUTTON_SPACE) * 3) + R_ZOOM_CONTROL_SLIDER_SPACE);
	this.container.appendChild(zoomInElement);
	GEvent.addDomListener(zoomInElement, "click", function() {
		map.zoomIn();
	});

	/*
	var zoomSliderElement = this.createZoomElement_(map);
	this.container.appendChild(zoomSliderElement);
	*/

	// var zoomOutElement = this.createButtonElement("img_btn_zoomout.png", R_ZOOM_CONTROL_BUTTON_WIDTH + R_ZOOM_CONTROL_BUTTON_SPACE, ((R_ZOOM_CONTROL_BUTTON_HEIGHT + R_ZOOM_CONTROL_BUTTON_SPACE) * 4) + R_ZOOM_CONTROL_SLIDER_SPACE + R_ZOOM_CONTROL_SLIDER_HEIGHT + R_ZOOM_CONTROL_BUTTON_SPACE);
	var zoomOutElement = this.createButtonElement("img_btn_zoomout.png", R_ZOOM_CONTROL_BUTTON_WIDTH + R_ZOOM_CONTROL_BUTTON_SPACE, ((R_ZOOM_CONTROL_BUTTON_HEIGHT + R_ZOOM_CONTROL_BUTTON_SPACE) * 4) + R_ZOOM_CONTROL_SLIDER_SPACE);
	this.container.appendChild(zoomOutElement);
	GEvent.addDomListener(zoomOutElement, "click", function() {
		map.zoomOut();
	});

	map.getContainer().appendChild(this.container);
	return(this.container);
}

ReallyZoomControl.prototype.getDefaultPosition = function() {
	return new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(15, 15));
}

ReallyZoomControl.prototype.createZoomElement_ = function(map) {
	var zoomSliderElement = document.createElement("div");
	zoomSliderElement.style.width = R_ZOOM_CONTROL_SLIDER_WIDTH + "px";
	zoomSliderElement.style.height = R_ZOOM_CONTROL_SLIDER_HEIGHT + "px";
	zoomSliderElement.style.left = R_ZOOM_CONTROL_BUTTON_WIDTH + R_ZOOM_CONTROL_BUTTON_SPACE + "px";
	zoomSliderElement.style.top = ((R_ZOOM_CONTROL_BUTTON_HEIGHT + R_ZOOM_CONTROL_BUTTON_SPACE) * 4) + R_ZOOM_CONTROL_SLIDER_SPACE + "px";
	zoomSliderElement.style.backgroundColor = "white";
	zoomSliderElement.style.cursor = "pointer";
	zoomSliderElement.style.position = "relative";
	zoomSliderElement.style.zIndex = 10;
	// zoomSliderElement.style.visibility = 'hidden';
	// zoomSliderElement.style.opacity = "50%";

	var max = R_ZOOM_CONTROL_SLIDER_HEIGHT - R_ZOOM_CONTROL_HANDLE_HEIGHT;

	var zoomHandleElement = document.createElement("div");
	zoomHandleElement.style.width = R_ZOOM_CONTROL_HANDLE_WIDTH + "px";
	zoomHandleElement.style.height = R_ZOOM_CONTROL_HANDLE_HEIGHT + "px";
	zoomHandleElement.style.position = 'absolute';
	zoomHandleElement.style.backgroundColor = "red";
	zoomHandleElement.style.zIndex = 1000;
	zoomHandleElement.style.top = (max - ((max * map.getZoom()) / 17)) + "px";
	// zoomHandleElement.style.top = 80 + "px";

	GEvent.addListener(map, "zoomend",
		GEvent.callback(zoomHandleElement, function(oldLevel, newLevel) {
			GLog.write('New zoom level ' + newLevel);
			this.style.top = (max - ((max * newLevel) / 17)) + "px";
		}
	));

	GEvent.addDomListener(zoomHandleElement, "mousedown",
		GEvent.callback(this, function(e) {
			GLog.write('Mouse down');
			// this.style.top = (max - ((max * newLevel) / 17)) + "px";
			this.drag = {
				begin: ReallyZoomControl.getMousePosition(e),
				left: zoomSliderElement.left,
				top: zoomSliderElement.top
			};
		}
	));

	GEvent.addDomListener(zoomHandleElement, "mouseup",
		GEvent.callback(this, function(e) {
			GLog.write('Mouse up');
			// this.style.top = (max - ((max * newLevel) / 17)) + "px";
			this.drag = null;
		}
	));

	
	GEvent.addDomListener(zoomHandleElement, "mousemove",
		GEvent.callback(this, function(e) {
			// this.style.top = (max - ((max * newLevel) / 17)) + "px";
			// GLog.write('Move');
			if(this.drag != null) {
				var pos = ReallyZoomControl.getMousePosition(e);
				pos.x -= this.drag.left;
				pos.y -= this.drag.top;
				
				var zoom = (pos.y * 17) / max;
				map.setZoom(zoom);
				
				// GLog.write('Position' + (pos.left - this.drag.left) + ', ' + (pos.top - this.drag.top));
				// GLog.write('drag start: ' + (this.drag.begin.left) + ', ' + (this.drag.begin.top));
				GLog.write('Position: ' + (pos.left) + ', ' + (pos.top));
			}
		}
	));

	GEvent.addDomListener(zoomHandleElement, "dragend",
		GEvent.callback(zoomHandleElement, function() {
			GLog.write('Drag end');
			// this.style.top = (max - ((max * newLevel) / 17)) + "px";
		}
	));

	zoomSliderElement.appendChild(zoomHandleElement);

	return(zoomSliderElement);
}

ReallyZoomControl.prototype.screenToSlider_ = function(scrX, scrY) {
	var pos = { x: scrX - zoomSliderElement, y: scrY };
	return(pos);
}

ReallyZoomControl.prototype.createButtonElement = function(imgUrl, x, y) {
	var button = document.createElement("div");
  
	button.style.color = "black";
	button.style.width = R_ZOOM_CONTROL_BUTTON_WIDTH + "px";
	button.style.height = R_ZOOM_CONTROL_BUTTON_HEIGHT + "px";
	button.style.font = "small Arial";
	button.style.textAlign = "center";
	button.style.cursor = "pointer";
	button.style.position = "absolute";
	button.style.left = "" + x + "px";
	button.style.top = "" + y + "px";

	var nv = navigator.appVersion;
	if (nv.match("MSIE 6.0") || nv.match("MSIE 5.")) {
		button.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/style/images/gmap/" + imgUrl + "', sizingMethod='crop')";
	}
	else {
		button.style.background = "url(/style/images/gmap/" + imgUrl + ") no-repeat left top";
	}

	return(button);
}

ReallyZoomControl.getMousePosition = function(e) {
	var posX = 0;
	var posY = 0;
	if (!e) var e = window.event;
	if (e.pageX || e.pageY) {
		posX = e.pageX;
		posY = e.pageY;
	}
	else if (e.clientX || e.clientY) {
		posX = e.clientX + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft);
		posY = e.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop);
	}


	GLog.write('Position: ' + posX + ',' + posY);	     
	return({
		x: posX,
		y: posY
/*		left: posX - (R_ZOOM_CONTROL_BUTTON_WIDTH + R_ZOOM_CONTROL_BUTTON_SPACE),
		top: posY - (((R_ZOOM_CONTROL_BUTTON_HEIGHT + R_ZOOM_CONTROL_BUTTON_SPACE) * 4) + R_ZOOM_CONTROL_SLIDER_SPACE)
*/
	});  
};