/*
  	Ochre House Animation
	Copyright Ochre House 2011
	---------------------------
	Xavier Akram
	http://www.freelanc3r.co.uk
	07401 734 074
*/


$(function(){
	
	$('#oh_canvas').removeClass('nojs').addClass('js');
	
	/* Global Variables */
	var _IDs = "img#imgPisa, img#imgBankChina, img#imgSydney, img#imgPetronas, img#imgBooks, img#imgKremlin, img#imgBridge, img#imgEmpire, img#imgLetterbox, img#imgTrafficLight, img#imgPavement, img#imgOchre, img#imgStephensTower, img#imgClouds, img#imgBus, img#imgRickshaw, img#imgPlane, img#swooshOne, img#swooshTwo, img#swooshThree";
	var _clouds = 0;
	
	function ohClouds(){
		if(_clouds == 0){
			_clouds = 1;
			$('img#imgClouds').delay(3700).animate({ "left": "-842px", "opacity": 1}, 1000).delay(500).animate({ "left": "1000px", "opacity" : 1 }, 40000);
		} else {
			$('img#imgClouds').remove().clone().css({'left' : '-840px'}).appendTo('#oh_canvas .oh_container').animate({ "left": "1000px", "opacity" : 1 }, 40000);
		}
		setTimeout(function(){
			ohClouds();
		},44200);
	}
	
	function ohAnimation(){
		$(_IDs).animate({ "opacity" : 0 }, 0).css('display', 'block');
		$('img#imgPisa').animate({ "bottom": "0", "opacity": 1}, 500, function(){	$(this).css({'background' : 'none'});	});
		$('img#imgSydney').delay(500).animate({ "bottom" : "0", "opacity": 1}, 500, function(){	$(this).css({'background' : 'none'});	} );
		$('img#imgPavement').animate({ "bottom" : "3%", "opacity": 1}, 500, function(){	$(this).css({'background' : 'none'});	} );
		$('img#imgBankChina').delay(1000).animate({ "bottom": "0", "opacity": 1}, 500, function(){	$(this).css({'background' : 'none'});	} );
		$('img#imgPetronas').delay(1000).animate({ "bottom": "12.1%", "opacity": 1}, 500, function(){	$(this).css({'background' : 'none'});	} );
		$('img#imgLetterbox').delay(500).animate({ "bottom": "0%", "opacity": 1}, 500, function(){	$(this).css({'background' : 'none'});	} );
		$('img#imgKremlin').delay(1500).animate({ "bottom": "34%", "opacity": 1}, 500, function(){	$(this).css({'background' : 'none'});	} );
		$('img#imgOchre').delay(1000).animate({ "bottom": "7%", "opacity": 1}, 500, function(){	$(this).css({'background' : 'none'});	} );
		$('img#imgBooks').delay(2000).animate({ "bottom": "23%", "opacity": 1}, 500, function(){	$(this).css({'background' : 'none'});	} );
		$('img#imgTrafficLight').delay(1500).animate({ "bottom": "2%", "opacity": 1}, 500, function(){	$(this).css({'background' : 'none'});	} );
		$('img#imgStephensTower').delay(2000).animate({ "bottom": "22.5%", "opacity": 1}, 500, function(){	$(this).css({'background' : 'none'});	} );
		$('img#imgBridge').delay(2500).animate({ "bottom": "46%", "opacity": 1}, 500, function(){	$(this).css({'background' : 'none'});	} );
		$('img#imgPlane').delay(2800).animate({ "opacity" : 1 }).delay(1000).animate({ "left" : "65%", "top" : "-25%" }, 20000);
		$('img#imgEmpire').delay(3000).animate({ "bottom": "48.7%", "opacity": 1}, 500, function(){	$(this).css({'background' : 'none'});	} );
		$('img#imgBus').delay(3000).animate({"opacity" : 1}).animate({ "left": "1000px", "opacity": 1, "bottom" : "50px"}, 7000, function(){	$(this).css({'background' : 'none'});	});
		$('#ochreTextOne').delay(3000).fadeIn(500, function(){	$(this).css({'background' : 'none'});	});
		ohClouds();
		$('img#imgRickshaw').delay(4000).animate({"opacity" : 1}).animate({ "left": "1000px", "opacity": 1, "bottom" : "50px"}, 7000);
		$('img#imgPeople, img#imgWoman').css({'background' : '#FFFFFF'}).delay(10000).fadeIn(500, function(){	$(this).css({'background' : 'none'});	});
		var _width = $('#oh_canvas').outerWidth();
		$('img#swooshTwo, img#swooshThree').hide();
		$('img#swooshOne').show();
		$('img#swooshOne, img#swooshTwo, img#swooshThree').css({'opacity' : 1});
		$('img#swooshOneOverlay').css({'display' : 'block'}).delay(10000).animate({ 'left' : -_width}, 3000).delay(1500).animate({'left' : '0px'}, 2700, function(){
			$('img#swooshTwo, img#swooshThree').show();
			$('img#swooshOne').hide();
		}).delay(5000).animate({ 'left' : -_width}, 3000).delay(1500).animate({'left' : '0px'}, 2700, function(){
			$('img#swooshTwo, img#swooshThree').hide();
		});
	}
	ohAnimation();
});