/* 
The Warehouse Agency
Digital Warehouse Agency
Model Properties and Functions
*/
var NavUserAgent = navigator.userAgent;
var ua = navigator.userAgent, event = (ua.match(/iPad/i)) ? "touchstart" : "click";
var URL = location.hash;
var urlHash = location.hash;
var currHash = location.hash;
var clientURL = '';
var clientPath = '';
var clientsArray = [];
var clientName = '';
var clientsPos;
var clientIndex;
var activeSlide;
var hashArray;
var activeContent;
var activeClient;
var activeNav;

var viewWidth;
var viewHeight;
var viewRatio;

var isMobile = false;

var imageWidth;
var imageHeight;
var imageRatio = 1400 / 800;

var bgWidth;
var bgHeight;
var bgRatio;
var bgVideo;

var ContactBGWidth;
var ContactBGHeight;
var ContactBGRatio;

var reel;

var isScroll = true;
var isClient = false;
var isLeads = false;
var isAbout = false;
var isContact = false;
var isInfo = false;
var isReel = false;
var isVideo = true;
var clientsInitialized = false;

var phoneRegExp = /^\(?([2-9][0-8][0-9])\)?[-. ]?([2-9][0-9]{2})[-. ]?([0-9]{4})$/;
var intPhoneRegExp = /^\+?[0-9\(\)\s,-]{11,19}$/;
var nameRegExp = /\W/;
var emailRegExp = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/;

var resizeDelay;

var aboutLen;
var aboutTimer;
var aboutDelay;
var aboutIndex = 1;
var aboutFocus;
var aboutInfoFocus;
var aboutSelectorFocus;

var leadsLen;
var leadsTimer;
var leadsDelay;
var leadsIndex = 0;
var leadsFocus;
var leadsInfoFocus;
var leadsSelectorFocus;
/////////////////////////////////////////////////////////
/////////////// Prototype Functions /////////////////////
/////////////////////////////////////////////////////////
String.prototype.capitalize = function()
{
   return this.replace( /(^|\s)([a-z])/g , function(m,p1,p2)
   { 
   	return p1+p2.toUpperCase(); 
   });
};
Array.prototype.getIndex = function(value)
{
	for(var i = 0; i < this.length; i++){
		if(this[i] == value){
			return i;
		}
	}
}

/////////////////////////////////////////////////////////
/////////////////// Clear Functions /////////////////////
/////////////////////////////////////////////////////////
function clearTimers()
{
	clearTimeout(leadsTimer);
	clearTimeout(aboutTimer);
}

