var currentMode = 'register'; //set flag to login or register
var emailPat = /^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i;
var isToggle = true;	//flag to block user to open close so fast
var toggleTime;

var toggleOut = function(){	//remove blockage
	isToggle = true;
	clearInterval(toggleTime);
	}
function toggleForm(sho,hid){
	if( $(sho).style.display  && isToggle){
		new Effect.BlindDown(sho, { duration: 0.5});
		new Effect.BlindUp(hid, { duration: 0.5});
		isToggle = false;
		toggleTime = setInterval(toggleOut, 500 );
		}
	if( sho == 'register' )
		currentMode = 'register';
	else
		currentMode = 'login';
	}
	
function toggleHide(id,ref){
	if( isToggle ){
		if($(id).style.display == ''){
			new Effect.BlindUp(id, { duration: 0.5});
			ref.src='images/openbtn.gif'
			}
		else{
			new Effect.BlindDown(id, { duration: 0.5});
			ref.src='images/close.gif'
			}
		isToggle = false;
		toggleTime = setInterval(toggleOut, 500);
		}
	}
	
function professional(){
	var itm = $$('.options');
	for( var i = 0; i<itm.length; i++)
		for( var j = 0; j<professionalPackage.length; j++)
			if( professionalPackage[j] == itm[i].id )
				itm[i].checked = 'checked';
	caculateTotal();
	}
function standard(){
	var itm = $$('.options');
	for( var i = 0; i<itm.length; i++)
		for( var j = 0; j<standardPackage.length; j++)
			if( standardPackage[j] == itm[i].id )
				itm[i].checked = 'checked';
	caculateTotal();
	}
	
//function to calculate interactive radio button
function caculateTotal(){
	var groups =  $$('.optionGroup');
	var total = 0;
	//get which base is selected and get the base price
	var baseOption = $$('.rdiobtn');
	var bp;
	for(var i = 0; i<baseOption.length; i++ ){
		if( baseOption[i].checked ){
			if( baseOption[i].value == 'Standard'){
				$('sPackage').innerHTML = 'Standard Package';
				total = bStandard;
				bp = bsInitial;
				}
			else{
				$('sPackage').innerHTML = 'Professional Package';
				total = bProfessional;
				bp = bpInitial;
				}
			}
		}
	var tt = 0;
	for(var i = 0; i<groups.length; i++){
		var dd = groups[i].getElementsByTagName('dd')
		// get the selecte radio value
		var chkv = 0;
		for(var j=0; j<dd.length; j++){
			var cc = dd[j].getElementsByTagName('input')[0];
			if( cc.checked ){
				var hid = dd[j].getElementsByTagName('input')[1];;
				chkv = hid.value;
				}
			}
		for( var j=0; j<dd.length; j++){
			var c = dd[j].getElementsByTagName('input')[0];
			var d = dd[j].getElementsByTagName('input')[1];	//hidden input
			var e = dd[j].getElementsByTagName('span')[0];;
			var tot = parseFloat(d.value) - parseFloat(chkv);
			var sign = '';
			if( tot >0 )
				sign = "+";
			else if( tot <0 )
				sign = '-';
			if(c.checked){
				//e.update('selected');
				e.innerHTML = 'selected';
				tt += parseFloat(chkv);
				}
			else
				//e.update(sign + '$ ' + Math.abs(tot));
				e.innerHTML = sign + '$ ' + Math.abs(tot);
			}
		}
	var optionsPrice = tt - bp;
	var perPageTotal = total+ optionsPrice;
	var priPages = $('pages').value;
	var subPages = $('subPages').value;
	var sPDiscount = 1-(subPageDiscount/100.0);
	var overallTotal = perPageTotal*priPages + perPageTotal*subPages*sPDiscount;
	$('priPageExpression').innerHTML = priPages +' page(s) x $' + total;
	$('subPageExpression').innerHTML = subPages +' page(s) x $' + total*sPDiscount;
	$('priPageTotal').innerHTML = '$' + priPages*total;
	$('subPageTotal').innerHTML = '$' + subPages*total*sPDiscount;
	$('optionTotal').innerHTML = '$ ' + (optionsPrice * priPages + optionsPrice*subPages*sPDiscount);
	$('totalPrice').innerHTML ='$ '+ overallTotal;
	}
	
