//on load function
var images;
var originalDimensions
var minHomePageBoxHeight = minScrollBoxHeight = 400;
$(function()
{
    images 				= $('#slider-image img');
	originalDimensions 	= new Array(images.length);
	getInitialImageDimensions();

	//contact form
    $('#Form_ContactForm').submit(function() {
	  return validateForm();
	});
	if ($('#Form_ContactForm').length > 0)
  		populateFormValues();
    
	resizeHomePageBox();
	resizeScrollBox();
	$('#menu').height($(window).height() - 135);
	$(window).resize(function() {
		resizeMainDiv();
		resizeScrollBox();
		$('#menu').height($(window).height() - 135);
	});

	if ($('#slider-image img.project_image').length > 0) //only when there's project images - otherwise use css
	{
        resizeMainDiv();
		resizeImages(); //uses onload event of images
		$(window).resize(function() {
		    
		    window.setTimeout(resizeImagesOnResize, 400); //set a delay to ensure main div has finished resizing
		});
	}

	//contact page style fix
    if ($.browser.safari) {
        if ($('#Form_ContactForm_Comments').length > 0)
            $('#Form_ContactForm_Comments').css({'width':'564px'});
 	}

	if ($('#prevslide-small-project-info').length > 0)
	{
		//total images set in navigation.ss
	    var maxImages 		= 6;
		var scrollIncrement = 82;
		var scrollAmount 	= 0;

		if (totalImages > (maxImages * 2))
		    scrollAmount = maxImages * scrollIncrement;
		else
		    scrollAmount = (totalImages - maxImages) * scrollIncrement;

		$('#prevslide-small-project-info').click(function() {
			$('#thumbs_project_info').scrollTo('-=' + scrollAmount + 'px', { duration: 300 })
		});

		$('#nextslide-small-project-info').click(function() {
			$('#thumbs_project_info').scrollTo('+=' + scrollAmount + 'px', { duration: 300 })
		});
	}

	if ($('#news-press-nav-ul').length > 0 && $('#left-column-text').length < 1)
	{
	    var maxImages 			= 6;
		var scrollIncrementNews = 82;
		var scrollAmountNews 	= 0;

	    if (totalItems > maxImages)
	    {

			if (totalItems > (maxImages * 2))
			    scrollAmountNews = maxImages * scrollIncrementNews;
			else
			    scrollAmountNews = (totalItems - maxImages) * scrollIncrementNews;


			$('#prevslide-small-news-press').click(function() {
				$('#news-press-nav-ul').scrollTo('-=' + scrollAmountNews + 'px', { duration: 300 })
			});

			$('#nextslide-small-news-press').click(function() {
				$('#news-press-nav-ul').scrollTo('+=' + scrollAmountNews + 'px', { duration: 300 })
			});

			var currentNavItem 	= $('#menu_sub li.current')[0];
			var currentNavPos 	= parseInt((currentNavItem.className.replace('current pos_','')));
			if (currentNavPos > maxImages)
			    $('#news-press-nav-ul').scrollTo('+=' + scrollAmountNews + 'px', { duration: 300 })

			//if (currentNavItem.className.replace('current
			
			
		}
		else //hide nav if not needed
		{
	        $('#news-press-prev-next-nav').css({'display':'none'});
		}

		
	}
	else //hide nav if not needed
	{
        $('#news-press-prev-next-nav').css({'display':'none'});
	}


	homePageBoxIsHidden = false;
	$('#hide_show').click(function() {
		if (!homePageBoxIsHidden) {
		  $('#homepage_box').animate({
			    height: '20px'
			  }, 1000, function() {
		  });
		  homePageBoxIsHidden = true;
		}
		else {
		  $('#homepage_box').animate({
			    height: minHomePageBoxHeight + 'px'
			  }, 1000, function() {
		  });
		  homePageBoxIsHidden = false;
		}
	});

	if ($('.scroll-pane').length > 0) //has a scroll pane on the page
	{
	    $('.scroll-pane').jScrollPane({scrollbarWidth:8,scrollbarMargin:10});
	}

});



