/************************************************************************
 * 		Erstellung der Karte und der Sidebar dafür						*
 * 		C 2008 by René Lange & Thomas Müller & Steve Rohrlack @ mindbox	*
 ***********************************************************************/

var TourMap = AbstractTabContent.extend({
	
	bounds : new Array(),
	container : '',
	
	mapFx : '',					// Objekt für die Effekte des Map-Containers
	mapSize : new Object(),		// Objekt zum Wiederherstellen der Orignalgröße außerhalb des FullScreenMode 
	pageOverlay : ';',			// das Overlay für die Seite
	pageOverlayFx : '',			// Objekt für die Effekte des Overlay-Containers (ein-/ausblenden)
	
	showMapOverlays : true,		// Variable um zu unterschieden nach dem beenden des fullscreen-moduses die MapOverlays wieder eingeblendet werden müssen	
	
	// Konstruktor
	initialize : function(containerSelector) {
		// der Container für die Map
			
		this.container = new Element('div',{'id':'tourMap'});
		this.container.adopt(new Element('div',{'id':'tpMap'}).setStyles({
			'height':'466px',
			'width':'600px',
			'position':'relative'
		}));
		
		this.container.adopt(this.buildOverlays());
		// effekt-objekt für den Container
		this.mapFx = new Fx.Morph(this.container);
		
		this.buildPageOverlay();
	},

	// Gibt den (fertigen) Container zurück
	build : function() {
		return this.container;
	},

	// Overlays hinzufügen
	buildOverlays : function() {
		var tmpEl = new Element('div',{'id':'overlayTop', 'class':'tpMapOverlay'});
		this.container.adopt(tmpEl);
		
		tmpEl = new Element('div',{'id':'overlayBottom', 'class':'tpMapOverlay'});
		this.container.adopt(tmpEl);
		
		tmpEl = new Element('div',{'id':'overlayLeft', 'class':'tpMapOverlay'});
		this.container.adopt(tmpEl);
		
		tmpEl = new Element('div',{'id':'overlayRight', 'class':'tpMapOverlay'});
		this.container.adopt(tmpEl);
		
		tmpEl = new Element('div',{'id':'overlayFullscreen', 'class':'tpMapOverlay'});
		var subTmpEl = new Element('a').setProperties({'href':'#','target':'_self','rel':'0'});
		var subTmpEl2 = new Element('img',{'src':'/templates/img/tourplanner/map.overlay.fullscreen.gif','alt':'open fullscreen'}).setProperty('border','0');
		subTmpEl.adopt(subTmpEl2);
		subTmpEl.addEvent('click',function(ev){
			this.toggleFullScreenMode(ev);
		}.bind(this))
		tmpEl.adopt(subTmpEl);
			
			// Google Events
		this.mapSizeFx = new Fx.Morph()
		return tmpEl;
	},
	
	
	buildPageOverlay: function(){
		// das pageOverlay für den FullScreenMode
		this.pageOverlay = new Element('div',{'class':'pageOverlay'});
		this.pageOverlay.setStyles({
			'opacity' : '0',
			'height' : window.getScrollSize().y
		});
		// pageoverlay click
		this.pageOverlay.addEvent('click',function(ev) {
			$('tourMap').getElement('[id=overlayFullscreen]').getElement('a').fireEvent('click',{},0);
		});
		// einbinden in den body
		$E('body').adopt(this.pageOverlay);
		// Effekt-Objekt für pageOverlay
		this.pageOverlayFx = new Fx.Morph(this.pageOverlay);
	},
	
	// Klick in der Legende
	handleLegendEvent : function(el) {
		if(el.getStyle('background-image').contains('inactive')){
			el.setStyle('background-image',el.getStyle('background-image').replace('_inactive',''));
			var doEnable = true; 
		}else{
			el.setStyle('background-image',el.getStyle('background-image').replace('\.gif','_inactive.gif'));
			var doEnable = false; 
		}
		TourPlanner.instance.map.changeIconVisibility(el.getProperty('id'), doEnable);
	},
	
	toggleFullScreenMode : function(ev){
		var center = TourPlanner.instance.map.getCenter();
		$('overlayFullscreen').setStyle('opacity','0');
		if(this.pageOverlay.getStyle('opacity') == 0) {
			var tmpSize = this.container.getCoordinates();
			this.mapSize.width = tmpSize.width;
			this.mapSize.height = tmpSize.height;
			this.mapSize.top = tmpSize.top;
			this.mapSize.left = tmpSize.left;
			
			this.pageOverlay.setStyle('height', window.getScrollSize().y);
			this.pageOverlayFx.start({
				'opacity':'0.8'	
			})
			this.container.setStyles({'position':'absolute','top':tmpSize.top,'left':tmpSize.left,'z-index':2});
			$('overlayTop').setStyle('display','none');
			$('overlayBottom').setStyle('display','none');
			$('overlayLeft').setStyle('display','none');
			$('overlayRight').setStyle('display','none');
			
			TourPlanner.instance.map.resize(Number(window.getWidth())-80, Number(window.getHeight())-40);
			this.mapFx.start({
				'top': Number(window.getScroll().y)+20,
				'left': 0,
				'width':(Number(window.getWidth())-80)+'px',
				'height':(Number(window.getHeight())-40)+'px',
				'margin-right':'0px',
				'margin-bottom':'0px',
				'margin-left':'40px'
			}).chain(
				function(){
					mapCoords = $('tourMap').getCoordinates();
					$('overlayFullscreen').setStyles({
						'top': '0px',
						'left': (Number(mapCoords.width) - 62) + 'px'
					});
					$('overlayFullscreen').getElement('img').setProperties({
						'alt': 'close fullscreen',
						'src': '/templates/img/tourplanner/map.overlay.fullscreen.ret.gif'
					});
					$('overlayFullscreen').tween('opacity', '1');
					TourPlanner.instance.map.panTo(center);
				}
			)
			
			window.addEvent('keydown',function(ev) {
				var ev = new Event(ev);
				if(ev.key == 'esc' && $E('.pageOverlay')) {
					$('overlayFullscreen').getElement('a').fireEvent('click',{},0);
				}
			});
		} else {
			this.pageOverlayFx.start({'opacity':'0'})
			window.removeEvent('keydown');
			$('overlayFullscreen').getElement('img').setProperties({'alt':'open fullscreen','src':'/templates/img/tourplanner/map.overlay.fullscreen.gif'});
			TourPlanner.instance.map.resize(Number(this.mapSize.width),Number(this.mapSize.height));
			this.mapFx.start({
				'top':this.mapSize.top,
				'left':this.mapSize.left,
				'width': this.mapSize.width,
				'height':this.mapSize.height,
				'margin-right':'5px',
				'margin-rottom':'6px',
				'margin-left':'0px'
			}).chain(
				function(){
					$('tourMap').setStyles({'position':'relative','top':'0','left':'0','z-index':'auto'});
					$('overlayFullscreen').setStyles({
						'opacity':'0',
						'top': '1px',
						'left': String(Number($('tourMap').getStyle('width')) - Number($('overlayFullscreen').getStyle('width')) - 1) + 'px'
					});
					$('overlayFullscreen').tween('opacity','1');
						$('overlayTop').setStyle('display', 'block');
						$('overlayBottom').setStyle('display', 'block');
						$('overlayLeft').setStyle('display', 'block');
						$('overlayRight').setStyle('display', 'block');
						TourPlanner.instance.map.panTo(center);
				}.bind(this)
			)
		}
		
		$('overlayFullscreen').blur();
		
		//default Klickverhalten abfangen falls Event von A-Tag kommt
		if(ev.target) {
			if (ev.target.getProperty('href') || ev.target.getParent().getProperty('href')) {
				var ev = new Event(ev);
				ev.stop();
			}
		}
	}
});