/**
 *  common javascript features
 *  written by dave shanley <dave@buildabrand.com>
*/

var WARNING_SCREEN = "warning";
var STAGE_SCREEN = "stage";
var SYMBOL_SCREEN = "symbol";
var TEMPLATE_SCREEN = "template";

var currentTemplateType;

function browserCheck() {
	var browserAlert = new Element('div');
	browserAlert.addClass('browserWarningAlert');
	
	if(Browser.Engine.trident && Browser.Engine.version == 4) {
		browserAlert.set('html','<h2>Whoops! You are currently using Internet Explorer 6</h2>We <strong>don\'t support IE 6</strong>, It\'s a little too old to cope with our site. Why not upgrade to <strong><a href="http://www.microsoft.com/windows/internet-explorer/default.aspx" target="_blank" style="color: red">IE 8</a>, or <a href="http://www.getfirefox.com" target="_blank" style="color: red">FireFox?</a></strong> It\'s free!');
		browserAlert.inject(document.body,'top');
	}
	
	if(Browser.Engine.presto) {
		browserAlert.set('html','<h2>You are currently using Opera</h2>We <strong>DO NOT</strong> support this browser at all! It doesn\'t like our whizzy JavaScript very much. <strong>Why not use Firefox or Google Chrome?</strong>');
		browserAlert.inject(document.body,'top');
		var allDomElements = document.body.getChildren();
		//allDomElements[1].dispose();
	}
}

var overlayScreen;
var overlayContainer;

/* drop down warning overlay & container */
function createOverlay(type,content,useDOM, width, height, addOkButton) {
	
	if(width==null) width=450;
	if(height==null) height=150;
    if(type==TEMPLATE_SCREEN) {
    	width=780;
    	height=430;
    }
	
	if(type==WARNING_SCREEN) {
		overlayScreen = new Element('div', {'id' : 'warningOverlayScreen'});
		overlayScreen.addClass('warningOverlayScreen');
	}
	
	if(type==STAGE_SCREEN) {
		overlayScreen = new Element('div', {'id' : 'stageScreen'});
		overlayScreen.addClass('stageOverlayScreen');
	}
	
	if(type==SYMBOL_SCREEN) {
		overlayScreen = new Element('div', {'id' : 'stageScreen'});
		overlayScreen.addClass('stageOverlayScreen');
	}
	
	if(type==TEMPLATE_SCREEN) {
		overlayScreen = new Element('div', {'id' : 'stageScreen'});
		overlayScreen.addClass('stageOverlayScreen');
		currentTemplateType=TEMPLATE_SCREEN;
	}
	
	if(Browser.Engine.trident) {
		overlayScreen.setStyles({left: 0, top: -20,'height': window.getHeight() +  (window.getScrollTop() + 20),'z-index': '2','opacity' : 0});
	} else {
		overlayScreen.setStyles({top: -20,'height': window.getHeight() +  (window.getScrollTop() + 20),'z-index': '2','opacity' : 0});
	}	
	
	overlayScreen.inject(document.body,'top');
	overlayContainer = new Element('div');
	
	
	if(type==WARNING_SCREEN) {
		overlayContainer.addClass('browserWarningAlert');
		overlayContainer.addClass('warningOverlayContainer');
	}
	
	if(type==STAGE_SCREEN) {
		overlayContainer.addClass('thinkingAlert');
	//	overlayContainer.addClass('warningOverlayContainer');
	}
	
	if(type==SYMBOL_SCREEN) {
		overlayContainer.addClass('symbolSelect');
		overlayContainer.addClass('symbolOverlayContainer');
	}
	
	if(type==TEMPLATE_SCREEN) {
		overlayContainer.addClass('templateSelect');
		overlayContainer.addClass('templateOverlayContainer');
	}
	
	if(Browser.Engine.trident) {
		overlayContainer.setStyles({'top': (height*-1)-60, 'left': ((document.documentElement.clientWidth/2) - (width/2)),'z-index': '3', 'width': width, 'height': height});
	} else {
		if(type==TEMPLATE_SCREEN) {
			overlayContainer.setStyles({top: (height*-1)-60, left: ((window.innerWidth/2) - (width/2)),'z-index': '3', width: width, height: height, 'overflow-x' : 'hidden'});
		} else {
			overlayContainer.setStyles({top: (height*-1)-60, left: ((window.innerWidth/2) - (width/2)),'z-index': '3', width: width, height: height});
		}	
		
	}	
	
	overlayContainer.inject(document.body,'top');
	if(useDOM==null || useDOM==false) {
	
		overlayContainer.set('html',content);

		if(type==WARNING_SCREEN) {
			var girlError = new Element('img', {
				'src' : '../images/characters/girl-error.jpg'
			});
			girlError.addClass('girlError');
			girlError.inject(overlayContainer,'top');
		}
		
	} else {
	
		content.inject(overlayContainer)
	
	}
	var closeButton = new Element('span');
	closeButton.addClass('button');
	closeButton.set('html','<span>OK!</span>');
	//closeButton.setStyles({'position': 'absolute',left: 15, bottom: 2 });
	if(type!=STAGE_SCREEN && type!=TEMPLATE_SCREEN) { 
		closeButton.inject(overlayContainer,'bottom');
	}
	
	if(addOkButton!=null) { 
		closeButton.inject(overlayContainer,'bottom');
	}
	
	closeButton.addEvent('click',function() {
		removeWarningLayer();
	});
	
	overlayScreen.set('tween',{duration: 'short'});
	overlayScreen.tween('opacity',0.7);
	
	(function() { 
		var padding = parseInt(overlayContainer.getStyle('padding-top').substring(0,2));
		if(Browser.Engine.trident) {
			overlayContainer.tween('top',(document.documentElement.scrollTop + ((document.documentElement.clientHeight/2)) - (parseInt(height)/2) - 20 )) 
		} else {
			overlayContainer.tween('top',(window.getScrollTop() + ((window.innerHeight/2)) - (parseInt(overlayContainer.getStyle('height'))/2) - padding) ) 
		}
	}).delay(250);
}

