// JavaScript Document
$(document).ready(function()
{	
	$move_click_y = 0;
	$move_click_x = 0;
	$elements 	= ['header', 'wrap-0', 'wrap-1', 'wrap-2', 'wrap-3','wrap-4'];
	$animated 	= ['wrap-0', 'wrap-1', 'wrap-2', 'wrap-3','wrap-4'];
	$speed 		= [4000,4000,3500,2000,3000];
	$distance = [-50,-50,-30,-10,-0];
	$head_layers = ['.header'];
	$star_layers = ['.wrap-0', '.wrap-1'];
	$shape_layers = ['.wrap-2','.wrap-4'];
	$text_layers = ['.wrap-3'];
	
	jQuery.preLoadImages("../images/level-0.png","../images/level-1.png","../images/110911_Jenson8_spritecow.png");
	
	$w_height = $(window).height();
	$w_width  = $(window).width();
	//center header
	centerDiv('#header');
	
	//set hights 
	setHights();
	
	//set animation cordinates 
	animateCordination();

	//set default screen
	pathTrack();
	
	// screen resize event. 	
	pageResizeFix();
	
	//init screen 
	screenTextFade();	
	
	// fadein page content.
	initFadein();

	//click events
	moveNavi();
	
	//validation
	validation();
	
});

(function($) {
  var cache = [];
  // Arguments are image paths relative to the current page.
  $.preLoadImages = function() {
    var args_len = arguments.length;
    for (var i = args_len; i--;) {
      var cacheImage = document.createElement('img');
      cacheImage.src = arguments[i];
      cache.push(cacheImage);
    }
  }
})(jQuery)

function pathTrack()
{
	$hashes = window.location.href.slice(window.location.href.indexOf('#') + 1);
	animateCordination();
	$('.screen').removeClass('showing');
	
	$id="move-click-01";
	if($hashes=='home')				{ $move_click_x=$move_click_x_2; $move_click_y=$move_click_y_2; $screen = '.grid-05'; $id="move-click-01";}
	else if($hashes=='what') 		{ $move_click_x=$move_click_x_2; $move_click_y=$move_click_y_3; $screen = '.grid-08'; $id="move-click-03";}
	else if($hashes=='service') 	{ $move_click_x=$move_click_x_1; $move_click_y=$move_click_y_2; $screen = '.grid-04'; $id="move-click-04";}
	else if($hashes=='who') 		{ $move_click_x=$move_click_x_3; $move_click_y=$move_click_y_1; $screen = '.grid-03'; $id="move-click-11";}
	else if($hashes=='contact') 	{ $move_click_x=$move_click_x_1; $move_click_y=$move_click_y_4; $screen = '.grid-10'; $id="move-click-10";}
	else if($hashes=='r8') 			{ $move_click_x=$move_click_x_1; $move_click_y=$move_click_y_3; $screen = '.grid-07'; $id="move-click-08";}
	else if($hashes=='iplan8') 		{ $move_click_x=$move_click_x_2; $move_click_y=$move_click_y_1; $screen = '.grid-02'; }
	else if($hashes=='director8') 	{ $move_click_x=$move_click_x_3; $move_click_y=$move_click_y_2; $screen = '.grid-06'; }
	else if($hashes=='reciproc8')	{ $move_click_x=$move_click_x_1; $move_click_y=$move_click_y_1; $screen = '.grid-01'; }
	else							{ $move_click_x=$move_click_x_2; $move_click_y=$move_click_y_2; $screen = '.grid-05'; $id="move-click-01";}
	
	$('#'+$id).addClass('show');
	$($screen).addClass('showing');
	screenSet ($move_click_x, $move_click_y);
}

function initFadein()
{
	$($head_layers[0]).fadeIn(1000,'',function() {
		$($star_layers[0]+' , '+$star_layers[1]).fadeIn(1000,'',function() {
			$($text_layers[0]).fadeIn(1000,'',function() {
				$($shape_layers[0]).fadeIn(1000,'',function() {
					$($shape_layers[1]).fadeIn(1000,'','')
				}
			)}
		)}
	)}); 
}

function showContent($id)
{
	$id = $($id).attr('id'); 
	$('.contact_me').hide();
	if($('#'+$id).hasClass('active'))
	{
		$('#'+$id).removeClass('active')
		$("#"+$id).siblings('.content').stop(true, true).slideUp('slow');		
	}
	else
	{
		$('#'+$id).addClass('active');
		$("#"+$id).siblings('.content').stop(true, true).slideDown('slow');
	}
}

