var speed1 = 500;
var speed2 = 1500;
var speed3 = 400;
var speed4 = 2900;
var speed5 = 4000;

var transEasing = "linear";

var animCompleted = true;



function buildHeader(){
	var contructionString = '<div id="jqHeaderLoad" class="images" ></div><div id="image8" class="images" ></div><div id="image9" class="images" style="width:0;"></div><div id="image6" class="images" ></div><div id="image7" class="images" style="width:0;"></div><div id="image4" class="images"></div><div id="image5" class="images" style="width:0;"></div><div id="image2" class="images"></div><div id="image3" class="images" style="width:0;"></div><div id="image1" class="images"></div><div id="opacityMask" ></div><div id="image2Mask" class="imageMasks"></div><div id="image4Mask" class="imageMasks"></div><div id="image6Mask" class="imageMasks"></div><div id="image7Mask" class="imageMasks"></div><div id="image8Mask" class="imageMasks"></div><div id="t1a1"></div><div id="t1a2"></div><div id="t1b1"></div><div id="t1b2"></div><div id="t1c1"></div><div id="t1c2"></div>';
	$('#jqHeader').append(contructionString);
}



$(document).ready(function() {
	buildHeader();
});

$(document).ready(function() {
	$('#jqHeaderLoad').fadeOut('slow');
	
	$(function() {
		setInterval( "checkInterval()", 2000 );
	});
});