function clearBooleans()
{
	var isLeads = false;
	var isAbout = false;
	var isContact = false;
}
/////////////////////////////////////////////////////////
////////////////// Resize Functions /////////////////////
/////////////////////////////////////////////////////////
function align()
{
	viewWidth = $(window).width();
	viewHeight = $(window).height();
	viewRatio = viewWidth / viewHeight;
	
	if(isClient)
	{
		if(imageRatio < viewRatio)
		{
			imageHeight = Math.round(viewHeight - 210);
			imageWidth =  Math.round(imageHeight * (imageRatio));
			$('#clients-images, .client-image-slide').css({ 'width' : imageWidth, 'height' : imageHeight });
			$('#client-info').css({ 'width' : imageWidth });
			$('#clients-slides-controller').css({ 'width' : imageWidth - 18 });
			$('#client-info-controller').css({ 'top' : imageHeight });
			$('#clients-close').css({ 'left' : imageWidth + 250 });
		}
		else
		{
			imageWidth =  Math.round(viewWidth - 300);
			imageHeight =  Math.round(imageWidth / (imageRatio));
			$('#clients-images, .client-image-slide').css({ 'width' : imageWidth, 'height' : imageHeight });
			$('#client-info').css({ 'width' : imageWidth });
			$('#clients-slides-controller').css({ 'width' : imageWidth - 18 });
			$('#client-info-controller').css({ 'top' : imageHeight });
			$('#clients-close').css({ 'left' : imageWidth + 250 });
		}		
	}
	
	if(isContact)
	{
		if(ContactBGRatio > viewRatio)
		{
			$('#contact-bg-img').css({ 'height' : viewHeight, 'width' : 'auto' });
		}
		else
		{
			$('#contact-bg-img').css({ 'width' : viewWidth, 'height' : 'auto' });
		}
	}
	
	if(isLeads)
	{		
		$('.leads-image').css({ 'left' : viewWidth + 600, 'height' : '90%', 'width' : 'auto' });	
		$(leadsFocus).css({ 'left' : '50%' });
		$('.leads-image').each(function()
		{
			var leadsLeft = parseInt($(this).width() * (-0.5));
			$(this).css({ 'margin-left' : leadsLeft });
		});	
	}
	else
	{
		$('.leads-image, .leads-info').css({ 'left' : viewWidth + 600, 'opacity' : 0 });	
	}
	
	if(isAbout)
	{
		$('.about-slide').css({ 'left' : viewWidth + 600 });	
		$(aboutFocus).css({ 'left' : '50%' });	
	}
	else
	{
		$('.about-slide').css({ 'left' : viewWidth + 600, 'opacity' : 0 });	
	}
	
	if(isVideo)
	{
		if(bgRatio > viewRatio)
		{
			$("#ink-blot").css({ 'height' : viewHeight, 'width' : 'auto' });
		}
		else
		{
			$("#ink-blot").css({ 'width' : viewWidth, 'height' : 'auto' });
		}
	}
	
	if(isMobile)
	{		
		if(isScroll)
		{
			viewHeight = $('#clients-list').height();
			$('#clients-background-container').hide();
			$('#ink-blot').html('');
		}
	}
}

/////////////////////////////////////////////////////////
////////////// Innitialize Functions ////////////////////
/////////////////////////////////////////////////////////
function init()
{
	URL = URL.replace('#', '');
	
	if(URL == '')
	{
		URL = '/clients/';
		activeNav = 'clients';
		location.hash = URL;
		urlHash = '#/clients/';
		isVideo = true;
	}
	
	initContents();
	
	bgWidth = $("#ink-blot").width();
	bgHeight = $("#ink-blot").height();
	bgRatio = bgWidth / bgHeight;
	bgVideo = document.getElementById('ink-blot');
	$('#clients-background-container').fadeIn(400);
	
}

function initClientsArray()
{
	$('.clients-li').each(function()
	{
		var str = $(this).text();
		str = str.toLowerCase();
		str = str.replace(/[^A-Za-z0-9 ]/g, '');
		str = str.replace(/ /g, '-');
		clientsArray.push(str);
	});
}

function activateClients()
{	
	$('#clients').fadeIn(20);
	$('.clients-li').css({ 'margin-top' : '200px', 'opacity' : '0' });
	$('#clients-list').css({ 'top' : '200px' });
	$('#no-hit').fadeIn(0);
	
	var num = 0;
	var len = $('.clients-li').length;
	var noHitDelay = (len * 30) + 1800;	
	
	$('.clients-li').each(function()
	{
		var top = -1 * (len - num) * 2;
		
		$(this).delay(num * 30).animate({ 'margin-top' : top, 'opacity' : '1' }, 900, function()
		{  
			$(this).animate({ 'margin-top' : '20px' }, 900);
		});
		
		num++;
	});
	
	$('#clients-list').animate({ 'top' : '0' }, 1200);
	
	if(clientName != '')
	{
		var clientsDelay = setTimeout(function()
		{			
			var str = clientName.replace(/ /g, '-');
			str = str.replace(/[^A-Za-z0-9 -]/g, '');
			str = str.toLowerCase();
			clientIndex = clientsArray.getIndex(str);
			clientIndex = '#clients-li-' + clientIndex;
			initClient();
		}, noHitDelay + 400);
	}
	else
	{
		$('#no-hit').delay(noHitDelay).fadeOut(300);
	}
	
	clientsInitialized = true;
	isVideo = true;
}


