RegionalMapControl.prototype = new MQA.Control();
RegionalMapControl.prototype.constructor = RegionalMapControl;
function RegionalMapControl(width, height, controlBorder, boxBackgroundColor, boxBorder, opacity, boxRatio){
	this.selected = false;
	this.transparentImageSrc = "/img/MISC/transparent.gif";
	this.zIndex = 100;
	this.height = height;
	this.width = width;
	
	//Set Opacity
	if(opacity)
		this.opacity = opacity;
	else
		this.opacity = 35;

	//Box Background color
	if(boxBackgroundColor)
		this.boxBackgroundColor = boxBackgroundColor;	
	else
		this.boxBackgroundColor = "black";
		
	//Box Border
	if(boxBorder)
		this.boxBorder = boxBorder;
	else
		this.boxBorder = "1px dashed red";
		
	//Control Border
	if(controlBorder)
		this.controlBorder = controlBorder;
	else
		this.controlBorder = "1px solid black";
		
	//Box size compared to avaliable area
	if(boxRatio)
		this.boxRatio = boxRatio;
	else{
		this.boxRadio = .25;
	}
		
	var extra = parseInt(this.boxBorder);
	this.position = new MQA.MapCornerPlacement(MQA.MapCorner.BOTTOM_RIGHT, new MQA.Size(extra, extra));
	this.map = null;
	
	
	this._render = function(){
		
		this.elem = document.createElement("div"); 
		this.elem.style.height = this.height + "px";
		this.elem.style.width = this.width + "px";
		
		if(this.elem.style.overflow)
			this.elem.style.overflow = "none";
		else 
			this.elem.style.cssText = "overflow: none;";
		
		this.elem.style.position = "absolute"; 
	
		this.div = document.createElement("div");
		this.div.id = "container";
		this.div.style.height = this.height + "px";
		this.div.style.width = this.width + "px";
		this.div.style.zIndex = this.zIndex;
		this.div.style.border = this.controlBorder;
		this.div.style.position = "relative";
		this.elem.appendChild(this.div);
		
		this.tileMap = new MQA.TileMap(this.div);
		this.tileMap.enableDragging(false); 
		
		this.tileMap.setLogoPlacement(MQA.MapLogo.MAPQUEST, new MQA.MapCornerPlacement(MQA.MapCorner.BOTTOM_RIGHT, new MQA.Size(500, 0)));
		this.tileMap.setLogoPlacement(MQA.MapLogo.SCALES, new MQA.MapCornerPlacement(MQA.MapCorner.BOTTOM_RIGHT, new MQA.Size(500, 0)));
		this.tileMap.setLogoPlacement(MQA.MapLogo.NAVTEQ_COPYRIGHT, new MQA.MapCornerPlacement(MQA.MapCorner.BOTTOM_RIGHT, new MQA.Size(500, 0)));
		this.tileMap.setLogoPlacement(MQA.MapLogo.MAPQUEST_COPYRIGHT, new MQA.MapCornerPlacement(MQA.MapCorner.BOTTOM_RIGHT, new MQA.Size(500, 0)));
		this.tileMap.setLogoPlacement(MQA.MapLogo.ICUBED_COPYRIGHT, new MQA.MapCornerPlacement(MQA.MapCorner.BOTTOM_RIGHT, new MQA.Size(500, 0)));
		
		
		this.boxDiv = document.createElement("div");
		this.boxDiv.id = "box";
		
		var h = parseInt(this.height * this.boxRadio);
		var w = parseInt(this.width * this.boxRadio);
		var t = parseInt((this.height - h)/2);
		var l = parseInt((this.width - w)/2);
		
		this.boxDiv.style.cssText = "height:" + h + "px; width:" + w + "px; top:" + t + "px; left:" + l + "px;";
		this.boxDiv.style.backgroundColor = this.boxBackgroundColor;
		this.boxDiv.style.border = this.boxBorder;
		this.boxDiv.style.position = "absolute"; 
		this.boxDiv.style.zIndex = this.zIndex + 1;
		if(this.boxDiv.style.opacity != 'undefined')
			this.boxDiv.style.opacity=this.opacity/100;
		if(this.boxDiv.style.MozOpacity != 'undefined')
			this.boxDiv.style.MozOpacity=this.opacity/100;
		if(this.boxDiv.style.filter != 'undefined')
			this.boxDiv.style.filter = "alpha(opacity=" + this.opacity + ")";
		this.div.appendChild(this.boxDiv);
		
		
		this.cover = document.createElement("div");
		this.cover.style.cssText = "height:" + this.height + "px; width:" + this.width + "px; top:0px; left:0px;";
		this.cover.style.zIndex = this.zIndex + 2;
		this.cover.style.position = "absolute";
		this.div.appendChild(this.cover);
		
		var layerImage = document.createElement("input");
		layerImage.type = "image";
		layerImage.src = this.transparentImageSrc;
		layerImage.style.cssText = "height:" + this.height + "px; width:" + this.width + "px;";
		layerImage.onclick = function(){ return false;};
		layerImage.onfocus = function(){ this.blur();};
		this.cover.appendChild(layerImage);
	}
	
	this._render();
	
}