//serialize given form and update container
function serialize1(formName,successurl){
	createOverlay('Please Wait','Processing your request.');
	$(formName).request({ onComplete: function(t){
		if(t.responseText == 'success') window.location = successurl;
		else createOverlay('Oops',t.responseText);
		}});
	}
	

//validate submit to register or login
function validateSubmit(basePath,destination){
	if( currentMode == 'login' ){
		if( $F('email1').empty() ){
			createOverlay('Required Field Missing','Please provide email to login');
			return false;
			}
		else if (!emailPat.test($('email1').value) ) {
			createOverlay('Required Field Missing','Please provide valid email address');
			return false;
			}
		else if( $F('password1').empty() ){
			createOverlay('Required Field Missing','Please provide password to login');
			return false;
			}
		createOverlay('Please Wait','Processing your request.');
		$('loginForm').request({ onComplete: function(t){
			if(t.responseText == 'success') window.location = basePath+destination;
			else createOverlay('Oops',t.responseText);
			}});
		}
	else if( currentMode == 'register' ){
		if( $F('firstName').empty() ){
			createOverlay('Required Field Missing','Please provide name');
			return false;
			}
		else if( $F('email').empty() ){
			createOverlay('Required Field Missing','Please provide email to register, this will be your login id');
			return false;
			}
		else if (!emailPat.test($('email').value) ) {
			createOverlay('Required Field Missing','Please provide valid email address');
			return false;
			}
		else if( $F('password').empty() ){
			createOverlay('Required Field Missing','Please provide password to register');
			return false;
			}
		else if( $F('password') != $F('reTypePassword') ){
			createOverlay('Required Field Missing','Password not matched with retyped password');
			return false;
			}
		else if( $F('companyName').empty() ){
			createOverlay('Required Field Missing','Please provide company name');
			return false;
			}
		else if( $F('country') == 'Select Your Country'  ){
			createOverlay('Required Field Missing','Please select country');
			return false;
			}
		createOverlay('Please Wait','Processing your request.');
		$('registerForm').request({ onComplete: function(t){
			if(t.responseText == 'success'){
				window.location = basePath+destination;
				}
			else createOverlay("Oops",t.responseText);
			}});
		}
	}
	
//file uploader functions
var anim = ['|','/','-','\\'];
var pos = 0;
var interval;
//function to cancel upload in progress:
var isUploading = false;
function cancelUpload(){
	$('uploadProgress').setStyle({display: 'none'});
	$('iframeUpload').setStyle({display: 'block'});
	$('iframeUpload').src=$('iframeUpload').src;
	$('progressBar').setStyle({width: '0%'});
	clearInterval( interval );
	isUploading = false;
	}
var getUploadProgress = function(){
	clearInterval( interval );
	new Ajax.Request(progressURL, { onSuccess: function(t){ 
		var a = anim[pos++];
		if( pos > 3 ) pos = 0;
		$('progressStatus').update(t.responseText + ( parseFloat(t.responseText) ? (' %&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'+a) : '' ));
		if( parseInt(t.responseText) >0 )
			$('progressBar').setStyle({width: parseInt(t.responseText)+1+'%'});
		else if( t.responseText.search('file') >= 0 ) $('progressBar').setStyle({width: '100%'});
		else if( t.responseText == 'maximum upload size has been exceeded' ){
			cancelUpload();
			createOverlay('Oops','maximum file size exeeded');
			}
		else $('progressBar').setStyle({width: '0%'});
		if( $('iframeUpload').style.display == "none" ){
			interval = setInterval(getUploadProgress, 20 ); //call again to get next status
			isUploading = true;
			if( typeof($('jContinue')) != 'undefined' ){
				$('jContinue').setStyle({display: 'none'});
				$('jisUploading').setStyle({display: 'block'});
				}
			}
		else{
			clearInterval( interval );
			cancelUpload();
			isUploading = false;
			if( typeof($('jContinue')) != 'undefined' ){
				$('jContinue').setStyle({display: 'block'});
				$('jisUploading').setStyle({display: 'none'});
				}
			}
		}});
	}
	