function removeWarningLayer() {
	
	if($defined(overlayContainer)) {
		overlayContainer.tween('top',(parseInt(overlayContainer.getStyle('height'))-50) * -1);
		(function() { overlayContainer.dispose(); }).delay(500);
	}
	if($defined(overlayScreen)) {
		(function() { 
			overlayScreen.tween('opacity',0);
			(function() {overlayScreen.dispose(); }).delay(500);
		}).delay(500);
		
	}

}

function scrollWarning() {
	
	if($defined(overlayContainer)) {
		if(Browser.Engine.trident) {
			overlayContainer.setStyles({top: (document.documentElement.scrollTop + (document.documentElement.clientHeight/2) - parseInt(overlayContainer.getStyle('height'))), left: ((document.documentElement.clientWidth/2) - 300),'z-index': '3', width: 600});
		} else {
			var padding = parseInt(overlayContainer.getStyle('padding-top').substring(0,2));
			overlayContainer.setStyles({top: (window.getScrollTop() + ((window.innerHeight/2)) - (parseInt(overlayContainer.getStyle('height'))/2) - padding)});
			overlayScreen.setStyle('top',window.getScrollTop());
		}
	}
}


window.addEvent('domready', function() {
	browserCheck();

	var scrollCheck = function() {
	//	scrollWarning();
	}
	
	window.onscroll = scrollCheck; 

});


function showHelpPanel(id) {
	
	var panel = $(id);
	var reveal = new Fx.Reveal($(id), {duration: 250, mode: 'vertical'});
	reveal.toggle();
	
	
}

function closeAlert() {
	var closeBox = $('alert-panel');
	if($defined(closeBox)){
		closeBox.tween('opacity',0);
		(function() { closeBox.destroy()}).delay(500);
	}
}


function submitSiteForm(formId) {
	
	var formToSubmit = $(formId);
	formToSubmit.submit();
	
}

function showImageInLightbox(imgURL, width, height) {
	var img = new Element('img', {'src' : imgURL})
	createOverlay(STAGE_SCREEN,img,true,width,height, true);

}


function showCreateLightbox() {

	var img = new Element('img', {'src' : 'images/template/create-screenshot-all.png'})
	createOverlay(STAGE_SCREEN,img,true,526,630, true);

}

function showManageLightbox() {

	var img = new Element('img', {'src' : 'images/template/manage-screenshot.png'})
	createOverlay(STAGE_SCREEN,img,true,560,630, true);

}

function showApplyLightbox() {

	var img = new Element('img', {'src' : 'images/template/apply-screenshot.png'})
	createOverlay(STAGE_SCREEN,img,true,666,530, true);

}

var alertBox = new Element('div');

function showErrorBox(error) {
	
	alertBox = new Element('div');
	alertBox.set('tween', {duration: 250});
	alertBox.addClass('error');
	alertBox.addClass('form-alert');
	alertBox.set('html',error);
	alertBox.setStyle('opacity',0);
	alertBox.inject($('signup_box'));
	alertBox.tween('opacity',1);
	
	var name = $('name');
	var email = $('email');
	
	name.addClass('form_input_error');
	email.addClass('form_input_error');
		
}


function fadeErrorBox() {
	
	if(alertBox!=null) {
		
		alertBox.tween('opacity',0);
		var name = $('name');
		var email = $('email');
	
		name.removeClass('form_input_error');
		email.removeClass('form_input_error');
	}
	
}

function register() {
	
	fadeErrorBox();
	
	
	(function () {
		var name = $('name');
		var email = $('email');
		if(name.value.length < 1) {
			showErrorBox("Please enter your name!")
			return;
		}
	
		if(email.value.length < 1) {
			showErrorBox("Please enter your email address!")
			return;
		}
	
		var signup_table = $('signup_table');
		
		
		var displayThanks = (function() {
			
			signup_table.dispose();
				var thanks = new Element('div');
				thanks.addClass('thanks_message');
				thanks.set('html','<strong>Thank you!</strong> We will contact you shortly if you are picked.');
				thanks.inject($('signup_box'));
				
			
		});
	
		
				var regRequest = new Request.JSON({url: "/bb/register_beta.bb", onSuccess: function(statusObj){
   					if(statusObj.status == "success") {
						signup_table.tween('opacity',0);
			
						(function () {
				
							displayThanks();
						 }).delay(250);
					} else {
						showErrorBox(statusObj.message);
					}
					
				}}).get({'name': name.value.trim(), 'email': email.value.trim()});
   

	}).delay(250);
}

function dim(imageId, name) {
	imageObj = $(imageId);
	imageObj.src = '../images/template/' + name + '-over.gif';
}

function bright(imageId, name) {
	imageObj = $(imageId);
	imageObj.src = '../images/template/' + name + '.gif';
    //	imageObj.setStyle('opacity', 1);
}

window.addEvent('domready', function() {
   //dim('create_img');
   //dim('manage_img');
   //dim('apply_img');

});