/*************************************
* Campaign Website framework         *
* Copyright Miles Webdesign          *
* Version 1.0 - 29/05/09             *
*************************************/

var CampaignWebsite = new Class({

	Implements: [Options, Events],

	// default options	
	options: {
		site: {			
			positioning: {
				horizontal: 'center',
				vertical: 'center',
				offset: {
					x: 0,
					y: 0
				}
			},
			size: {
				x: 900,
				y: 580	
			}			
		},
		
		popup: {
			positioning: {
				offset: {
					x: 0,
					y: 0
				}
			},			
			size: {
				x: 500,
				y: 400
			}
		},
		
		error_popup: {
			positioning: {
				offset: {
					x: 0,
					y: 0
				}
			},			
			size: {
				x: 300,
				y: 210
			}			
		},

		loading: {
			positioning: {
				offset: {
					x: 0,
					y: 0
				}
			},			
			size: {
				x: 400,
				y: 300
			}			
		},
		
		links: {
			dynamic: true,
			target: 'content'
		},
		
		forms: {
			dynamic: true,
			target: 'content'			
		},
		
		pngFix: {
			bgElements: ''
		}

	},	
	bodySize: [],
	
	initialize: function(options, framework) {

		// set options
		this.setOptions(options);		

		// position
		this.positionSite();
		window.addEvent('resize', function() { 
			this.positionSite();
			this.positionPopup(); 
		}.bind(this));		
		
		if(this.options.site.backgroundImage) this.setSiteBackground();
		
		if(this.options.links.dynamic) this.dynamicLinks();
		if(this.options.forms.dynamic) this.dynamicForms();

		if(this.options.site.contentEl) this.setContentScroll();		

		// create popup
		this.createPopup();		
		
		this.createErrorPopup();		

		// set popup links		
		this.popupLinks();

		this.supBrowser = (Browser.Engine.trident && !Browser.Engine.trident5 && document.body.filters) ? true : false;
		if(this.supBrowser) {
			new Asset.javascript('javascript/pngfix.js');
			this.pngFix = new pngFix({cssBgElements: [this.options.pngFix.bgElements]});
		}
		
	},
	
	setBodySize: function() {
		// set body sizes
		this.bodySize.x = document.body.clientWidth;
		this.bodySize.y = document.body.clientHeight;
	},
	
	positionSite: function() {
		
		this.setBodySize();
		
		$('site').setStyle('position', 'relative');
		$('site').setStyle('width', this.options.site.size.x);
		$('site').setStyle('height', this.options.site.size.y);

		// vertical positioning		
		if(this.options.site.positioning.vertical == 'center')
			$('site').setStyle('top', (this.bodySize.y - this.options.site.size.y) / 2 + this.options.site.positioning.offset.y);
		else if(this.options.site.positioning.vertical == 'top')
			$('site').setStyle('top', 0  + this.options.site.positioning.offset.y);		
		else if(this.options.site.positioning.vertical == 'bottom')
			$('site').setStyle('top', this.bodySize.y - this.options.site.size.y - this.options.site.positioning.offset.y); 

		if(this.options.site.positioning.horizontal == 'center')
			$('site').setStyle('left', (this.bodySize.x - this.options.site.size.x) / 2 + this.options.site.positioning.offset.x);
		else if(this.options.site.positioning.horizontal == 'left')
			$('site').setStyle('left', 0  + this.options.site.positioning.offset.x);		
		else if(this.options.site.positioning.vertical == 'right')
			$('site').setStyle('left', this.bodySize.x - this.options.site.size.x - this.options.site.positioning.offset.x);
						
	},
	
	setSiteBackground: function() {
		new Element('img', { 
			'src': this.options.site.backgroundImage, 
			'style': 'position: absolute; top: 0px; left: 0px; z-index: -100'
		}).injectTop('site');
	},

	setContentScroll: function() {
		if($(this.options.site.contentEl)) {
			this.scroll = new Fx.Scroll(this.options.site.contentEl);
		}
	},
	
	createPopup: function() {
		new Element('div', {
			id: 'popup',
			style: 'z-index: 20000; background: url('+this.options.popup.backgroundImage+')'
		}).injectTop('body'); 

		new Element('div', {
			id: 'inner_popup',
			style: 'position: absolute; z-index: 30000;'
		}).injectBottom('popup');

		new Element('div', {
			id: 'close_popup',
			style: 'position: absolute; z-index: 40000; top: 0px; right: 0px;'
		}).injectBottom('popup');
				

		$('close_popup').addEvent('click', function() {
			this.hidePopup();
		}.bind(this));


		new Element('div', {
			id: 'mask',
			style: 'z-index: 1500; display: none'			
		}).injectTop('body');

		$('mask').addEvent('click', function() {
			this.hidePopup();
		}.bind(this));		
		
		this.positionPopup();
		this.hidePopup();
	},
	

	setPopupBackground: function() {
		new Element('img', { 
			'src': this.options.popup.backgroundImage, 
			'style': 'position: absolute; top: 0px; left: 0px; z-index: -100'
		}).injectTop('popup');
	},

	positionPopup: function() {
		
		this.setBodySize();
		
		$('popup').setStyle('position', 'absolute');
		$('popup').setStyle('width', this.options.popup.size.x);
		$('popup').setStyle('height', this.options.popup.size.y);

		// vertical positioning		
		$('popup').setStyle('top', (this.bodySize.y - this.options.popup.size.y) / 2 + this.options.popup.positioning.offset.y);	

		// horizontal positioning		
		$('popup').setStyle('left', (this.bodySize.x - this.options.popup.size.x) / 2 + this.options.popup.positioning.offset.x);
		
		
		$('mask').setStyle('position', 'absolute');
		$('mask').setStyle('width', this.bodySize.x);
		$('mask').setStyle('height', this.bodySize.x);
		$('mask').setStyle('top', 0);
		$('mask').setStyle('left', 0);			
	
	},
	
	showPopup: function() {
		$('mask').setStyle('display', 'block');
		$('popup').setStyle('display', 'block');	
	},
	
	hidePopup: function() {
		$('mask').setStyle('display', 'none');
		$('popup').setStyle('display', 'none');	
	},

	createErrorPopup: function() {
		new Element('div', {
			id: 'error_popup',
			style: 'z-index: 2000; display: none; background: url('+this.options.error_popup.backgroundImage+')'
		}).injectBottom('body'); 

		new Element('div', {
			id: 'inner_error_popup',
			style: 'position: absolute; z-index: 3000;'
		}).injectBottom('error_popup');

		new Element('div', {
			id: 'error_close_popup',
			style: 'position: absolute; z-index: 4000; top: 0px; right: 0px;'
		}).injectBottom('error_popup');
		
		$('error_close_popup').addEvent('click', function() {
			this.hideErrorPopup();
		}.bind(this));
		
		//if(this.options.error_popup.backgroundImage) this.setErrorPopupBackground();
		
		this.positionErrorPopup();
	},

	setErrorPopupBackground: function() {
		new Element('img', { 
			'src': this.options.error_popup.backgroundImage, 
			'style': 'position: absolute; top: 0px; left: 0px; z-index: -100'
		}).injectTop('error_popup');
	},

	positionErrorPopup: function() {
		
		this.setBodySize();
		
		$('error_popup').setStyle('position', 'absolute');
		$('error_popup').setStyle('width', this.options.error_popup.size.x);
		$('error_popup').setStyle('height', this.options.error_popup.size.y);

		// vertical positioning		
		$('error_popup').setStyle('top', (this.bodySize.y - this.options.error_popup.size.y) / 2 + this.options.error_popup.positioning.offset.y);	

		// horizontal positioning		
		$('error_popup').setStyle('left', (this.bodySize.x - this.options.error_popup.size.x) / 2 + this.options.error_popup.positioning.offset.x);
	
	},
	
	showErrorPopup: function() {
		$('mask').setStyle('display', 'block');
		$('error_popup').setStyle('display', 'block');	
	},
	
	hideErrorPopup: function() {
		$('mask').setStyle('display', 'none');
		$('error_popup').setStyle('display', 'none');	
	},
	
	dynamicLinks: function() {
		if(this.options.links.dynamic) {
			$$('a').each(function(link) {
				if(link.get('target') != '_blank' && link.get('rel') != 'popup' && link.get('rel') != 'normal') {
					var target = this.options.links.target;
					var req = new Request.HTML({
						evalScripts:false,
						evalResponse:false,		
						url: link.get('href'),
						onComplete: function(responseTree, responseElements, responseHTML, responseJavaScript) {
							this.scroll.toTop();
							$(this.options.links.target).set('html', responseHTML);	
							$exec(responseJavaScript);										
							this.dynamicLinks();
							this.dynamicForms();
							this.popupLinks();
							//FLIR.auto();
							if(this.supBrowser) this.pngFix.initialize({cssBgElements: [this.options.pngFix.bgElements]});
						}.bind(this)
					});
			
					link.removeEvents('click');
					link.addEvent('click', function(e) {
						e.stop();
						req.send();			
					});
				}
			}.bind(this));
		}
			
	},
	
	popupLinks: function() {
		$$('a[rel=popup]').each(function(link) {

			var req = new Request.HTML({
				evalScripts:false,
				evalResponse:false,		
				url: link.get('href'),
				onComplete: function(responseTree, responseElements, responseHTML, responseJavaScript) {
					$('inner_popup').set('html', responseHTML);
					this.showPopup();				
					this.dynamicLinks();
					this.dynamicForms();
					this.popupLinks();	
					if(this.supBrowser) this.pngFix.initialize({cssBgElements: [this.options.pngFix.bgElements]});
					$exec(responseJavaScript);
				}.bind(this)
			});
		
			link.removeEvents('click');
			link.addEvent('click', function(e) {
				e.stop();
				req.send();			
			});
		}.bind(this));
	},
	
	dynamicForms: function() {
		if(this.options.forms.dynamic) {
			$$('form').each(function(form) {
				var target = this.options.forms.target;
				var req = new Request.HTML({
					evalScripts:false,
					evalResponse:false,		
					url: '?',
					onComplete: function(responseTree, responseElements, responseHTML, responseJavaScript) {
						$exec(responseJavaScript);					
						this.scroll.toTop();
						$(this.options.forms.target).set('html', responseHTML);				
						this.dynamicLinks();
						this.dynamicForms();
						this.popupLinks();
						if(afterSubmit = form.get('aftersubmit')) {
							eval(afterSubmit+'()');
						}
					}.bind(this)
				});
		
				form.removeEvents('submit');
				form.addEvent('submit', function(e) {
					e.stop();
					if(beforeSubmit = form.get('beforesubmit')) {
						
						if(eval(beforeSubmit+'()')) {
							req.post(form);
						}
					}
					else req.post(form);
								
				});
			}.bind(this));
		}
	},



	positionLoading: function() {
		
		this.setBodySize();
		
		$('loading').setStyle('position', 'absolute');
		$('loading').setStyle('width', this.options.loading.size.x);
		$('loading').setStyle('height', this.options.loading.size.y);

		// vertical positioning		
		$('loading').setStyle('top', (this.bodySize.y - this.options.loading.size.y) / 2 + this.options.loading.positioning.offset.y);	

		// horizontal positioning		
		$('loading').setStyle('left', (this.bodySize.x - this.options.loading.size.x) / 2 + this.options.loading.positioning.offset.x);


		$('loading_mask').setStyle('position', 'absolute');
		$('loading_mask').setStyle('width', this.bodySize.x);
		$('loading_mask').setStyle('height', this.bodySize.x);
		$('loading_mask').setStyle('top', 0);
		$('loading_mask').setStyle('left', 0);



		$('loading_mask').setStyle('z-index', 30000);
		$('loading').setStyle('z-index', 30001);	
	},

	
	showLoading: function() {

		$('loading_mask').setStyle('display', 'block');
		$('loading').setStyle('display', 'block');	
	
	},
	
	hideLoading: function() {

		$('loading_mask').setStyle('display', 'none');
		$('loading').setStyle('display', 'none');	

	
	},
	
	formErrors: function(errors) {
		var errorMsg = 'Nicht alle Felder wurden korrekt ausgef%FCllt:'+"\r\n\r\n"; 
		errors.each(function(error) {
			errorMsg += '- '+error+"\r\n";
		});
		alert(unescape(errorMsg));
/*
		var errorMsg = '<p><b>Niet alle velden zijn juist ingevuld.</b></p><ul>'; 
		errors.each(function(error) {
			errorMsg += '<li>'+error+'</li>';
		});
		errorMsg += '</ul>'
		$('inner_error_popup').set('html', errorMsg);		
		this.showErrorPopup();
		if(this.supBrowser) this.pngFix.initialize({cssBgElements: [this.options.pngFix.bgElements]});
*/		
	},

	
	checkEmail: function(email) {
		var filter  = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
		if (filter.test(email)) return true;
		else return false;		
	}	
			
});