//function to delete single upload:
function deleteUpload(id){
	if( confirm("Are you sure to delete selected file?") ){
		new Ajax.Request(deluploadURL+'?delete='+id, { onSuccess: function(t) {
			if( t.responseText == 'success' ){
				//new Effect.Squish('fileLink'+id, { duration: .5});
				$('fileLink'+id).remove();
				}
			else{
				createOverlay('Oops',t.responseText);
				}
			}});
		}
	}
	
//image menu functions:
var obj;
var interval;
var squizSize;
var run = true;
function openImgMenu(v){
	if( v ){
		obj = v;
		run=true;
		}
	clearInterval(interval);
	if( run )
		interval = setInterval('openImgMenu()',30);
	else return;
	var lis = $('kwicks').getElementsByTagName('li');
	run = false;
	var inc = 4;
	for( var i = 0; i<lis.length; i++){
		if( lis[i]!=obj && lis[i].offsetWidth > 118 ){
			inc--;
			}
		}
	for( var i = 0; i<lis.length; i++){
		if( lis[i]!=obj && lis[i].offsetWidth > 118 ){
			lis[i].style.width = lis[i].offsetWidth - 2 - inc + 'px';
			run = true;
			}
		}
	if( $(obj).offsetWidth <167 ){
		$(obj).style.width = $(obj).offsetWidth +1+'px';
		run = true;
		}
	}
function closeImgMenu(v){
	if( v ){
		obj = v;
		run = true;
		}
	clearInterval(interval);
	if( run )
		interval = setInterval('closeImgMenu()',30);
	else return;
	var lis = $('kwicks').getElementsByTagName('li');
	var inc = 7;
	for( var i = 0; i<lis.length; i++){
		if( lis[i]!=obj && lis[i].offsetWidth > 118 ){
			inc--;
			}
		}
	if( $(obj).offsetWidth >128+inc ){
		$(obj).style.width = $(obj).offsetWidth - 4 - inc +'px';
		run= true;
		}
	else{
		$(obj).style.width = '128px';
		run = false;
		}
	for( var i = 0; i<lis.length; i++){
		if( lis[i]!=obj && lis[i].offsetWidth <= 128 ){
			lis[i].style.width = lis[i].offsetWidth +'px';
			run = true;
			}
		else if( lis[i]!=obj ) lis[i].style.width = '128px';
		}
	}


//.....................................................................................................
//Images preloader arg( array of the images to monitor, function reference to run after complete, progressbar container id)
var ImagePreload = Class.create({
 initialize:function(ImageArray,onComplete,progressCont) {
    this.ImageArray = ImageArray;
	this.onComplete = onComplete;
    this.iLength = this.ImageArray.length;
	if ( this.iLength < 1 ) { return false; }
	this.Loaded = 0;
	if( typeof(progressCont) == 'undefined' ){
		var showLoading = document.createElement('div');
		showLoading.id = 'imgLoadProgress';
		this.progressCont = 'imgLoadProgress';
		document.body.appendChild(this.showLoading);
		}
	else
		this.progressCont = progressCont;
	$(this.progressCont).setStyle({margin:'0px auto',width:'200px', height:'15px',padding:'2px', border:'2px solid #dfdfdf', overflow:'hidden'});
	$(this.progressCont).update('<div style="text-align: center;font-size: 10px;height: 15px;background: #2a2a2f;color: #fff;font-weight: bold;" id="barr">Loading Images Please Wait...</div>');
    for( var i = 0; i < this.iLength; i++ ) {
       this.preLoadImage(ImageArray[i]);
    }
 },
 preLoadImage: function(src) {
	var oImage = new Image();
	oImage.onload = (function(src){
		   this.Loaded++;
		   if ( this.Loaded == this.iLength ) {
				$(this.progressCont).remove();
				this.onComplete();
			}
			else {
				var percent = Math.round(( this.Loaded * 200) / this.iLength);
				$('barr').setStyle({width:percent+'px'}).update(this.Loaded + ' / ' + this.iLength);
			}
	}).bind(this);
	oImage.src = src;        // Image Object Source Path
 }
});
//.....................................................................................................


