//Ajax-Indicator
var myGlobalHandlers = {
	onCreate: function(){
		Element.show('loaderImg');
	},
	onComplete: function() {
		if(Ajax.activeRequestCount == 0){
			Element.hide('loaderImg');
		}
	}
};
Ajax.Responders.register(myGlobalHandlers);

Event.observe(window, 'load', function() {
	
	
	if($('animatedImpression') != null){
	// fade in ul li in rounded block
	var li,startAfter,scale,timeout;
	for (var x = 1; x <= 9; x++){
		li 			= 'r'+x;
		startAfter	= 1.5 * x;
		scaleAfter	= (1.5 * x) + 1;
		timeOut		= (scaleAfter+0.5) * 1000;
		$(li).setStyle({ 
			color: '#333' //#1669b3 = bl
	  	});
	
		new Effect.Appear($(li), {delay: startAfter, duration: 0.5 });
		new Effect.Scale($(li), 80,{delay: scaleAfter});
		//setTimeout( '$("'+li+'").setStyle({ listStyleType: \'none\' })',timeOut);
		new Effect.Morph($(li), {style: 'color: #838383;', duration: 0.5, delay: scaleAfter});
	 }
	}


	// oberve nav bar in rounded block
	$$('#nav li').each(function(e){
		Event.observe(e, 'click', function(e){
			
			// stop the link effect
			Event.stop(e);
			// stop observing all others, to prevent double clicks
			$$('#nav li').invoke('stopObserving', 'click');
			
			var element = Event.element(e);
			$$('#nav li').invoke('removeClassName','loaded');
			var clicked = element.up()
			//add loaded classname to li 
			$(clicked).addClassName('loaded');
			
			// loadPhone function enables the observe
			loadPhone(clicked.id);	
			
			//update the label
			var txt = (clicked.id).toUpperCase();
			if(clicked.id == "m155"){
				$('label').innerHTML = 'DECT M155 Messenger';
			}else if(clicked.id == "ap300"){
				$('label').innerHTML = 'AP300 Access Point';
			}else{
				$('label').innerHTML = 'DECT ' + txt + ' Handset';
			}
		
		});
	});

	// preload the png presentation img
	preloadImages('images/phones/dect_g355.png','images/phones/dect_i755.png','images/phones/dect_c124.png','images/phones/m155_side.png');
	
});

function enableClick(){
	$$('#nav li').each(function(e){
	
		Event.observe(e, 'click', function(e){
			
			// stop the link effect
			Event.stop(e);
			// stop observing all others, to prevent double clicks
			$$('#nav li').invoke('stopObserving', 'click');
			
			var element = Event.element(e);
			$$('#nav li').invoke('removeClassName','loaded');
			var clicked = element.up()
			//add loaded classname to li 
			$(clicked).addClassName('loaded');
			
			// loadPhone function enables the observe
			loadPhone(clicked.id);	
			
			//update the label
			var txt = (clicked.id).toUpperCase();

			if(clicked.id == "m155"){
				$('label').innerHTML = 'DECT M155 Messenger';
			}else if(clicked.id == "ap300"){
				$('label').innerHTML = 'AP300 Access Point';
			}
			else{
				$('label').innerHTML = 'DECT ' + txt + ' Handset';
			}
		});


	});
}
var count = 0;
function loadPhone(imgId){

	new Effect.Parallel([
			new Effect.Move ('scroll',{ sync: true, y: 470, x: 0})//,
			//new Effect.Opacity('scroll', { sync: true, from: 1, to: 0})
		  
		], {
			duration: 0.5,
			afterFinish: function () {
				$('scroll').setStyle({
			    //	left: 0
			  	});
			  
				
				new Ajax.Updater(
					'scroll',
					'pages/impression.php', 
					{
						parameters: 'imgId='+imgId,
						requestHeaders: ['Expires', 'Thu, 17 May 2001 10:17:17 GMT', 'Cache-Control', 'no-cache, must-revalidate', 'Pragma', 'no-cache'],
						onSuccess: function() {
							enableClick();
							$('scroll').setStyle({
						    //	left: 100
						  	});
							new Effect.Parallel([
									new Effect.Move ('scroll',{ sync: true, y: -470, x: 0})//,
									//new Effect.Opacity('scroll', { sync: true, from: 0, to: 1})
								],{ 
									duration: 0.5
								});	
							// observe the links 
													
						}
					}
			  	);
			}
		}
	);
	count++;
	if(count == 5){
		count = 0;
	}
	
}

function preloadImages() {
  var d=document; if(d.images){ if(!d.p) d.p=new Array();
    var i,j=d.p.length,a=preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.p[j]=new Image; d.p[j++].src=a[i];}}
}

function sendForm(){
	form_values = $('registration').serialize(true);
	var missed;
	var name 	= form_values['name'];
	var company = form_values['company'];
	var country = form_values['country'];
	var adress 	= form_values['adress'];
	var zip 	= form_values['zip'];
	var city 	= form_values['city'];
	var phone 	= form_values['phone'];	
	var email 	= form_values['email'];

	if(name == ''){
		$('name').addClassName('missed');
		missed = true;
	}else{
		$('name').removeClassName('missed');
	}
	
	if(company == ''){
		$('company').addClassName('missed');
		missed = true;
	}else{
		$('company').removeClassName('missed');
	}
	
	if(country == ''){
		$('country').addClassName('missed');
		missed = true;
	}else{
		$('country').removeClassName('missed');
	}
	
	if(email == ''){
		$('email').addClassName('missed');
		missed = true;
	}else{
		$('email').removeClassName('missed');
	}
	
	if(phone == ''){
		$('phone').addClassName('missed');
		missed = true; 
	}else{
		$('phone').removeClassName('missed');
	}
		 
	if(missed == true){
		$('msg').innerHTML= "&nbsp;<strong><span style='font-size:15px;'>!</span> You did not fill in all the required fiels</strong>";
		return false;
	}
	
	
	new Ajax.Updater(
		'data',
		'pages/senddata.php',
		{
			method: 'post',
			parameters: form_values,
			requestHeaders: ['Expires', 'Thu, 17 May 2001 10:17:17 GMT', 'Cache-Control', 'no-cache, must-revalidate', 'Pragma', 'no-cache'],
			onComplete: function () {
				//new Effect.Fade('data',{ duration: 0.2 });
				new Effect.Highlight( $("data"), {startcolor:"#1669b3", endcolor:"#ffffff", duration:1.5})
			//	new Effect.Appear('data',{ duration: 1.0, delay: 0.3 });
			}
		});
}