/////////////////////////////////////////////////////////
///////////// Load Content Functions ////////////////////
/////////////////////////////////////////////////////////
function initClient()
{
	var str = clientName.replace(/ /g, '-');
	var index = clientIndex.replace(/\D/g, '');
	var y = $(clientIndex).position().top;
	var Y = 10 - y;
	clientsPos = Y;
	
	$('#clients-portfolio').fadeOut(0);
	
	bgVideo.pause();
	
	str = str.toLowerCase();
	str = str.replace(/[^A-Za-z0-9 -]/g, '');
	
	$('#clients-title-p').text($(clientIndex).text());
	
	if(isScroll)
	{			
		isScroll = false;
		$('#clients-list').animate({ 'top' : Y }, 600, function()
		{
			$('#clients-title').fadeIn(300);			
			$('#clients-list').fadeOut(300);
			$('#clients-background-container').fadeOut(400);
			
			initClients(str);
		});
	}
	
	$('#no-hit').fadeIn(10);
}

function initClients(str)
{	
	if(clientURL != '')
	{
		location.hash = clientURL;
	}
	else
	{
		URL = str;
		URL = '/clients/' + URL + '/';
		clientPath = URL.replace('/', '') + '/index.html';
		clientURL = URL;
		location.hash = URL;
		urlHash = location.hash;
		currHash = urlHash;
	}
	
	isClient = true;
	$('#client-info, #client-info-img').css({ 'display' : 'none' });
	isInfo = false;
	
	$('#clients-images').load(clientPath, function(responseText)
	{
		align();
		initClientSlides();	
		$('#clients-portfolio').delay(300).fadeIn(300);
		$('#no-hit').delay(300).fadeOut(300);
	});	
}

function initClientSlides()
{	
	var zIndex = 0;
	activeSlide = 0;
	$('#clients-slides-controller').html('');
		
	$('.client-image-slide').each(function()
	{
		zIndex = $('.client-image-slide').index(this);
		$(this).css({ 'z-index' : 204 + zIndex });			
		$(this).attr({ 'id' : 'client-image-slide-' + zIndex });
		$('#clients-slides-controller').prepend('<div class="client-slide-selector" id="client-slide-selector-' + zIndex + '"><img src="images/global/selector-active.png" alt="&bull;" class="client-slide-selector-img" id="client-image-slide-selector-' + zIndex + '" /></div>');
	});
	
	$('#client-image-slide-0, #client-image-slide-selector-0').fadeIn(1200);
	initSlideControl();	
}

function exitClientSlides()
{
	location.hash = '/clients/';
	clientURL = '';	
	$('#no-hit').fadeIn(10);
	$('#clients-portfolio').fadeOut(300, function()
	{
		$('#clients-list').css({ 'top' : clientsPos });
		$('#clients-list').fadeIn(400);	
		$('#clients-title').fadeOut(400, function()
		{ 
			$('#clients-list').animate({ 'top' : '0' }, 600);
			$('#clients-title-p').text(''); 
			$('#no-hit').delay(1000).fadeOut(600);				
			
			$('#clients-background-container').fadeIn(400, function()
			{
				bgVideo.play();
				isScroll = true;
				isClient = false;
			});		
		});
	});	
}

function initSlideControl()
{
	$('.client-slide-selector').click(function()
	{
		var slideIndex = $(this).attr('id');
		changeSlide(slideIndex);
	});
	
	$('.client-slide-selector').bind(event, function(e) 
	{
		var slideIndex = $(this).attr('id');
		changeSlide(slideIndex);
	});
}

function changeSlide(slideIndex)
{
	slideIndex = slideIndex.replace(/\D/g, '');
		
	if(activeSlide != slideIndex)
	{
		$('.client-image-slide, .client-slide-selector-img').fadeOut(0);
		$('#client-image-slide-selector-' + slideIndex).fadeIn(300);
		$('#client-image-slide-' + slideIndex).fadeIn(800);
		activeSlide = slideIndex;
	}
}