function showForm($id)
{
	$id = $($id).attr('id'); 
	var position = $('#'+$id).position();
	$('input,textarea').removeClass('error-back');
	
	if($('#'+$id).hasClass('active'))
	{
		$('.contact_me, .contact_us').hide();
		$('#'+$id).removeClass('active')
		$("#"+$id).siblings('.contact_me').stop(true, true).fadeOut('fast');	
	}
	else
	{
		$('.contact_me').hide();
		$('#'+$id).addClass('active');
		$("#"+$id).siblings('.contact_me').stop(true, true).fadeIn('fast');
		$("#"+$id).siblings('.contact_me').css("left",position.left+20);
		$("#"+$id).siblings('.contact_me_down').css("top",position.top+15)
		$("#"+$id).siblings('.contact_me_up').css("bottom",-(position.top-130))
		$("#"+$id).siblings('.contact_us_up').css("bottom",-(position.top-60))
	}
}

function animateCordination()
{
	//y cordinates

	$move_click_y_1 = [-0,-50,0,0,0];
	$move_click_y_2 = [-50, -150, -$w_height, -$w_height,-$w_height];
	$move_click_y_3 = [-100, -200, -$w_height*2, -$w_height*2, -$w_height*2];
	$move_click_y_4 = [-150,-250,-$w_height*3,-$w_height*3,-$w_height*3];
	
	//x cordinates
	$move_click_x_1 = [-0,-0,0,0,0];
	$move_click_x_2 = [-100,-200, -$w_width, -$w_width, -$w_width];
	$move_click_x_3 = [-200,-300,-$w_width*2,-$w_width*2,-$w_width*2];
}


function screenSet ($move_click_x, $move_click_y)
{
	$.each($animated,function(e) 
	{
		$('.'+this).css("left",""+$move_click_x[e]+"px");
		$('.'+this).css("top",""+$move_click_y[e]+"px")
	})
}



function screenTextFade()
{
	$selectedbox = '.showing .wrap ';
	$($selectedbox+'.box-01').fadeIn(2000,'',function() {
		$($selectedbox+'.box-02').fadeIn(400,'',function() {
			$($selectedbox+'.box-03').fadeIn(400,'',function() {
				$($selectedbox+'.box-04').fadeIn(400,'',function() {
						$($selectedbox+'.box-05').fadeIn(400,'',function() {
							$($selectedbox+'.box-06').fadeIn(400,'','')}
						)
				})
			}
		)}
	)}); 
}

function setHights()
{
	$w_height = $(window).height();
	$w_width  = $(window).width();

	if($w_width>940 && $w_height>660)
	{
		if($w_height<660) $w_height = 660;
		centerDiv('#header');
		$('#wrap').height($w_height);
		$('#wrap').width($w_width);
		$('#grid-3 .screen, #grid-2 .screen, #grid-4 .screen').height($w_height-60);
		$('#grid-3 .screen, #grid-2 .screen, #grid-4 .screen').width($w_width);
		$('#grid-3, #grid-wrap-3,#grid-2, #grid-wrap-2,#grid-4, #grid-wrap-4').width($w_width*3);
		$('#grid-3, #grid-wrap-3,#grid-2, #grid-wrap-2,#grid-4, #grid-wrap-4').height($w_height*4);
	}
	else 
	{
		$w_height = 660;
		$w_width = 940;
		centerDiv('#header');
		$('#wrap').height($w_height);
		$('#wrap').width($w_width);
		$('#grid-3 .screen, #grid-2 .screen, #grid-4 .screen').height($w_height-60);
		$('#grid-3 .screen, #grid-2 .screen, #grid-4 .screen').width($w_width);
		$('#grid-3, #grid-wrap-3,#grid-2, #grid-wrap-2,#grid-4, #grid-wrap-4').width($w_width*3);
		$('#grid-3, #grid-wrap-3,#grid-2, #grid-wrap-2,#grid-4, #grid-wrap-4').height($w_height*4);
		
	}
}