RegionalMapControl.prototype.getHeight = function(){ return this.height;};
RegionalMapControl.prototype.getWidth = function(){ return this.width;};
RegionalMapControl.prototype.getPosition = function(){ return this.position;};
RegionalMapControl.prototype.initialize = function(map){
		this.map = map;
		MQA.EventManager.addListener(this.map, "moveend", this.eventCallback("eventmonitor"));
		MQA.EventManager.addListener(this.map, "click", this.eventCallback("eventmonitor"));
		MQA.EventManager.addListener(this.map, "zoomend", this.eventCallback("eventmonitor"));
		MQA.EventManager.addListener(this.map, "maptypechanged", this.eventCallback("eventmonitor"));
		
		SeisanEventHandler(this.cover, "mousedown", this.eventmonitor, this);
		SeisanEventHandler(this.cover, "mouseup", this.eventmonitor, this);
		SeisanEventHandler(this.cover, "mousemove", this.eventmonitor, this);
		SeisanEventHandler(this.cover, "mouseout", this.eventmonitor, this);
		
		//Event.observe(this.cover, "mousedown", this.eventCallback("eventmonitor"));
		//Event.observe(this.cover, "mouseup", this.eventCallback("eventmonitor"));
		//Event.observe(this.cover, "mousemove", this.eventCallback("eventmonitor"));
		//Event.observe(this.cover, "mouseout", this.eventCallback("eventmonitor"));
		this.setBoxDiv();
}
RegionalMapControl.prototype.setBoxDiv = function(){
	var currentZoomLevel = this.map.getZoomLevel();
	var bounds = this.map.getBounds(); 
	var ulLatLng = bounds.getUpperLeft()
	var lrLatLng = bounds.getLowerRight();
	
	var cLat = (ulLatLng.getLatitude() + lrLatLng.getLatitude())/2;
	var cLng = (ulLatLng.getLongitude() + lrLatLng.getLongitude())/2;

	this.tileMap.setCenter(this.map.getCenter());
	this.tileMap.setZoomLevel(this.map.getZoomLevel());
		
	var ulPt = this.tileMap.llToPix(ulLatLng);
	var lrPt = this.tileMap.llToPix(lrLatLng);

	var h = parseInt(this.height * this.boxRadio);
	var w = parseInt(this.width * this.boxRadio);
	var dX = parseInt((this.height - h)/2);
	var dY = parseInt((this.width - w)/2);

	//var dX = parseInt(this.width/3);
	//var dY = parseInt(this.height/3);
	
	var newULPt = new MQA.Point(ulPt.getX() - dX, ulPt.getY() - dY);
	var newLRPt = new MQA.Point(lrPt.getX() + dX, lrPt.getY() + dY);
	
	bounds = new MQA.RectLL( this.map.pixToLL(newULPt), this.map.pixToLL(newLRPt));
	this.tileMap.zoomToRect(bounds, true);	
	
	var ulPt = this.tileMap.llToPix(ulLatLng);
	var lrPt = this.tileMap.llToPix(lrLatLng);

	this.boxDiv.style.top = ulPt.getY() + "px";
	this.boxDiv.style.left = ulPt.getX() + "px";
	this.boxDiv.style.height = Math.abs(lrPt.getY() - ulPt.getY()) + "px";
	this.boxDiv.style.width = Math.abs(lrPt.getX() - ulPt.getX()) + "px";

	if(ulPt.getY() < 0 || ulPt.getX() < 0){
		this.elem.style.display = "none";
	}
	else {
		this.elem.style.display = "";
	}
	
}
RegionalMapControl.prototype.changeCenter = function(){
	var cy = this.boxDiv.style.top + parseInt(this.boxDiv.style.height/2);
	var cx = this.boxDiv.style.left + parseInt(this.boxDiv.style.width/2);
}


RegionalMapControl.prototype.moveBy = function(dx, dy){
	var cx = parseInt(this.width/2) + dx;
	var cy = parseInt(this.height/2) + dy;
	
	var cll = this.tileMap.pixToLL(new MQA.Point(cx, cy));
	this.map.setCenter(cll);
	this.map.getDeclutter().setDeclutterMode(0);
	this.map.getDeclutter().setDeclutterMode(2);
	
	this.setBoxDiv();
	
}

RegionalMapControl.prototype.eventmonitor = function(evt){
	var x = 0;
	var y = 0;
	if(evt.layerX){
		x = evt.layerX
	}
	else {
		x = evt.x
	}
	if(evt.layerY){
		y = evt.layerY
	}
	else {
		y = evt.y
	}
	switch(evt.type){
		case "mousedown":
			if(x>= parseInt(this.boxDiv.style.left) &&  x<= parseInt(this.boxDiv.style.left) + parseInt(this.boxDiv.style.width)
				&& y >= parseInt(this.boxDiv.style.top) &&  y <= parseInt(this.boxDiv.style.top) + parseInt(this.boxDiv.style.height)){
				this.selected = true;
				this.currentClickXY = new MQA.Point(x, y);
				this.dx = 0;
				this.dy = 0;
			}
			break;
		case "mouseup":
			if(this.selected){
				this.selected = false;
				this.moveBy(this.dx, this.dy);
				
			}
			break;
		case "mousemove":
			if(this.selected){
				var acutalClickXY = new MQA.Point(x, y);
				var tdx = acutalClickXY.getX() - this.currentClickXY.getX();
				var tdy = acutalClickXY.getY() - this.currentClickXY.getY();
				this.boxDiv.style.top = (parseInt(this.boxDiv.style.top) + tdy) + "px";
				this.boxDiv.style.left = (parseInt(this.boxDiv.style.left) + tdx) + "px";
				this.currentClickXY = acutalClickXY;
				this.dx += tdx;
				this.dy += tdy;
			}
			break;
		default:
			this.tileMap.setMapType(this.map.getMapType());
			this.selected = false;		
			this.setBoxDiv();
	}
	
	
	return true;	
}
RegionalMapControl.prototype.eventCallback = function(f_0){
	var c21 = this;
	return function(event){if(!event){event = window.event;}c21[f_0](event);};
}