//fade appear images:
var FadeAppear = Class.create({
	 initialize:function(ImageArray, trans, dur) {
		this.ImageArray = ImageArray;
		this.cur = 0;
		this.next = 1;
		this.dur = dur;
		this.trans = trans;
		this.frequency = trans + dur;
		for( i = 1; i<this.ImageArray.length; i++){ 
									  this.ImageArray[i].setStyle({opacity:'0.001'});
									  }
		if (this.ImageArray.lenght <= 0 ) { return false; }
		this.registerCallback();
	 },
	 registerCallback: function() {
		this.timer = setInterval(this.rotateImage.bind(this), this.frequency * 1000);
	 },
	 rotateImage: function() {
		  new Effect.Parallel([
				new Effect.Opacity(this.ImageArray[this.cur], {sync: true, to: 0.001, from: 0.999}),
				new Effect.Opacity(this.ImageArray[this.next], {sync: true, to: 0.999, from: 0.001})
		  ],{duration:this.dur});
		  this.cur = this.next;
		  this.next = this.cur + 1
		  if ( this.cur == this.ImageArray.length -1 ) { this.next = 0 }
	 }
	}); // end FadeAppear

//rotate images
var move;
var len;
var firstCall = 2;
var fwd = false;
var isSlidePaused = false;
var slideInterval;
var resumeSlideInterval;
var moveP = function(){
	move++;
	if( move > len ) move = 1;
	return move;
	}
Array.prototype.shuffle = function(){
	return this.sortBy(moveP);
};
var pauseSlide = function(){
	isSlidePaused = true;
	}
var playSlide = function(){
	isSlidePaused = false;
	if( typeof(resumeSlideInterval) != 'undefined' ) clearInterval(resumeSlideInterval);
	}
var rotateSlide = function(){
	if( isSlidePaused ) return;
	len =  $('longcon').select('dd').length;
	if( fwd ) firstCall++;
	else firstCall--;
	if( firstCall > len )
		firstCall = 1;
	if( firstCall < 1 )
		firstCall = len;
	move = firstCall;
	$('longcon').select('dd').shuffle().each(function(e,i){
	if( !fwd && i == len-1 ) 
		e.setStyle({left: (len-1)*e.getWidth()+'px'});
	else if( fwd && i == 0 )
		e.setStyle({left: '-' + e.getWidth()+'px'});
	e.morph('left:'+(i-1)*(e.getWidth() + 10)+'px',{duration:0.8});
	});
	//wait some time to finish one transition
	pauseSlide();
	resumeSlideInterval = setInterval("playSlide()",800);
 }
function autoSlideAdvance(){
	if( slideInterval ){ 
		clearInterval(slideInterval);
		rotateSlide();
		}
	slideInterval = setInterval('autoSlideAdvance()',3000);
	//fwd = false;
	}
var forwardSlide = function(){
	fwd=true;
	rotateSlide();
	clearInterval(slideInterval);
	slideInterval = '';
	autoSlideAdvance();
	}
var backwardSlide = function(){
	fwd=false; 
	rotateSlide();
	clearInterval(slideInterval);
	slideInterval = '';
	autoSlideAdvance();
	}