function resizeHomePageBox() {
	if ($('#homepage_box').length > 0)
	{
	    var homePageBoxHeight = $(window).height() - minHomePageBoxHeight;
	    if (homePageBoxHeight < minHomePageBoxHeight)
   			$('#homepage_box').height(minHomePageBoxHeight);
		else
		    $('#homepage_box').height(homePageBoxHeight);
	}
}
function resizeScrollBox() {
	if ($('#scroll_content').length > 0)
	{
	    var scrollBoxHeight = $(window).height() - (minScrollBoxHeight-200);
	    if (scrollBoxHeight < minScrollBoxHeight)
   			$('#scroll_content').height(minScrollBoxHeight);
		else
		    $('#scroll_content').height(scrollBoxHeight);

	}
}

function reinitialiseScrollPane()
{
	$('.scroll-pane').jScrollPane({scrollbarWidth:8,scrollbarMargin:10});
}



function resizeMainDiv() {
    if ($('#slider-image img.project_image').length > 0) //only when there's project images - otherwise use css
	    $('#main').width($(window).width() - 305); //305 being the width of the side menu
	else if ($(window).width() - 305 > 635)
	    $('#main').width(635);
	else
	    $('#main').width($(window).width() - 305); //305 being the width of the side menu

}



function resizeImages() {

    var images 		= $('#slider-image img');
	var mainHeight 	= $('#main').height();
	var mainWidth 	= $('#main').width();

	for (var i = 0; i < images.length; i++)
	{
		//use onload property of images as chrome/safari don't know the image's dimensions until they have been fully loaded
		//which can happen after js is processed
		$(images[i]).load(function() {

			if (this.height > this.width) //taller
		    {
		        var origWidth           = this.width;
		    	var newHeightratio   	= mainHeight/this.height;

 				var newWidth            = this.width * newHeightratio;


				if (newWidth > mainWidth)
				{
				    this.width              = mainWidth;
                    var newWidthratio   	= this.height/origWidth;
					var newHeight           = this.height * newWidthratio;
					this.height				= newHeight;
				}
				else
    			{
				    this.height 			= mainHeight;
		            this.width				= newWidth;
				}
			}
			else if (this.width > this.height) //wider but not wider than screen
			{
				var origHeight 			= this.height;
			    var newWidthratio   	= mainWidth/this.width;

				var newHeight 			= this.height * newWidthratio;


				if (newHeight > mainHeight) //too big, resize width to keep in ratio
				{
                    this.height 			= mainHeight;
                    var newHeightratio   	= this.height/origHeight;
					var newWidth            = this.width * newHeightratio;
					this.width				= newWidth;
				}
				else
				{
				    this.width 				= mainWidth;
        this.height 			= newHeight;
				}

			}
			else if (this.width == this.height )
			{
			    this.width 		= mainWidth;
			    this.height 	= this.width;
			}

		});
		var src = images[i].src;
		images[i].src = "";
		images[i].src = src;
	}
}

function getInitialImageDimensions() {


	for (var j = 0; j < originalDimensions.length; j++)
	{
	    originalDimensions[j] = new Array(2);
	}
	for (var k = 0; k < images.length; k++)
	{
	    originalDimensions[k][0] = images[k].width;
	    originalDimensions[k][1] = images[k].height;
	}

	return originalDimensions;
}