function initContents()
{	
	hashArray = URL.split('/');
	activeContent = hashArray[1];
	activeContent = activeContent.toLowerCase();
	activeNav = activeContent;
	urlHash = location.hash;
	currHash = urlHash;
		
	clearBooleans();
	clearTimers();
	
	if(isReel)
	{
		reel.pause();
	}
	isReel = false;
	
	$('#no-hit').fadeIn(0);
	
	$('#' + activeContent + '-nav').attr({ 'class' : 'active-li' });
	
	$('.dynamic-contents').fadeOut(300);
	
	if(activeContent == 'clients')
	{	
		if(hashArray[2] != '')
		{
			clientName = hashArray[2];
			clientName = clientName.toLowerCase();
			activateClients();	
		}
		else if(!clientsInitialized)
		{
			activateClients();	
		}
		else if(clientsInitialized)
		{
			$('#clients').delay(200).fadeIn(600);
			$('#no-hit').delay(400).fadeOut(300);
			bgVideo.play();
		}
		if(clientURL != '')
		{
			location.hash = clientURL;
		}
		
		$('#clients-background-container').fadeIn(400);
	}
	else if(activeContent == 'about')
	{
		$('#about').html('');
		$('#about').load('about/about.html', function(responseText)
		{
			$('#about').fadeIn(600);
			$('#no-hit').delay(400).fadeOut(300);
			initAbout();
			isAbout = true;
		});		
	}
	else if(activeContent == 'leads')
	{
		$('#leads').html('');
		$('#leads').load('leads/leads.html', function(responseText)
		{				
			isLeads = true;		
			$('.leads-image').load( initLeads() );
		});		
	}
	else if(activeContent == 'reel')
	{
		$('#reel').html('');
		$('#reel').load('reel/reel.html', function(responseText)
		{
			$('#reel').fadeIn(600);	
			$('#no-hit').delay(400).fadeOut(300);
			reel = document.getElementById('movie');
			isReel = true;		
		});		
	}
	else if(activeContent == 'contact')
	{
		$('#contact').html('');
		$('#contact').load('contact/contact.html', function(responseText)
		{			
			isContact = true;
			$('#contact-bg-img').load( contactImageLoaded() );
		});		
	}
}

function contactImageLoaded()
{
	$('#contact').fadeIn(600);
	$('#no-hit').delay(400).fadeOut(300);
	initContact();
	align();
	enableClicks();
}


function clientsScroll(e)
{
	var contentHeight = $('#clients-list').height();
	var scrollItem = '#clients-list';
	var scrollTop = $('#clients-list').offset().top;       
	var scrollLimit = (viewHeight - contentHeight - 150);   
	var topOffset = Math.round(e.pageY - scrollTop);
	var scrollValue = Math.round((topOffset / contentHeight) * scrollLimit);    
	
	if(contentHeight > viewHeight && isScroll)
	{
		$(scrollItem).css({top : scrollValue});   
	}
}




/////////////////////////////////////////////////////////
/////////////////// Click Functions /////////////////////
/////////////////////////////////////////////////////////
function enableClicks()
{
	$('#contact-map-link').click(function()
	{
		var mapLocation = 'http://maps.google.com/maps/place?cid=15945095825099413669&q=warehouse+agency+10038&hl=en&sll=40.709523,-74.009046&sspn=0.006295,0.015277&ie=UTF8&ll=40.714232,-74.0203&spn=0,0&z=16';
		window.open(mapLocation, '_blank');
	});	
	$('#contact-submit').click(function()
	{
		var contactName = $('#contact-name').val();
		var contactEmail = $('#contact-email').val();
		var contactPhone = $('#contact-phone').val();
		var contactDetails = $('#contact-details').val();

		if(!nameRegExp.test(contactName) && contactName == 'Name')
		{
			$('#contact-confirmation-p').text('Please enter a valid name.');
			$('#contact-confirmation-p').slideDown(300);
		}
		else if(!emailRegExp.test(contactEmail))
		{
			$('#contact-confirmation-p').text('Please enter a valid Email Address.');
			$('#contact-confirmation-p').slideDown(300);
		}
		else if(!phoneRegExp.test(contactPhone))
		{
			if(!intPhoneRegExp.test(contactPhone))
			{
				$('#contact-confirmation-p').text('Please enter a valid Telephone Number.');
				$('#contact-confirmation-p').slideDown(300);
			}
		}
		else
		{
			$('#contact-confirmation-p').slideUp(300);
			ajaxContactMail(contactName, contactEmail, contactPhone, contactDetails);
		}
	});
}