function animateHeader(){
	//- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Move1 to pos1a
	$('#opacityMask').animate({left: '500px',width: '221px' }, speed2, function() {
		$('#t1a1').empty();
		$('#t1a1').append("COUNTRY<br/>HOUSE LIVING");
		$('#t1a2').empty();
		$('#t1a2').append("AT ITS<br/>VERY BEST");
		$('#t1a1').fadeIn(speed3, function() {
			$('#t1a2').fadeIn(speed3, function() {
				setTimeout(function(){
					$('#t1a2').fadeOut(speed3, function() {
						$('#t1a1').fadeOut(speed1);
					});
				},speed4);
			});
		});
		
		setTimeout(function(){
   		//- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Move2 to pos2a
		$('#image1').animate({width: '500px' }, speed1, transEasing, function() {
			$('#image1').animate({width: '0' }, speed2, transEasing, function() {
				
			});
		});
		$('#opacityMask').animate({left: '500px',width: '1px' }, speed1, transEasing, function() {
			$('#image2Mask').show();
			$('#opacityMask').animate({left: '0',width: '501px' }, speed2, transEasing, function() {
				//- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Move3 to pos1b
				$('#opacityMask').animate({left: '0',width: '221px' }, speed2,  function() {
					enlargeMask('#image2Mask');
					$('#t1b1').empty();
					$('#t1b1').append("&nbsp;<br/>SEAMLESS");
					$('#t1b2').empty();
					$('#t1b2').append("LUXURY");
					$('#t1b1').fadeIn(speed3, function() {
						$('#t1b2').fadeIn(speed3, function() {
							setTimeout(function(){
								$('#t1b1').fadeOut(speed3, function() {
									$('#t1b2').fadeOut(speed1);
								});
							},speed4);
						});
					});
					setTimeout(function(){
						$('#image3').animate({width: '220px' }, speed1, transEasing, function() {
							$('#image3').animate({width: '720px' }, speed2, transEasing, function() {
								
							});
						});
					//- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Move4 to pos2b
					
					$('#opacityMask').animate({left: '221px',width: '0' }, speed1, transEasing, function() {
						$('#image2Mask').hide();
						shrinkMask('#image2Mask');
							//- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Move5 to pos1a
							$('#opacityMask').animate({left: '220px',width: '501px' }, speed2, transEasing, function() {
								$('#opacityMask').animate({left: '500px',width: '222px' }, speed2,  function() {
									$('#t1a1').empty();
									$('#t1a1').append("FIVE STAR<br/>SERVICE");
									$('#t1a2').empty();
									$('#t1a2').append("SECOND<br/>TO NONE");
									$('#t1a1').fadeIn(speed3, function() {
										$('#t1a2').fadeIn(speed3, function() {
											setTimeout(function(){
												$('#t1a2').fadeOut(speed3, function() {
													$('#t1a1').fadeOut(speed1);
												});
											},speed4);
										});
									});
									setTimeout(function(){
										$('#image2').width(0);
										$('#image3').animate({width: '500px' }, speed1, transEasing, function() {
											$('#image3').animate({width: '0' }, speed2, transEasing, function() {
												
											});
										});
									//- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Move7 to pos2a-1b
									$('#opacityMask').animate({left: '500px',width: '1px' }, speed1, transEasing, function() {
										$('#image4Mask').show();
										$('#opacityMask').animate({left: '0',width: '501px' }, speed2, transEasing, function() {
											$('#opacityMask').animate({left: '0',width: '221px' }, speed2, function() {
												enlargeMask('#image4Mask');
							
												$('#t1b1').empty();
												$('#t1b1').append("BON<br/>APPETIT");
												$('#t1b2').empty();
												$('#t1b2').append("OUTSTANDING<br/>CUISINE");
												$('#t1b1').fadeIn(speed3, function() {
													$('#t1b2').fadeIn(speed3, function() {
														setTimeout(function(){
															$('#t1b1').fadeOut(speed3, function() {
																$('#t1b2').fadeOut(speed1);
															});
														},speed4);
													});
												});
												setTimeout(function(){
														$('#image5').animate({width: '220px' }, speed1, transEasing, function() {
															$('#image5').animate({width: '720px' }, speed2, transEasing, function() {
																
															});
														});
														
												//- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Move8 to pos2b-1a
												$('#opacityMask').animate({left: '221px',width: '0' }, speed1, transEasing, function() {
													$('#image4Mask').hide();
													shrinkMask('#image4Mask');
													$('#opacityMask').animate({left: '220px',width: '501px' }, speed2, transEasing, function() {
														$('#opacityMask').animate({left: '500px',width: '222px' }, speed2, function() {
									
															$('#t1a1').empty();
														$('#t1a1').append("SECLUDED<br/>SERENITY");
															$('#t1a2').empty();
															$('#t1a2').append("IN OUR<br/>SPA");
															$('#t1a1').fadeIn(speed3, function() {
																$('#t1a2').fadeIn(speed3, function() {
																	setTimeout(function(){
																		$('#t1a2').fadeOut(speed3, function() {
																			$('#t1a1').fadeOut(speed1);
																		});
																	},speed4);
																});
															});
															setTimeout(function(){
																$('#image4').width(0);
																	$('#image5').animate({width: '500px' }, speed1, transEasing, function() {
																		$('#image5').animate({width: '0' }, speed2, transEasing, function() {
																			
																		});
																	});
															//- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Move9 to pos2a-1b
															$('#opacityMask').animate({left: '500px',width: '1px' }, speed1, transEasing, function() {
																$('#image6Mask').show(); 
																$('#opacityMask').animate({left: '0',width: '501px' }, speed2, transEasing, function() {
																	$('#opacityMask').animate({left: '0',width: '221px' }, speed2, function() {
																		enlargeMask('#image6Mask');
																		$('#t1b1').empty();
																		$('#t1b1').append("EXCLUSIVE<br/>TREATMENTS");
																		$('#t1b2').empty();
																		$('#t1b2').append("IN LUXURIOUS<br/>SURROUNDINGS");
																		$('#t1b1').fadeIn(speed3, function() {
																			$('#t1b2').fadeIn(speed3, function() {
																				setTimeout(function(){
																					$('#t1b1').fadeOut(speed3, function() {
																						$('#t1b2').fadeOut(speed1);
																					});
																				},speed4);
																			});
																		});
																		setTimeout(function(){
																			$('#image7').animate({width: '220px' }, speed1, transEasing, function() {
																				$('#image7').animate({width: '720px' }, speed2, transEasing, function() {
																					
																				});
																			});
																			
																		//- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Move10 to pos2b-1a
																	
																		$('#opacityMask').animate({left: '221px',width: '0' }, speed1, transEasing, function() {
																		//	$('#image7Mask').show();
																			$('#image6Mask').hide();
																			shrinkMask('#image6Mask');
																			$('#opacityMask').animate({left: '220px',width: '501px' }, speed2, transEasing, function() {
																				//$('#opacityMask').animate({left: '500px',width: '222px' }, speed2, function() {
					
																					$('#t1c1').empty();
																					$('#t1c1').append("A<br/>PERFECT<br/>WAY");
																					$('#t1c2').empty();
																					$('#t1c2').append("TO<br/>RELAX");
																					$('#t1c1').fadeIn(speed3, function() {
																						$('#t1c2').fadeIn(speed3, function() {
																							setTimeout(function(){
																								$('#t1c2').fadeOut(speed3, function() {
																									$('#t1c1').fadeOut(speed1);
																								});
																							},speed4);
																						});
																					});
																					setTimeout(function(){
																						$('#image6').width(0);
																							$('#image7').animate({width: '220px' }, speed1, transEasing, function() {
																								$('#image7').animate({width: '0' }, speed2, transEasing, function() {
																									
																								});
																							});
																					//- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Move11 to pos2b
																					$('#opacityMask').animate({left: '220px',width: '1px' }, speed1, transEasing, function() {
																						$('#image8Mask').show();
																						$('#opacityMask').animate({left: '0',width: '221px' }, speed2, transEasing, function() {
																							$('#t1b1').empty();
																							$('#t1b1').append("EXPLORE<br/>OUR ESTATE");
																							$('#t1b2').empty();
																							$('#t1b2').append("ON<br/>HORSEBACK");
																							$('#t1b1').fadeIn(speed3, function() {
																								$('#t1b2').fadeIn(speed3, function() {
																									setTimeout(function(){
																										$('#t1b1').fadeOut(speed3, function() {
																											$('#t1b2').fadeOut(speed1);
																										});
																									},speed4);
																								});
																							});
																							setTimeout(function(){
																								$('#image9').animate({width: '220px' }, speed1, transEasing, function() {
																									$('#image9').animate({width: '720px' }, speed2, transEasing, function() {
																										
																									});
																								});
																							//- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Move12 to pos1b
																							$('#opacityMask').animate({left: '220px',width: '1px' }, speed1, transEasing, function() {
																								$('#image8Mask').hide();
																								$('#opacityMask').animate({left: '220px',width: '501px' }, speed2, transEasing, function() {
																									$('#opacityMask').animate({left: '500px',width: '222px' }, speed2, function() {//FINISHED - REPEAT
																									$('#t1b1').removeClass('text81');
																									$('#t1b2').removeClass('text82');
											
																									resetImages();
																									animCompleted = true;
																									});
																								});
																							});},speed5);
																						});
																					});},speed5);
																				//});
																			});
																		});},speed5);						
																	});
																});
															});},speed5);
														});
													});
												});},speed5);										
											});
										});
									});},speed5);											
								});		
							});
						});},speed5);
					});
				});
			});},speed5);
	 	});
}

function resetImages(){
	$('#image1').width(720);
	$('#image2').width(720);
	$('#image3').width(0);
	$('#image4').width(720);
	$('#image5').width(0);
	$('#image6').width(720);
	$('#image7').width(0);
	$('#image8').width(720);
	$('#image9').width(0);
}

function checkInterval(){
	if (animCompleted){
		animateHeader();
		animCompleted = false;
			
	}
}

function enlargeMask(maskID) {
	$(maskID).css('backgroundPosition', -220);
	$(maskID).css('left', 220);
}
function shrinkMask(maskID) {
	$(maskID).css('backgroundPosition', -500);
	$(maskID).css('left', 500);
}


