/*# Metadata ################################### Header v.2
# $URL: http://gt-nas-1/svn/gamebase.frontend/trunk/xsl_gamebase/_gametwist_2010/data/js/GT.CountryCurrencyForm.js $
# $Rev: 3107 $
# $Date: 2011-06-06 17:00:08 +0200 (Mo, 06 Jun 2011) $
# $Author: pmang $
### TOC ###################################################
# =GT.CountryCurrencyForm
### Description ###########################################
#
#########################################################*/

/*
=GT.CountryCurrencyForm
*/
(function ($) {
	this.GT = this.GT || {};
	this.GT.CountryCurrencyForm = this.GT.CountryCurrencyForm || new Class({
		Implements: [Options, Events], 
		options: {
			opener: ''
		}, 
		initialize: function(options) {
			this.setOptions(options);
			this.opener = this.options.opener;
			this.frameOverlay;
			this.body = $(document.body);
			this.form = $('countryCurrencyForm');
			this.opener.addEvent('click', function(evt) {
				evt.preventDefault();
				this.createFormOverlay();
			}.bind(this));
		}, 
		createFormOverlay: function () {
			if(!$('countryCurrencyFormContainer')){
				var countryCurrencyFormContainer = new Element ('div', {
					id: 'countryCurrencyFormContainer'
				});		
				
				var closeBtn = new Element ('div', {
					id: 'formCloseBtn'
				});
				var closeBtnLink = new Element ('a', {
					href:'javascript:void(0)'
				});
				var closeBtnText = new Element ('span', {
					text:'close'
				});
				closeBtnText.inject(closeBtnLink);
				closeBtnLink.inject(closeBtn);
				
				countryCurrencyFormContainer.setStyle('opacity', 0);
				this.form.setStyle('display','block');
				this.form.inject(countryCurrencyFormContainer);
				closeBtn.inject(countryCurrencyFormContainer);
				this.body.grab(countryCurrencyFormContainer);
				
				

				var showFormContainerMask = new Mask(this.body,{
					hideOnClick: false, 
					id: 'showFormContainerMask',
					useIframeShim: true,
					style: {
						position: 'absolute',
						zIndex: 999,
						background: '#fff',
						display: 'block',
						opacity: 0
					}, 
					onClick: function () {
						this.hideFrame(this.mask, countryCurrencyFormContainer);
					}.bind(this)
				});
				showFormContainerMask.show();
				
				this.frameOverlay = countryCurrencyFormContainer;
				this.mask = showFormContainerMask.element;
				this.showMask(showFormContainerMask.element, countryCurrencyFormContainer);
			}
		},
		showMask: function (mask, frame) {
			mask.setStyle('width', '100%');
			var maskFx = new Fx.Tween(mask, {
				duration: 'normal', 
				onComplete: function () {
					if(frame) {
						this.showFrame(frame);	
					}		
				}.bind(this)
			});
			maskFx.start('opacity', '0.7');
		},
		showFrame: function(frame) {
			var updateFrameFx = new Fx.Tween(frame, {
				duration: 'normal', 
				onComplete: function () {
					this.focusFirstEle();
				}.bind(this)
			});
			updateFrameFx.start('opacity', 1);
		}, 
		focusFirstEle: function() {
			var inputEle = this.frameOverlay.getElements('input[type!=hidden], select, textarea');
			if (inputEle) {
				inputEle[0].focus()
			}
			this.setCloseBtnEvent();
		},	
		setCloseBtnEvent: function () {
			var closeBtn = $('formCloseBtn');
			if(closeBtn){
				closeBtn.addEvent('click', function(e) {
					e.preventDefault();
					this.hideFrame(this.mask, this.frameOverlay);
				}.bind(this));
			}
			this.frameOverlay.addEvent('keydown', function(event) {
				if (event.key == 'esc') {
					this.hideFrame(this.mask, this.frameOverlay);
				}
			}.bind(this));
		},	
		hideFrame: function(mask, frame) {
			var updateFrameFx = new Fx.Tween(frame, {
				duration: 'normal',
				onComplete: function () {
					if(mask) {
						this.hideMask(mask, frame);
					}
				}.bind(this)
			});
			updateFrameFx.start('opacity', 0);
		}, 
		hideMask: function (mask, frame) {
			var maskFx = new Fx.Tween(mask, {
				duration: 'normal', 
				onComplete: function () {
					mask.destroy();
					frame.dispose();
					if('element' === $type($$('.iframeShim')[0])){
						$$('.iframeShim')[0].dispose();
					}
				}.bind(this)
			});
			maskFx.start('opacity', 0);
		}
	});
})(document.id);