function pageResizeFix()
{
	$(window).resize(function(){
				
		setHights();
		animateCordination();
		
		$screen= '';
		if	   ($('#click-01').hasClass('showing')) { $move_click_y = $move_click_y_2; $move_click_x = $move_click_x_2; $screen = '.grid-01'; }
		else if($('#click-02').hasClass('showing')) { $move_click_y = $move_click_y_3; $move_click_x = $move_click_x_3; $screen = '.grid-02'; }
		else if($('#click-03').hasClass('showing')) { $move_click_y = $move_click_y_3; $move_click_x = $move_click_x_2; $screen = '.grid-03'; }
		else if($('#click-04').hasClass('showing')) { $move_click_y = $move_click_y_2; $move_click_x = $move_click_x_1; $screen = '.grid-04'; }
		else if($('#click-05').hasClass('showing')) { $move_click_y = $move_click_y_1; $move_click_x = $move_click_x_1; $screen = '.grid-05'; }
		else if($('#click-06').hasClass('showing')) { $move_click_y = $move_click_y_1; $move_click_x = $move_click_x_2; $screen = '.grid-06'; }
		else if($('#click-07').hasClass('showing')) { $move_click_y = $move_click_y_2; $move_click_x = $move_click_x_3; $screen = '.grid-07'; }
		else if($('#click-08').hasClass('showing')) { $move_click_y = $move_click_y_3; $move_click_x = $move_click_x_1; $screen = '.grid-08'; }
		else if($('#click-09').hasClass('showing')) { $move_click_y = $move_click_y_4; $move_click_x = $move_click_x_2; $screen = '.grid-09'; }
		else if($('#click-10').hasClass('showing')) { $move_click_y = $move_click_y_4; $move_click_x = $move_click_x_1; $screen = '.grid-10'; }
		else if($('#click-11').hasClass('showing')) { $move_click_y = $move_click_y_1; $move_click_x = $move_click_x_3; $screen = '.grid-11'; }
		else { $move_click_y = $move_click_y_2; $move_click_x = $move_click_x_2; $screen = '.grid-01'; }

		screenSet ($move_click_x, $move_click_y);

	});
}

function moveNavi()
{
		$('.scroll').click(function() {
		
		$id = $(this).attr('id'); 
		$('.contact_me').hide();
		$('input,textarea').removeClass('error-back');
		if(!$("#"+$id).hasClass('show'))
		{
			$('.screen').removeClass('showing');
			$('.screen .wrap .box').stop(true, true).fadeOut(300);
			$('.scroll').removeClass('show');
			$('#'+$id).addClass('show');			
			$('#grid-3 .grid-03 .box div.content').hide();
			
			if($id=='move-click-01' || $('.'+$id).hasClass('move-click-01')) 	{ $move_click_y = $move_click_y_2; $move_click_x = $move_click_x_2; $screen = '.grid-05'; }
			if($id=='move-click-02' || $('.'+$id).hasClass('move-click-02')) 	{ $move_click_y = $move_click_y_3; $move_click_x = $move_click_x_3; $screen = '.grid-09'; }
			if($id=='move-click-03' || $('.'+$id).hasClass('move-click-03')) 	{ $move_click_y = $move_click_y_3; $move_click_x = $move_click_x_2; $screen = '.grid-08'; }
			if($id=='move-click-04' || $('.'+$id).hasClass('move-click-04')) 	{ $move_click_y = $move_click_y_2; $move_click_x = $move_click_x_1; $screen = '.grid-04'; }
			if($id=='move-click-05' || $('.'+$id).hasClass('move-click-05')) 	{ $move_click_y = $move_click_y_1; $move_click_x = $move_click_x_1; $screen = '.grid-01'; }
			if($id=='move-click-06' || $('.'+$id).hasClass('move-click-06')) 	{ $move_click_y = $move_click_y_1; $move_click_x = $move_click_x_2; $screen = '.grid-02'; }
			if($id=='move-click-07' || $('.'+$id).hasClass('move-click-07')) 	{ $move_click_y = $move_click_y_2; $move_click_x = $move_click_x_3; $screen = '.grid-05'; }
			if($id=='move-click-08' || $('.'+$id).hasClass('move-click-08')) 	{ $move_click_y = $move_click_y_3; $move_click_x = $move_click_x_1; $screen = '.grid-07'; }
			if($id=='move-click-09' || $('.'+$id).hasClass('move-click-09')) 	{ $move_click_y = $move_click_y_4; $move_click_x = $move_click_x_2; $screen = '.grid-11'; }
			if($id=='move-click-10' || $('.'+$id).hasClass('move-click-10'))	{ $move_click_y = $move_click_y_4; $move_click_x = $move_click_x_1; $screen = '.grid-10'; }
			if($id=='move-click-11' || $('.'+$id).hasClass('move-click-11')) 	{ $move_click_y = $move_click_y_1; $move_click_x = $move_click_x_3; $screen = '.grid-03'; }
			
			$.each($animated,function(e) 
			{
				$('.'+this).stop(true, true).animate
				(
					{left:$move_click_x[e]+'px',top:$move_click_y[e]+'px'}, 
					$speed[e],
					"linear",
					function() { 					
						screenTextFade();
					}
				);
				
				$('.'+this).addClass(this+'-level1');
				$($screen).addClass('showing');
			})
		
		}

	}); 
}