function initSlide(){
	$('longcon').select('dd').each( function(e){ e.onmouseover = pauseSlide; e.onmouseout = playSlide; } );
	rotateSlide();
	autoSlideAdvance();
	}
//rotate images

function logoSelect(){
	$('logoCont').setStyle({ display: 'block'});
	$('psdCont').setStyle({ display: 'none'});
	$('siteOnlyCont').setStyle({ display: 'none'});
	$('logoOnlyCont').setStyle({ display: 'block'});
	
	$('logoPriceOnly').setStyle({display: 'block'});
	$('homePriceOnly').setStyle({display: 'none'});
	caculateTotalc2psd();
	}
function psdSelect(){
	$('logoCont').setStyle({ display: 'none'});
	$('psdCont').setStyle({ display: 'block'});
	$('siteOnlyCont').setStyle({ display: 'block'});
	$('logoOnlyCont').setStyle({ display: 'none'});
	
	$('logoPriceOnly').setStyle({display: 'none'});
	$('homePriceOnly').setStyle({display: 'block'});
	caculateTotalc2psd();
	}
function bothSelect(){
	$('logoCont').setStyle({ display: 'block'});
	$('psdCont').setStyle({ display: 'block'});
	$('siteOnlyCont').setStyle({ display: 'block'});
	$('logoOnlyCont').setStyle({ display: 'block'});
	
	$('logoPriceOnly').setStyle({display: 'block'});
	$('homePriceOnly').setStyle({display: 'block'});
	caculateTotalc2psd();
	}
	
function caculateTotalc2psd(){
	var nLogo = $('numLogo').value;
	var nHomePSD = $('numHomePSD').value;
	var nSubPSD = $('numSubPSD').value;
	var logoTotal = c2psdLogoPrice * nLogo;
	
	var basePackage = $$('.rdiobtn');
	var overallTotal = 0;
	for(var i = 0; i<basePackage.length; i++ ){
		if( basePackage[i].checked ){
			if( basePackage[i].value == 'logo' || basePackage[i].value == 'both'){
				overallTotal = logoTotal;
				$('logoToal').innerHTML = '$' + logoTotal;
				$('logoExpression').innerHTML = nLogo + ' Logos x $' + c2psdLogoPrice;
				}
				
			if( basePackage[i].value == 'psd' || basePackage[i].value == 'both'){
				if( nHomePSD > 1 ){
					homePSDTotal = c2psdPagePrice + c2psdPagePrice2* (nHomePSD-1);
					//update equation
					$('homePageExpression').innerHTML = '1 PSD x $' + c2psdPagePrice + ' + ' + (nHomePSD-1) +' PSDs x $' + c2psdPagePrice2;
					}
				else{
					homePSDTotal = c2psdPagePrice * nHomePSD;
					//update equation
					$('homePageExpression').innerHTML = nHomePSD + 'PSDs x $' + c2psdPagePrice;
					}
					
				if( nSubPSD > 1 ){
					subPSDTotal = c2psdSubPagePrice + c2psdSubPagePrice2* (nSubPSD-1);
					//update subpage equation
					$('subPageExpression').innerHTML = '1 PSD x $' + c2psdSubPagePrice + ' + ' + (nSubPSD-1) +' PSDs x $' + c2psdSubPagePrice2;
					}
				else{
					subPSDTotal = c2psdSubPagePrice * nSubPSD;
					//update subpage equation
					$('subPageExpression').innerHTML = nSubPSD + 'PSDs x $' + c2psdSubPagePrice;
					}
				$('homePageTotal').innerHTML = '$' + homePSDTotal;
				$('subPageTotal').innerHTML = '$' + subPSDTotal;
				overallTotal += homePSDTotal + subPSDTotal;
				}
			}
		}
	$('totalPrice').innerHTML = '$' + overallTotal;
	}