/*-----------------------------------------------------------------------
Overview JavaScript File

version: 	4.1
author:		sebastian kupke
email:		sebastian.kupke@baral-geohaus.de
website:	http://www.baral.de
-----------------------------------------------------------------------*/

/* =namespace module overview
-----------------------------------------------------------------------*/
ws.m.overview = {
	
	// the current extent of the rect
	extent: null,
	
	// rectMinSize
	rectMinSize: 0,

	/* =init
	-----------------------------------------------------------------------*/
	init: function() {
	
		/* =init drag/drop
		-----------------------------------------------------------------------*/
		$('#m_overview_rect').draggable({
			opacity: 0.3,
			stop: function() {
				var ext = ws.m.overview.extent;
				
				var overviewWidth = $('#m_overview_map').width();
				var overviewHeight = $('#m_overview_map').height();
				var overviewWidthMeter = ext.maxx - ext.minx;
				var overviewHeightMeter = ext.maxy - ext.miny;
				
				var top = parseInt($(this).css('top'));
				var left = parseInt($(this).css('left'));
				
				var width = $(this).width();
				var height = $(this).height();
				
				// calculate center coords
				var overviewCenterX = left + (width / 2);
				var overviewCenterY = top + (height / 2);
				
				var diffCenterX = (overviewWidthMeter * overviewCenterX) / overviewWidth;
				var diffCenterY = (overviewHeightMeter * overviewCenterY) / overviewHeight;
				
				ws.map.center.x = ext.minx + diffCenterX;
				ws.map.center.y = ext.maxy - diffCenterY;
				
				ws.map.load();
			}
		});
		
		var flag = false;
		var start = null;
		
		/* =charge rect
		-----------------------------------------------------------------------*/
		$('#m_overview_div').mousedown(function(e) {
			
			// don't create new rect when click was on the current overview rect
			if (e.target.id == 'm_overview_map') {
				
				start = ws.m.overview.getCurPx(e);
			    
				$('#m_overview_rect').css({
					width: '0px',
					height: '0px',
					top: start.y + 'px',
					left: start.x + 'px',
					display: 'block',
					cursor: 'pointer'
				});
				
				flag = true;
			
				/* =mousemove
				----------------------------------------*/
				$('#m_overview_div').mousemove(function(e) {
					if (flag) {
				        var pos = ws.m.overview.getCurPx(e);
				        
				        var top = (pos.y - start.y > 0) ? start.y : pos.y;
				        var left = (pos.x - start.x > 0) ? start.x : pos.x;
						
						$('#m_overview_rect').css({
							width: Math.abs(pos.x - start.x) + 'px',
							height: Math.abs(pos.y - start.y) + 'px',
							top: top + 'px',
							left: left + 'px'
						});
					}
					
					return false;
				});
				
				/* =mouseup
				----------------------------------------*/
				$('#m_overview_div').mouseup(function(e) {
					flag = false;
					
					$('#m_overview_div').unbind('mousemove');
				    $('#m_overview_div').unbind('mouseup');
				   
				    // Calculate center coords
				    var end = ws.m.overview.getCurPx(e);
				    
					if (start.x == end.x && start.y == end.y) {
						// click
						ws.map.center = ws.m.overview.px2Coords(end);
						ws.map.load();
					} else {
						// charge
						var coordsStart = ws.m.overview.px2Coords(start);
						var coordsEnd = ws.m.overview.px2Coords(end);
						
						ws.map.center = {
							x: (coordsEnd.x + coordsStart.x) / 2,
							y: (coordsEnd.y + coordsStart.y) / 2
						}
						
						var sizeX = Math.abs(coordsEnd.x - coordsStart.x);
						var sizeY = Math.abs(coordsEnd.y - coordsStart.y);
						
						if (sizeX > sizeY) {
							ws.map.scale = sizeX / $('#map_div').width();
						} else {
							ws.map.scale = sizeY / $('#map_div').height();
						}
						
						ws.map.load();
					}
					
					$('#m_overview_rect').css({
						cursor: 'move'
					});
					
					return false;
				});
			
				return false;
			}
		});
		
		/* =set rect (wait for image if necessary)
		-----------------------------------------------------------------------*/
		var loadOverviewMap = window.setInterval(function() {
			if ($('#m_overview_map').width()) {
				ws.m.overview.setRect();
				window.clearInterval(loadOverviewMap);
			}
		}, 100);
	},

	/* =set the overview rect
	-----------------------------------------------------------------------*/
	setRect: function() {
	
		var ext = ws.m.overview.extent;
		var mapExt = ws.map.getExtentCoords();
		
		// overview size
		var overviewWidth = $('#m_overview_map').width();
		var overviewHeight = $('#m_overview_map').height();
		var overviewWidthMeter = ext.maxx - ext.minx;
		var overviewHeightMeter = ext.maxy - ext.miny;
		
		// Different in meter at the corners [m]
		// *-------
		// |      |
		// --------
		var diffUpperLeftX = mapExt.minx - ext.minx;
		var diffUpperLeftY = ext.maxy - mapExt.maxy;
		
		// --------
		// |      |
		// -------*
		var diffLowerRightX = mapExt.maxx - ext.minx;
		var diffLowerRightY = ext.maxy - mapExt.miny;
		
		// upper left in pixel
		var diffUpperLeftPixelX = Math.round((diffUpperLeftX * overviewWidth) / overviewWidthMeter);
		var diffUpperLeftPixelY = Math.round((diffUpperLeftY * overviewHeight) / overviewHeightMeter);
		
		var deltaX = mapExt.maxx - mapExt.minx;
		var deltaY = mapExt.maxy - mapExt.miny;
		
		// width and height
		var diffLowerRightPixelX = Math.round((deltaX * overviewWidth) / overviewWidthMeter);
		var diffLowerRightPixelY = Math.round((deltaY * overviewHeight) / overviewHeightMeter);
		
		// if rect is too small
		//-------------------------
		var opacity = '0.5';
		var width = diffLowerRightPixelX;
		var height = diffLowerRightPixelY;
		var top = diffUpperLeftPixelY;
		var left = diffUpperLeftPixelX;
		
		if (width < ws.m.overview.rectMinSize) {
			opacity = '0.8';
			width = ws.m.overview.rectMinSize;
			left -= (ws.m.overview.rectMinSize - diffLowerRightPixelX) / 2;
		}
		if (height < ws.m.overview.rectMinSize) {
			opacity = '0.8';
			height = ws.m.overview.rectMinSize;
			top -= (ws.m.overview.rectMinSize - diffLowerRightPixelY) / 2;
		}
		
		// show rect
		//-------------------------
		$('#m_overview_rect').css('opacity', opacity).animate({ 
			width: width + 'px',
	        height: height + 'px',
	        top: top,
	        left: left
		}, 500);
		
		// IE Bug
		$('#m_overview_map').css('opacity', '1.0');
	},
	
	/* =Returns the position of the mouse cursor in pixel
	-----------------------------------------------------------------------*/
	getCurPx: function(e) {
		
		var offset = $('#m_overview_map').offset();
		
		var x = e.pageX - offset.left;
		var y = e.pageY - offset.top;
		
		return new ws.cl.Point(x, y);
	},
	
	/* =Returns the position of the mouse cursor in coords
	-----------------------------------------------------------------------*/
	getCurCoords: function(e) {
		
		var p = ws.m.overview.getCurPx(e);
		
		return ws.m.overview.px2Coords(p);
	},
	
	/* =Calculates the coordinates from given pixel
	 * 
	 * @private
	-----------------------------------------------------------------------*/
	px2Coords: function(p) {
		
		var ext = ws.m.overview.extent;
		
		var diffX = (ext.maxx - ext.minx) * p.x / $('#m_overview_map').width();
		var diffY = (ext.maxy - ext.miny) * p.y / $('#m_overview_map').height();
		
		return new ws.cl.Point(ext.minx + diffX, ext.maxy - diffY);
	}
}