function resizeImagesOnResize() {

    var images 		= $('#slider-image img');
	var mainHeight 	= $('#main').height();
	var mainWidth 	= $('#main').width();

	for (var i = 0; i < images.length; i++)
 	{
		if (originalDimensions[i][1] > originalDimensions[i][0]) //taller
	    {
   			if (mainHeight > mainWidth)
			{
			    var newWidthratio   	= originalDimensions[i][1]/originalDimensions[i][0];

				var newHeight 			= mainWidth * newWidthratio;
			    images[i].height 		= newHeight;

			    if (newHeight > mainHeight) //too big, resize width to keep in ratio
				{
                    images[i].height 		= mainHeight;
                    var newHeightratio   	= originalDimensions[i][0]/originalDimensions[i][1];
					var newWidth            = images[i].height * newHeightratio;
					images[i].width			= newWidth;
				}
				else
				    images[i].width 		= mainWidth;
			}
			else
		    {
		    	var newHeightratio   	= originalDimensions[i][0]/originalDimensions[i][1];

				var newWidth            = mainHeight * newHeightratio;
				images[i].width			= newWidth;

				if (newWidth > mainWidth) //too big, resize width to keep in ratio
				{
                    images[i].width 		= mainWidth;
                    var newHeightratio   	= originalDimensions[i][1]/originalDimensions[i][0];
					var newHeight           = images[i].width * newHeightratio;
					images[i].height		= newHeight;
				}
				else
				    images[i].height 		= mainHeight;
		    }

		}
		else if (originalDimensions[i][0] > originalDimensions[i][1]) //wider
		{
			if (mainHeight > mainWidth)
			{
		        var newHeightratio   	= originalDimensions[i][0]/originalDimensions[i][1];
			    var newWidth            = mainHeight * newHeightratio;
				images[i].width			= newWidth;

				if (newWidth > mainWidth) //too big, resize width to keep in ratio
				{
                    images[i].width 		= mainWidth;
                    var newHeightratio   	= originalDimensions[i][1]/originalDimensions[i][0];
					var newWidth            = images[i].width * newHeightratio;
					images[i].height		= newWidth;
				}
				else
				    images[i].height 		= mainHeight;
			}
		    else
		    {
		    	var newWidthratio   	= originalDimensions[i][1]/originalDimensions[i][0];
				var newHeight 			= mainWidth * newWidthratio;
			    images[i].height 		= newHeight;

			    if (newHeight > mainHeight) //too big, resize width to keep in ratio
				{
                    images[i].height 		= mainHeight;
                    var newHeightratio   	= originalDimensions[i][0]/originalDimensions[i][1];
					var newWidth            = images[i].height * newHeightratio;
					images[i].width			= newWidth;
				}
				else
				    images[i].width 		= mainWidth;
		    }

		}
		else if (images[i].width == images[i].height)
		{
		    images[i].width 	= mainWidth;
		    images[i].height 	= images[i].width;
		}



	}
}


function populateFormValues() {
	var asterix 	= ' *';
	var emptyString = "";
	$('#Form_ContactForm input.text').each(function (i) {
        this.value = this.name;
        if (this.id == 'Form_ContactForm_Name' || this.id == 'Form_ContactForm_Phone' || this.id == 'Form_ContactForm_Email')
            this.value += asterix;
        
		this.onblur = function() {
		    if ((this.id == 'Form_ContactForm_Name' || this.id == 'Form_ContactForm_Phone' || this.id == 'Form_ContactForm_Email') && this.value == emptyString)
				this.value = this.name + asterix;
		    else if (this.value == emptyString)
		        this.value = this.name;
		}
		this.onfocus = function() {
		    if (this.value == this.name)
		        this.value = emptyString;
            else if ((this.id == 'Form_ContactForm_Name' || this.id == 'Form_ContactForm_Phone' || this.id == 'Form_ContactForm_Email') && this.value == this.name + asterix)
				this.value = emptyString;
		}
    });
	var commentsField = document.getElementById('Form_ContactForm_Comments');
	commentsField.value = "Comments";
	commentsField.onblur = function() {
    	if (this.value == emptyString)
	        this.value = this.name;
	}
	commentsField.onfocus = function() {
	    if (this.value == this.name)
	        this.value = emptyString;
	}
}


function validateForm() {
    var asterix 	= ' *';
	var errorMsg 	= "The following fields are required:";
	var nameEl 		= document.getElementById("Form_ContactForm_Name");
	var phoneEl 	= document.getElementById("Form_ContactForm_Phone");
	var emailEl 	= document.getElementById("Form_ContactForm_Email");
	
	if (nameEl.value == "" || nameEl.value == nameEl.name + asterix)
	    errorMsg += "\n * Name";
 	if (phoneEl.value == "" || phoneEl.value == phoneEl.name + asterix)
	    errorMsg += "\n * Phone";
	if (emailEl.value == "" || emailEl.value == emailEl.name + asterix)
	    errorMsg += "\n * Email";
	    
	if (errorMsg != "The following fields are required:")
	{
		alert(errorMsg);
	    return false;
	}
	return true;
}