/////////////////////////////////////////////////////////
/////////////////// Content Functions ///////////////////
/////////////////////////////////////////////////////////
function initContact()
{
	ContactBGWidth = $("#contact-bg-img").width();
	ContactBGHeight = $("#contact-bg-img").height();
	ContactBGRatio = ContactBGWidth / ContactBGHeight;
	isContact = true;
	align();			
}

function initAbout()
{
	initAboutControl();
	
	aboutLen = $('.about-slide').length;	
	$('.about-slide').css({ 'left' : viewWidth + 600, 'opacity' : 0 });
	
	clearTimeout(aboutDelay);
	
	aboutDelay = setTimeout(function()
	{
		slideAbout();	
	},1300);
	
	aboutTimer = setInterval(function()
	{ 
		aboutIndex++;
		slideAbout();		
	},20000);	
}

function slideAbout()
{
	$('#no-hit').fadeIn(20);
	
	if(aboutFocus == null)
	{		
		aboutFocus = '#about-block-' + aboutIndex;
		aboutSelectorFocus = '#about-selector-img-' + aboutIndex;
		$('.about-slide').css({ 'left' : viewWidth + 600, 'opacity' : 0 });
		$(aboutFocus).animate({ 'left' : '50%', 'opacity' : 1 }, 1000);
		$(aboutSelectorFocus).fadeIn(300);
		$('#no-hit').delay(800).fadeOut(300);
	}
	else
	{
		$('.about-selector-img').delay(300).fadeOut(200);
		$(aboutFocus).animate({ 'left' : '-500px', 'opacity' : 0 }, 500, function()
		{
			aboutFocus = '#about-block-' + aboutIndex;
			aboutSelectorFocus = '#about-selector-img-' + aboutIndex;
			$('.about-slide').css({ 'left' : viewWidth + 600, 'opacity' : 0 });
			$(aboutFocus).animate({ 'left' : '50%', 'opacity' : 1 }, 1000);
			$(aboutSelectorFocus).delay(300).fadeIn(300);
			$('#no-hit').delay(800).fadeOut(300);
		});
	}	
	
	if(aboutIndex == aboutLen + 1)
	{
		aboutIndex = 1;
	}
}


function initLeads()
{		
	$('#leads').fadeIn(200);
	$('#no-hit').delay(400).fadeOut(300);
	
	initLeadsControl();
	
	leadsLen = $('.leads-image').length;	
	$('.leads-image, .leads-info').css({ 'left' : viewWidth + 600, 'opacity' : 0 });
	align();
	
	clearTimeout(leadsDelay);
	
	leadsDelay = setTimeout(function()
	{
		slideLeads();	
	},1300);
	
	leadsTimer = setInterval(function()
	{ 
		leadsIndex++;
		slideLeads();		
	},8000);	
}