function moveTo($toScreen) {

	$('.screen').removeClass('showing');
	$('.screen .wrap .box').stop(true, true).fadeOut(300);
	$('.scroll').removeClass('show');
	$('#grid-3 .grid-03 .box div.content').hide();
	$('.contact_me').hide();
	$('input,textarea').removeClass('error-back');
		
	if($toScreen=='5' ) 	{ $move_click_y = $move_click_y_2; $move_click_x = $move_click_x_2; $screen = '.grid-05'; }
	if($toScreen=='9' ) 	{ $move_click_y = $move_click_y_3; $move_click_x = $move_click_x_3; $screen = '.grid-09'; }
	if($toScreen=='8' ) 	{ $move_click_y = $move_click_y_3; $move_click_x = $move_click_x_2; $screen = '.grid-08'; }
	if($toScreen=='4' ) 	{ $move_click_y = $move_click_y_2; $move_click_x = $move_click_x_1; $screen = '.grid-04'; }
	if($toScreen=='1' ) 	{ $move_click_y = $move_click_y_1; $move_click_x = $move_click_x_1; $screen = '.grid-01'; }
	if($toScreen=='2' ) 	{ $move_click_y = $move_click_y_1; $move_click_x = $move_click_x_2; $screen = '.grid-02'; }
	if($toScreen=='6' ) 	{ $move_click_y = $move_click_y_2; $move_click_x = $move_click_x_3; $screen = '.grid-06'; }
	if($toScreen=='7' ) 	{ $move_click_y = $move_click_y_3; $move_click_x = $move_click_x_1; $screen = '.grid-07'; }
	if($toScreen=='11') 	{ $move_click_y = $move_click_y_4; $move_click_x = $move_click_x_2; $screen = '.grid-11'; }
	if($toScreen=='10')		{ $move_click_y = $move_click_y_4; $move_click_x = $move_click_x_1; $screen = '.grid-10'; }
	if($toScreen=='3' ) 	{ $move_click_y = $move_click_y_1; $move_click_x = $move_click_x_3; $screen = '.grid-03'; }
	
	$.each($animated,function(e) 
	{
		$('.'+this).stop(true, true).animate
		(
			{left:$move_click_x[e]+'px',top:$move_click_y[e]+'px'}, 
			$speed[e],
			"linear",
			function() { 					
				screenTextFade();
			}
		);
		
		$('.'+this).addClass(this+'-level1');
		$($screen).addClass('showing');
	})
 }


function validation()
{
	
	//contact us form validation
	$(".formsubmit").click(function()
	{
		$id = $(this).attr('id');
		//$("#"+$id).siblings('.formname')
		var hasError = false;
		var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
		if($("#"+$id).siblings('.formwhatmatters').val()=="" || $("#"+$id).siblings('.formwhatmatters').val()=="Your Query")
		{
			//$("#name-text").addClass("error-back");
			//$("#error").html("<span class=\"bold\">Error</span>: Please complete all required fields");
			$("#"+$id).siblings('.formwhatmatters').select().focus(); 
			$("#"+$id).siblings('.formwhatmatters').addClass("error-back"); 
			hasError = true;
		}
		else 
		{ 
			$("#"+$id).siblings('.formwhatmatters').removeClass("error-back"); 	
		} 


		if($("#"+$id).siblings('.formemail').val()=="" ||  $("#"+$id).siblings('.formemail').val()=="Your email")
		{
			//$("#email-text").addClass("error-back");
			//$("#error").html("<span class=\"bold\">Error</span>: Please complete all required fields");
			$("#"+$id).siblings('.formemail').select().focus();
			$("#"+$id).siblings('.formemail').addClass("error-back"); 
			hasError = true;
			 
		}
		else if(!emailReg.test($("#"+$id).siblings('.formemail').val())) 
		{
			//$("#email").addClass("error-back");
			//$("#error").html("<span class=\"bold\">Error</span>: invalid email address");
			$("#"+$id).siblings('.formemail').select().focus();  
			$("#"+$id).siblings('.formemail').addClass("error-back"); 
			hasError = true;
		}
		else 
		{ 
			$("#"+$id).siblings('.formemail').removeClass("error-back");
		} 
		
		if($("#"+$id).siblings('.formname').val()=="" || $("#"+$id).siblings('.formname').val()=="Your name")
		{
			//$("#name-text").addClass("error-back");
			//$("#error").html("<span class=\"bold\">Error</span>: Please complete all required fields");
			$("#"+$id).siblings('.formname').select().focus(); 
			$("#"+$id).siblings('.formname').addClass("error-back"); 
			hasError = true;
		}
		else 
		{ 
			$("#"+$id).siblings('.formname').removeClass("error-back"); 	
		} 


	
		if(hasError == false) 
		{
			//$("#error").addClass("green");
			//$("#error").html("Thanks");
			return true;
		}
		else {return false;}
	});

}
function centerDiv($element)
{
	$($element).css('margin-left', (($w_width-($($element).width()))/2))	
}