/**
 * popup div viewer
 * Change of plans - currently just displays google maps
�* based on Popup image viewer
�*
�*�@copyright��2008�Kamikaze
 * 
 * Requirements:
 * 	- MooTools 1.2:
 * 		Core:
 * 		- Element.Dimensions
 * 		- DomReady
 * 		- Selectors
 * 		- Fx.Tween
 * 		- Fx.Morph
 * 		More:
 * 		- Assets
 *  -Kamikaze
 *     - google maps loading script
�*/

var divconfig = {
	loadingIcon : 'js/common/popup_image/loader.gif',
	closeIcon : 'js/common/popup_image/close.gif',
	padding : {
		top : 30,
		right : 30,
		bottom : 30,
		left : 30
	},
	width: 424,
	height: 283
}
var popupIndex;
window.addEvent('domready', function() {
	var popups = $$('.popupTrigger');
	popups.each(function (element) {
		element.addEvent('click', function(event) {
			var event = new Event(event).stop();
			if (null == element.popup) {
				element.popup = new PopupDiv(element);
			} else {
				element.popup.close();
				element.popup = new PopupDiv(element);
			}
		});
	});
});



function PopupDiv(trigger) {
	this.wrapper = null;
	this.trigger = null;
	this.elements = {};
	this.number = 0;
	
	var _popup = this;
	var _body = $(document.body);
	var _wrapper = null;
	var _wrapperSize = null;
	var _wrapperMorph = null;
	
	/**
	 * function create()
	 */
	this.create = function() {
		this.trigger = trigger;
		this.number = parseInt(this.trigger.get('id').replace(/map/,''));
		
		this.trigger.coordinates = this.trigger.getCoordinates(_body);
		this.wrapper = new Element('div');
		this.wrapper.set('class', 'popupWrapper');
//  not used, crashing function on IE7, generates error on IE6  
//              this.wrapper.originalStyles = this.wrapper.getStyles('padding'); 

		this.wrapper.setStyles({
			height : 10,
			left : this.trigger.coordinates.left,
			opacity : 0,
			padding : 0,
			position : 'absolute',
			top : this.trigger.coordinates.top,
			width : 30
		});
		this.wrapper.coordinates = this.trigger.coordinates;
		this.wrapper.inject(_body);
		_wrapper = this.wrapper;
		
		this.elements.background = new Element('div');
		this.elements.background.set('class', 'popupBackground');
		this.elements.background.setStyles({
			height : '100%',
			opacity : 0.7,
			width : '100%'
		});
		this.elements.background.inject(this.wrapper);
		
		this.elements.imageContainer = new Element('div');
		this.elements.imageContainer.set('class', 'popupImageContainer');
		
		this.elements.closeButton = new Element('img');
		this.elements.closeButton.set('alt','close');
		this.elements.closeButton.set('src',divconfig.closeIcon);
		this.elements.closeButton.setStyles({
			right : 5,
			position : 'absolute',
			top : 5,
			color : "white",
			cursor: "pointer"
		});
		
		this.elements.imageContainer.setStyles({
			left : divconfig.padding.left,
			position : 'absolute',
			top : divconfig.padding.top
		});
		this.elements.closeButton.inject(this.wrapper);
		this.elements.imageContainer.inject(this.wrapper);
		
		this.wrapper.tween('opacity', 1);
		var map = new Element('div');
		var divId = mapConfigs[this.number].id;
		map.set('id',divId);
		map.setStyles({height: 283, width: 424});
		map.inject(this.elements.imageContainer);
		initMap(mapConfigs[this.number]);

		var _screenSize = window.getSize();
		var _scroll = document.getScroll();
		
		_wrapperSize = {
			x : divconfig.width + divconfig.padding.left + divconfig.padding.right,
			y : divconfig.height + divconfig.padding.top + divconfig.padding.bottom
		};		
			
		_wrapperMorph = new Fx.Morph(_wrapper);
		_wrapperMorph.start({
			left : _scroll.x + ((_screenSize.x / 2) - (_wrapperSize.x / 2)),
			height : _wrapperSize.y,
			width : _wrapperSize.x,
			top : _scroll.y + ((_screenSize.y / 2) - (_wrapperSize.y / 2))
		});	
		this.elements.closeButton.addEvent('click', close);
		window.addEvent('scroll', this.moveToCenter);
	}
	
	/**
	 * function moveToCenter()
	 */
	this.moveToCenter = function() {
		if (_wrapperSize) {
			var _screenSize = window.getSize();
			var _scroll = document.getScroll();
			_wrapperMorph.start({
				left : _scroll.x + ((_screenSize.x / 2) - (_wrapperSize.x / 2)),
				top : _scroll.y + ((_screenSize.y / 2) - (_wrapperSize.y / 2))
			});
		}
	}
	
	this.close = close;
	function close() {
		var closeTween = new Fx.Tween(_wrapper);
		closeTween.start('opacity', 0).chain(function() {
			//_source.inject(_sourceParent);
			_wrapper.destroy();
		});
	}
	
	this.create();
}