function slideLeads()
{
	$('#no-hit').fadeIn(20);
	
	if(leadsFocus == null && leadsInfoFocus == null)
	{		
		align();
		leadsFocus = '#leads-image-' + leadsIndex;
		leadsInfoFocus = '#leads-info-' + leadsIndex;
		leadsSelectorFocus = '#leads-selector-img-' + leadsIndex;
		$('.leads-image, .leads-info').css({ 'left' : viewWidth + 600, 'opacity' : 0 });
		$(leadsFocus).animate({ 'left' : '50%', 'opacity' : 1 }, 1300);
		$(leadsInfoFocus).delay(300).animate({ 'left' : '100%', 'opacity' : 1 }, 1000);
		$(leadsSelectorFocus).fadeIn(300);
		$('#no-hit').delay(1500).fadeOut(300);
	}
	else
	{
		$('.leads-selector-img').delay(300).fadeOut(200);
		$(leadsInfoFocus).delay(300).animate({ 'left' : '-500px', 'opacity' : 0 }, 800);
		$(leadsFocus).animate({ 'left' : '-500px', 'opacity' : 0 }, 1100, function()
		{
			align();
			leadsFocus = '#leads-image-' + leadsIndex;
			leadsInfoFocus = '#leads-info-' + leadsIndex;
			leadsSelectorFocus = '#leads-selector-img-' + leadsIndex;
			$('.leads-image, .leads-info').css({ 'left' : viewWidth + 600, 'opacity' : 0 });
			$(leadsFocus).animate({ 'left' : '50%', 'opacity' : 1 }, 1300);
			$(leadsInfoFocus).delay(300).animate({ 'left' : '100%', 'opacity' : 1 }, 1000);
			$(leadsSelectorFocus).delay(300).fadeIn(300);
			$('#no-hit').delay(1500).fadeOut(300);
		});
	}	
	
	if(leadsIndex == leadsLen)
	{
		leadsIndex = 0;
	}
}

function initLeadsControl()
{
	var leadIndex = 0;
	
	$('.leads-image').each(function()
	{
		leadIndex = $('.leads-image').index(this);
		$('#leads-controller').prepend('<div class="leads-selector" id="leads-selector-' + leadIndex + '"><img src="images/global/selector-active.png" alt="&bull;" class="leads-selector-img" id="leads-selector-img-' + leadIndex + '" /></div>');
	});
	
	align();
	
	$('.leads-selector').click(function()
	{
		leadsIndex = $(this).attr('id');
		leadsIndex = leadsIndex.replace(/\D/g, '');	
		
		clearTimeout(leadsTimer);
		slideLeads();		
	});
	
	$('.leads-selector').hover(function()
	{
		var pos = $(this).offset().left;
		var tPos = pos - 50;
		var id = $(this).attr('id');
		id = id.replace(/\D/g, '');
		$('#talk-box-p').text($('#leads-info-' + id + ' .leads-name').text());
		
		
		$('#talk-box-triangle').css({ 'left' : pos });
		$('#talk-box').css({ 'left' : tPos });
		$('#talk-box, #talk-box-triangle').stop(true, true).fadeIn(200);
	},
	function()
	{
		$('#talk-box, #talk-box-triangle').stop(true, true).fadeOut(200);
	});
}



function initAboutControl()
{
	var aIndex = 1;
	
	$('#about-controller').html('');
	
	$('.about-slide').each(function()
	{
		aIndex = $('.about-slide').index(this) + 1;
		$('#about-controller').prepend('<div class="about-selector" id="about-selector-' + aIndex + '"><img src="images/global/selector-active.png" alt="&bull;" class="about-selector-img" id="about-selector-img-' + aIndex + '" /></div>');
	});
	
	$('.about-selector').click(function()
	{
		aboutIndex = $(this).attr('id');
		aboutIndex = aboutIndex.replace(/\D/g, '');	
		
		clearTimeout(aboutTimer);
		slideAbout();		
	});
}

function ajaxContactMail(contactName, contactEmail, contactPhone, contactDetails)
{
	$.post('ajax/contact.php', {contact_name : contactName, contact_email : contactEmail, contact_phone : contactPhone, contact_details : contactDetails}, function(data)
	{
		$('#contact-confirmation-p').text(data);
		$('#contact-confirmation-p').slideDown(300);
	});
}