/**
 * @fileOverview A collection of objects for the rectangular zoom control.
 * @name RectangularZoom
 */

/** 
 * Rectangular Zoom Control object
 * @constructor
 */
function RectangularZoomControl(){
	this.backgroundColor = "black";
	this.border = "2px dashed red";
	this.shadeOpacity = 40;
	this.iZoomLevels = 16;
	this.btn = 0;
	
	this.position = new MQA.MapCornerPlacement(MQA.MapCorner.TOP_LEFT, new MQA.Size(0, 0));
	this.map = null;
	
	/** 
	 * if rectangular zoom is not enabled, then enable. Else disable
	 * @function
	 */
	this.on = function(){
		if(this.clickenabled)
			this.off();
		else {
			this.clickenabled = true;
			this.overlay.style.display = "";
			this.overlay.style.top = 0;
			this.overlay.style.left = 0;
			var size = this.map.getSize();
			this.overlay.style.width = size.getWidth();
			this.overlay.style.height = size.getHeight();
			//this.map.enableDragging(false);
		}
	}
	
	/** 
	 * disable rectangular zoom functionality
	 * @function
	 */
	this.off = function(){
		this.clickenabled = false;
		this.overlay.style.display = "none";
		//this.map.enableDragging(true);
	}
	
	/** 
	 * render this as a html element
	 * @function
	 */
	this._render = function(){
		
		this.overlay = document.createElement("div");
		this.overlay.style.position = "absolute"; 
		this.overlay.style.display = "none"; 
		this.overlay.style.zIndex = 99;
		this.overlay.style.opacity = 0;
		this.overlay.style.filter = 'alpha(opacity=0)';
		this.overlay.style.backgroundColor = "#e0e0e0";
		this.overlay.style.cursor = "pointer";
		
		this.box = document.createElement("div");
		this.box.style.display = "none"; 
		this.box.style.border = this.border;
		this.box.style.position = "absolute";
		this.box.style.zIndex = 1; 
		this.box.style.opacity = this.shadeOpacity / 100;
		this.box.style.filter = 'alpha(opacity=' + this.shadeOpacity+ ')';
		this.box.style.backgroundColor = this.backgroundColor;
		this.box.style.cursor = "pointer";
		
	}
	
	/** 
	 * get the y coordinate of the event of the element that generated it
	 * @function
	 * @param {Event} e the generated event 
	 */
	this._getTop = function(e) {
	  if (!e.offsetY) return e.layerY;
	  else return e.offsetY;
	}
	
	/** 
	 * get the x coordinate of the event of the element that generated it 
	 * @function
	 * @param {Event} e the generated event
	 */
	this._getLeft = function(e) {
	  if (!e.offsetX) return e.layerX;
	  else return e.offsetX;
	}
	
	/** 
	 * remove all child nodes from the node
	 * @function
	 * @param {Node} node node to remove all children from
	 */
	this._clearNode = function(node){
		var children = node.childNodes;
		for(var i = children.length - 1; i  >= 0; i--){
			node.removeChild(children[i]);
		}
	}
	
	this._buttonPressed = function(e){
		var click = -1;
		if (!e) var e = window.event;
		if (e.which) click = e.which;
		else if (e.button) click = e.button;
		if(navigator.appName == "Microsoft Internet Explorer"){
			switch(click){
				case 1:
					click = 1;
					break;
				case 4:
					click = 2;
					break;
				case 2:
					click = 3;
			}
		}
		
		return click
	}
	
	/** 
	 * handle the mouse down event
	 * @function
	 * @param {Event} e the generated event
	 */
	this._mousedown = function(e){
		if(this._buttonPressed(e) == 3){	
			this.map.getRolloverWindow().hide();
			if(PropertySearch){
				PropertySearch.closeInfoWindow();
			}
			this.map.setRolloversEnabled(false);
			this.map.enableDragging(false);

			this.btn = e.button;
			this.startX = this._getLeft(e);
			this.startY = this._getTop(e);
			this.box.style.display = "";
			this.box.style.top = this.startY;
			this.box.style.left = this.startX;
			this.box.style.width = 0;
			this.box.style.height = 0;
			this.box.style.display = "";
		}
		return true;
	}
	
	/** 
	 * handle the mouse up event
	 * @function
	 * @param {Event} e the generated event
	 */
	this._mouseup = function(){
		if(this.box.style.display == ""){
			this.map.setRolloversEnabled(true);
			this.map.enableDragging(true);

			this.boxDisplay = true;	
			this.box.style.display = "none";
			
			var pnt1 = new MQPoint();
			pnt1.setY(parseInt(this.box.style.top));
			pnt1.setX(parseInt(this.box.style.left));
			var lat1 = this.map.pixToLL(pnt1);
			
			var pnt2 = new MQPoint();
			pnt2.setY(parseInt(this.box.style.top) + parseInt(this.box.style.height));
			pnt2.setX(parseInt(this.box.style.left) + parseInt(this.box.style.width));
			var lat2 = this.map.pixToLL(pnt2);
		
		
			var rect = new MQA.RectLL(lat1, lat2);
			this.map.zoomToRect(rect);
		}		
		return true;
	}
	
	/** 
	 * handle the mouse click event
	 * @function
	 * @param {Event} e the generated event
	 */
	this._click = function(){
		return false;
	}
	
	/** 
	 * handle the mouse move event
	 * @function
	 * @param {Event} e the generated event
	 */
	this._mousemove = function(e){
		if(PropertySearch)
			PropertySearch.closeInfoWindow();
		if(this.box.style.display == ""){
			var x = this._getLeft(e);
			var y = this._getTop(e);
			
			this.box.style.top = Math.min(this.startY, y);
			this.box.style.left = Math.min(this.startX, x);
			this.box.style.width = Math.abs(this.startX - x);
			this.box.style.height = Math.abs(this.startY - y);			
		}
		else {		
			var shapes = this.map.getShapes();
			for(var i = 0; i < shapes.getSize(); i++){
				var poi = shapes.getAt(i);
				if(poi._isMouseOnPoi(e)){
					poi.showRolloverWindow();
				}
			}
		}
		return true;
	}

	this.getHeight = function(){ return this.spriteGen.img.aImgDef[18].height;};
	this.getWidth = function(){ return this.spriteGen.img.aImgDef[18].width;};
	this.getPosition = function(){ return this.position;};
	this.initialize = function(map){
		this.map = map;
		this.draw();
	}
	
	
	this.draw = function(){		
		var div = this.map.parent;			
		div.appendChild(this.box);
		div.appendChild(this.overlay);
		
		
				
		EventManager.addEvent(this.overlay, "mousedown", this._mousedown, this);		
		EventManager.addEvent(this.overlay, "mouseup", this._mouseup, this);
		EventManager.addEvent(this.overlay, "mousemove", this._mousemove, this);
		
		div.oncontextmenu= function(){return false;};
		
		this.on();
		
	}
	
	
	this._render();

}