/******************************************************
Map Navigation class for Ketab e Avval Tehran map service
2007 All rights reserved, mohsentaleb.com
******************************************************/

	var mapNavigation = {
	midNavMapWidth: 180,	// Self-explanatory, huh?
	midNavMapHeight: 130,			
	fullNavMapWidth: 545,	// God damn, do you know english?!
	fullNavMapHeight: 410,
	mapActualWidth: 49632,	// hmmm.. it's a big map :>
	mapActualHeight: 37488,
	navStatus: 1,			// Navigation Default Status - 0: Minimized , 1:Normal , 2: Maximized
	zoomLevel: 2,  			// Default zoom level
	timeout: 60000,			// Timeout for retrieving map images in millisecods (30 Secs, enough? c'mon folks, buy yourself a DSL.)
	timeoutId: 0,
	offsetX: 272,			// Offset to move the map, along 4 directions, based on level zoom 4 - actually half of the screen
	offsetY: 205,
	xRatio: 91,				// Aspect ratio that the map is scaled by, to fit the navigation
	yRatio: 91.4,
	//imagerUrl: 'http://localhost/KAMapEngine/Imager.aspx',
	imagerUrl: 'http://ketabeavval.ir/MapEngine/Imager.aspx',
	x: 0,				// Global X,Y
	y: 0,
	currentX:0,
	currentY:0,
	currentZoom:0,	
	cur_lang:"Fa",
	 
		initialize: function() {
			this.maxX = this.midNavMapWidth/2;
			this.maxY = this.midNavMapHeight/2;
			
			this.initialPos = $('initialPos');
			this.theNavMap = $('navMap');
			this.theNavMapMin = $('navMapMin');
			this.theNavMapMid = $('navMapMid');
			this.theNavMapMax = $('navMapMax');
			this.theViewFinder = $('viewFinder');
			this.loading = $('loading');
			this.star = $('star');
			
			this.toRightBtn = $('toRight');
			this.toLeftBtn = $('toLeft');
			this.toTopBtn = $('toTop');
			this.toBottomBtn = $('toBottom');			
			this.tolangBtn = $('chlang');
			if(this.tolangBtn){	
			    this.tolangBtn.orghref = this.tolangBtn.href;
			}
			if(window.location.href.toLowerCase().contains("en")){
				this.cur_lang="En";
				//this.tolangBtn.children[0].innerHTML="Persian";
				this.tolangBtn.Lang="En";
				this.cur_lang="En";
				this.theNavMap.setStyle('background','#F4E4D4 url(images/navmapen.gif) no-repeat');
			}
			if(typeof(tolangBtn)!="undefined"){
				if(Map_Lang=="en"){
					//this.tolangBtn.children[0].innerHTML="Persian";
					this.tolangBtn.Lang="En";
					this.cur_lang="En";
				}
			}
/*			this.theRegionsSelector = $('regionsSelector');
			this.theRegionsCheckbox = $('regionsCheckbox');
*/

			this.zoomLevelBtns = $('zoomLevels').getElements('a');
			this.level1Btn = $('level1');
			this.level2Btn = $('level2');
			this.level3Btn = $('level3');
			this.level4Btn = $('level4');
			
			this.permalink = $('permalink');
			this.sendto = $('sendto');
			this.printable = $('printable');			

			this.legendBtn = $('legendBtn');
			this.legend = $('legend');

			if (BrowserDetect.browser == "Explorer") {
				this.IE = true;	
			}
			//this.tolangBtn.Lang="Fa";
			if(typeof(tolangBtn)!="undefined"){
			this.tolangBtn.addEvent('click', function(e){
				var srcEl = e.srcElement ? e.srcElement : e.target;
				if(this.cur_lang=="Fa")
				{
				    //srcEl.innerHTML="Persian";
				   /// this.tolangBtn.Lang="En";
					//this.cur_lang="En";
					//this.theNavMap.setStyle('background','#F4E4D4 url(images/navmapen.gif) no-repeat');
					var q='';
					if($('searchString')){
						q = '?q='+$('searchString').value;
					}
					//location.href="http://localhost/ketabeavval/map/defaulten.aspx"+ q;
				}else
				{
					//srcEl.innerHTML="English";
					//this.tolangBtn.Lang="Fa";
					//this.cur_lang="Fa";
					//this.theNavMap.setStyle('background','#F4E4D4 url(images/navmap1.gif) no-repeat');
					var q='';
					if($('searchString')){
						q = '?q='+$('searchString').value;
					}
					//location.href="http://localhost/ketabeavval/map/"+ q;
				}
				//this.goTo(this.currentX, this.currentY, this.currentZoom) ;
			}.bind(this)
			);}
			this.theNavMap.addEvent('click', function(e){
				var myEvent = new Event(e).stop();
				
				
				var scrollTop = getScrollTop();
				try{
					if(window.clientInformation){
						scrollTop = document.body.scrollTop;
					}
				}catch(exxx){
				}
				
				var xPosPointer = myEvent.client.x - this.theNavMap.getLeft();
				var yPosPointer = myEvent.client.y - this.theNavMap.getTop() + scrollTop;
				
				var posBG = this.theNavMap.getStyle('backgroundPosition').split('px');
				var xPosBG = -posBG[0].toInt();
				var yPosBG = -posBG[1].toInt();
		
				var xExactPos = xPosPointer + xPosBG;
				var yExactPos = yPosPointer + yPosBG;


				this.moveViewFinder(xExactPos, yExactPos, 0);
				this.navStatus = 1;
//				this.theRegionsSelector.setStyle('display','none');
				this.renderButtons();
				
				xExactPos = Math.round(xExactPos * this.xRatio);
				yExactPos = Math.round(yExactPos * this.yRatio);				
				this.goTo(xExactPos, yExactPos, this.zoomLevel);
				this.hideStar();
			}.bind(this));

/*			this.theRegionsCheckbox.addEvent('click', function() {
				this.toggleMap();
			  }.bind(this));
*/			
			this.level1Btn.addEvent('click', function(evt) {
				new Event(evt).stop();
				this.setZoomLevel(4);
				this.goTo(this.x, this.y, this.zoomLevel);
				this.hideStar();
			  }.bind(this));
			this.level2Btn.addEvent('click', function(evt) {
				new Event(evt).stop();
				this.setZoomLevel(3);
				this.goTo(this.x, this.y, this.zoomLevel);
				this.hideStar();
			  }.bind(this));
			this.level3Btn.addEvent('click', function(evt) {
				new Event(evt).stop();
				this.setZoomLevel(2);
				this.goTo(this.x, this.y, this.zoomLevel);
				this.hideStar();
			  }.bind(this));			
			this.level4Btn.addEvent('click', function(evt) {
				new Event(evt).stop();													  
				this.setZoomLevel(1);
				this.goTo(this.x, this.y, this.zoomLevel);
				this.hideStar();				
			  }.bind(this));

			this.toRightBtn.addEvent('click', function(evt) {
				new Event(evt).stop();
				this.toRight();
				this.hideStar();				
			  }.bind(this));
			this.toLeftBtn.addEvent('click', function(evt) {
				new Event(evt).stop();
				this.toLeft();
				this.hideStar();				
			  }.bind(this));
			this.toTopBtn.addEvent('click', function(evt) {
				new Event(evt).stop();
				this.toTop();
				this.hideStar();				
			  }.bind(this));
			this.toBottomBtn.addEvent('click', function(evt) {
				new Event(evt).stop();														
				this.toBottom();
				this.hideStar();
			  }.bind(this));
			if(this.legendBtn){
			    this.legendBtn.addEvent('click', function(evt) {
				    new Event(evt).stop();
				    this.legend.setStyle('display', 'block');
			      }.bind(this));
			 }
			this.legend.addEvent('click', function(evt) {
				new Event(evt).stop();														
				this.legend.setStyle('display', 'none');
			  }.bind(this));			
													  
			
			this.setZoomLevel(this.zoomLevel);
			this.renderButtons();
			$('map').adopt(new Element('img').setProperties({src: '', width: '545', height:'410', id:'theMap'}));
			this.theMap = $('theMap');
			var initPos = this.initialPos.getProperty('name').split(',');
			var initX = initPos[0].toInt();
			var initY = initPos[1].toInt();			
			var initZ = initPos[2].toInt();
			this.goTo(initX, initY, initZ);
			
		},
	
		drawViewFinder: function(x,y, xLastBG, yLastBG, mode) {
			var vfWidth = this.theViewFinder.getStyle('width').toInt();
			var vfHeight = this.theViewFinder.getStyle('height').toInt();
			var vfTop, vfLeft;
			
			if (mode == 1) {
			var x = Math.round(x / this.xRatio);
			var y = Math.round(y / this.yRatio);
			}
			
			vfLeft = (mode > 0) ? (x-(vfWidth / 2)) : ((x - xLastBG) - (vfWidth / 2));
			vfTop  = (mode > 0) ? (y-(vfHeight / 2)) : ((y - yLastBG) - (vfHeight / 2));
			
			if (mode == 0) {
			vfLeft = (this.midNavMapWidth - vfLeft) < vfWidth ? (this.midNavMapWidth - vfWidth) : (vfLeft < 0 ?  0 : vfLeft);
			vfTop = (this.midNavMapHeight - vfTop) < vfHeight ? (this.midNavMapHeight - vfHeight) : (vfTop < 0 ?  0 : vfTop);
			}
			else {
			vfLeft = (this.fullNavMapWidth - vfLeft) < vfWidth ? (this.fullNavMapWidth - vfWidth) : (vfLeft < 0 ?  0 : vfLeft);
			vfTop = (this.fullNavMapHeight - vfTop) < vfHeight ? (this.fullNavMapHeight - vfHeight) : (vfTop < 0 ?  0 : vfTop);
			}

			vfTransition.start({'top': vfTop, 'left': vfLeft});							

			return true;
		},
		
		moveViewFinder: function (xExactPos, yExactPos, mode) {
			this.x = xExactPos;
			this.y = yExactPos;			
			var xFakePos, yFakePos;
			var inThreshold = false;
			var xExactPos = Math.round(xExactPos / this.xRatio);
			var yExactPos = Math.round(yExactPos / this.yRatio);			
			
			xFakePos = (this.fullNavMapWidth - xExactPos) < this.maxX ?
						(this.fullNavMapWidth - this.maxX) : (xExactPos < this.maxX ?
						this.maxX : xExactPos);
			yFakePos = (this.fullNavMapHeight - yExactPos) < this.maxY ?
						(this.fullNavMapHeight - this.maxY) : (yExactPos < this.maxY ?
					   this.maxY : yExactPos);
			
			inThreshold = ((xFakePos !== xExactPos) || (yFakePos !== yExactPos)) ? true : false;
			
			var xCurrentBG = xFakePos-this.maxX;
			var yCurrentBG = yFakePos-this.maxY;
			if (this.IE) {
				this.theNavMap.setStyle('backgroundPosition', '-'+(xCurrentBG)+'px '+ '-'+(yCurrentBG)+'px');
			}
			else {
				var bgPosition = '-'+(xCurrentBG)+' -'+(yCurrentBG);
				bgMove.start(bgPosition);
			}

			this.drawViewFinder(xExactPos, yExactPos, xCurrentBG, yCurrentBG, mode);
			
			navMapMorph.start({
						'width': 180,
						'height': 130
					});
			
		},
		
		toMax: function() {
			this.drawViewFinder(this.x, this.y, 0, 0, 1);
			this.theViewFinder.setStyle('display','block');
		},
		
		toMid: function() {
			this.moveViewFinder(this.x, this.y, 0);
			this.theViewFinder.setStyle('display','block');			
		},
		
		toMin: function() {
			this.theViewFinder.setStyle('display','none');
		},
		
		toRight: function() {
			this.x = this.x + this.moveOffsetX;
			this.x = (this.x > this.mapActualWidth) ? this.mapActualWidth : this.x;
			this.goTo(this.x, this.y, this.zoomLevel);
		},
		toLeft: function() {
			this.x = this.x - this.moveOffsetX;
			this.x = (this.x < 0) ? 0 : this.x;			
			this.goTo(this.x, this.y, this.zoomLevel);			
		},
		toTop: function() {
			this.y = this.y - this.moveOffsetY;
			this.y = (this.y < 0) ? 0 : this.y;			
			this.goTo(this.x, this.y, this.zoomLevel);
		},
		toBottom: function() {
			this.y = this.y + this.moveOffsetY;
			this.y = (this.y > this.mapActualHeight) ? this.mapActualHeight : this.y;			
			this.goTo(this.x, this.y, this.zoomLevel);
		},
		calculateOffset: function() {
			switch(this.zoomLevel) {
				case 1:
						this.moveOffsetX = this.offsetX * 4;
						this.moveOffsetY = this.offsetY * 4;
						break;
				case 2:
						this.moveOffsetX = this.offsetX * 2;
						this.moveOffsetY = this.offsetY * 2;
						break;
				case 3:
						this.moveOffsetX = Math.round(this.offsetX * 1.3);
						this.moveOffsetY = Math.round(this.offsetY * 1.3);
						break;
				case 4:
						this.moveOffsetX = this.offsetX;
						this.moveOffsetY = this.offsetY;				
						break;						
			}
		},

/*		toggleMap: function() {
			this.theNavMap.toggleClass('navMap2');
		},
*/		hideStar: function() {
			this.star.setStyle('display', 'none');
		},
		timeIsOut: function() {
			clearTimeout(this.timeoutId);
			fadeLoading.start(1, 0);			
			alert('We could not retrieve images from our map server, please check your Internet connection.');
			return false;
		},
		goTo: function(theX, theY, theZoom) {
			this.currentX=theX;
			this.currentY=theY;
			this.currentZoom=theZoom;
			clearTimeout(this.timeoutId);			
			fadeLoading.start(0, 1);
			this.moveViewFinder(theX, theY, 0);
			this.setZoomLevel(theZoom);
			
			theX = theX - 30;  // no special logic behind this and the next line! :D
			theY = theY - 30;
			
			var zoom = theZoom * 25;
			//end additional
			var url= this.imagerUrl+'?zoom='+zoom+'&x='+theX+'&y='+theY+'&w=545&h=410&lan=';
			if(this.cur_lang=="En")
				var url= this.imagerUrl+'?zoom='+zoom+'&x='+theX+'&y='+theY+'&w=545&h=410&lan=EN';
			//end additional
			
			
			
			this.theMap.setProperty('src', url);
			this.timeoutId = setTimeout(this.timeIsOut, this.timeout);
			
			var UrlParameters = '?x='+theX+'&y='+theY+'&z='+theZoom;
			if(this.permalink)
			    this.permalink.setProperty('href', UrlParameters);
			if(this.sendto)
			    this.sendto.setProperty('href', 'Sendto.aspx' + UrlParameters);
			if(this.printable)
			    this.printable.setProperty('href', 'Print.aspx' + UrlParameters);
			

			this.theMap.onload = function() {
				fadeLoading.start(1, 0);
				clearTimeout(this.timeoutId);
				var str=this.x+","+this.y+","+this.currentZoom;
				var str2="";
				for(i=0;i<str.length;i++){
					if(str.substr(i,1)!=",")
						str2 += String.fromCharCode(97+Number(str.substr(i,1)));
					else
						str2+="r";
				}
			 //   this.tolangBtn.href = this.tolangBtn.orghref +"?vars="+str2;
			    
			    
			    
			}.bind(this);
			
		},
		
		renderButtons: function() {
			this.theNavMapMin.removeEvents(); this.theNavMapMin.removeClass();
			this.theNavMapMid.removeEvents(); this.theNavMapMid.removeClass();
			this.theNavMapMax.removeEvents(); this.theNavMapMax.removeClass();
			
			switch (this.navStatus) {
					case 0:
							this.theNavMapMin.setStyle('display','none');
							this.theNavMapMax.setStyle('display','none');
							this.theNavMapMid.setStyle('display','inline');							
							
							this.theNavMapMid.className = 'down';
							this.theNavMapMid.addEvent('click', function(e){
								new Event(e).stop();
								navMapMorph.start({
									'width': 180,
									'height': 130
								}).chain(this.toMid.bind(this));
								this.navStatus = 1;
								this.renderButtons();
							}.bind(this));
							break;
					
					case 1:
							this.theNavMapMid.setStyle('display','none');
							this.theNavMapMin.setStyle('display','inline');
							this.theNavMapMax.setStyle('display','inline');

							this.theNavMapMin.className = 'up';
							this.theNavMapMin.addEvent('click', function(e){
								new Event(e).stop();
								navMapMorph.start({
									'width': 17,
									'height': 17
								});
								this.toMin();
								this.navStatus = 0;								
								this.renderButtons();
							}.bind(this));

							this.theNavMapMax.className = 'down';
							this.theNavMapMax.addEvent('click', function(e){
								new Event(e).stop();
								navMapMorph.start({
									'width': 541,
									'height': 406
								});
/*								navMapMorph.start({
									'width': 541,
									'height': 406
								}).chain(function() {
									this.theRegionsSelector.setStyle('display','block');
									}.bind(this));								
*/
								this.theNavMap.setStyle('backgroundPosition', '0px 0px');
								this.toMax();
								this.navStatus = 2;
								this.renderButtons();
							}.bind(this));
							break;
							
					
					case 2:
							this.theNavMapMin.setStyle('display','none');
							this.theNavMapMax.setStyle('display','none');
							this.theNavMapMid.setStyle('display','inline');

							this.theNavMapMid.className = 'up';
							this.theNavMapMid.addEvent('click', function(e){
								new Event(e).stop();
								navMapMorph.start({
									'width': 180,
									'height': 130
								});
//								this.theRegionsSelector.setStyle('display','none');
								this.toMid();
								this.navStatus = 1;
								this.renderButtons();
							}.bind(this));
							break;
			}
		},
		
		setZoomLevel: function(level) {
				this.theViewFinder.removeClass();
				this.theViewFinder.className = 'viewFinder'+level;
				this.moveViewFinder(this.x, this.y, 0);
				this.zoomLevelBtns.each(function(el) {
					el.removeClass('selected');
				});
				
				switch(level) {
					case 4:
							this.level1Btn.addClass('selected');
							this.zoomLevel = 4;
							break;
					case 3:
							this.level2Btn.addClass('selected');
							this.zoomLevel = 3;
							break;
					case 2:
							this.level3Btn.addClass('selected');
							this.zoomLevel = 2;
							break;
					case 1:
							this.level4Btn.addClass('selected');
							this.zoomLevel = 1;							
							break;					
				}
				this.calculateOffset();				
		}
	}