/*
home-animation.js
=================
This file is manually included by the home_inc-js.php file
within this themes directory if animations are not disabled.

This file is only loaded on the homepage of this theme, and
doesn't apply animations across the site. If you wish to apply
an animation across the whole site then please do so in global-animation.js

Remember that animations are theme specific, meaning
this file only effects the current theme that you are
animating, and not every theme across the TemplateOTS platform.

See detailed documentation here:-
	https://docs.google.com/document/d/1n5sWQ8SIr-zjOpTv8YnOTHJapO8WdedjDfbeo-lkqMM/edit#heading=h.lmxb59mpcpe2
*/

	(function ()
	{

		/*
		On Document Loaded
		==================
		Called by Jquery event handler when the document is
		ready (When content has been loaded)
		*/

			$( document ).ready( function()
			{
				// Try and store the square container
					var oH1SquareContainer = $("#h1-square-container");

				// Try and store all the boxes
					var oHeaderBoxes = $("*#box-1");

				// Tran and store the top 4 image row
					var oTopFourImageRow = $("#top-four-images-row");

				// If the square container exists
					if( oH1SquareContainer.length )
					{
						// Animate the square container
							fAnimateSquareContainer(oH1SquareContainer);
					}

				// If the header boxes exists
					if( oHeaderBoxes.length )
					{
						// Animate the header boxes
							fAnimateHeaderBoxes(oHeaderBoxes);
					}

				// If the four image row exists
					if( oTopFourImageRow.length )
					{
						// Animate the four image row
							TweenMax.to( oTopFourImageRow, 1,
							{
								opacity : 1,
								delay : 0.25,
								ease : Power2.easeIn
							});
					}
			});

		/*
		fAnimateSquareContainer()
		=========================
		*/

			function fAnimateSquareContainer(oH1SquareContainer)
			{
				// Animate the h1 square container
					TweenMax.to( oH1SquareContainer, 1,
					{
						opacity : 1,
						ease : Power2.easeIn
					});
			}


		/*
		fAnimateHeaderBoxes()
		=====================
		*/

			function fAnimateHeaderBoxes(oHeaderBoxes)
			{

				// Set the delay
					var nDelay = 0.1;

				// Loop through every box
					oHeaderBoxes.each( function()
					{
						// Animate the delay
							TweenMax.to( $(this), 1,
							{
								opacity : 1,
								delay : nDelay,
								ease : Power2.easeIn
							});

						// Increase the delay
							nDelay += 0.05;
					});
			}

	}());