$(document).ready(function() { /* all initialisation functions are called on all pages, so they must first check for their relevant contact, and only continue if it is found */
 initRolloverFade();
	initLatestStuff();
	initScroller();
	//initFilter(); // not used yet
	initGallery();
	initContactForm();
});



function initRolloverFade() {
	navDiv = $(".nav"); // set up nav links
	if (navDiv.length > 0) {
		currentNav = undefined; // find out what navigation section this page is in.  this is set in the html by assigning a second style class to the nav div eg. <div class="nav home-on">
		currentSubnav = undefined; // find out what subnav section this page is in (if any).  this is set in the html by assigning a second style class to the subnav div eg. <div class="subnav find-us-on">
	 if (navDiv.hasClass("home-on")) {currentNav = "home";}
	 if (navDiv.hasClass("our-work-on")) {currentNav = "our-work";}
	 if (navDiv.hasClass("talk-to-us-on")) {currentNav = "talk-to-us";}
	 if (navDiv.hasClass("work-with-us-on")) {currentNav = "work-with-us";}
	 if (navDiv.hasClass("in-the-know-on")) {currentNav = "in-the-know";}
	 if (currentNav != undefined) {
	  currentNavDiv = $(".nav-" + currentNav);
	  currentNavDiv.addClass("nav-bg");
	  currentNavPaddingDiv = $(".nav-" + currentNav + " .padding");
   subnavDiv = $(".nav-" + currentNav + " .subnav"); // if this section has subnav link(s), they push the main link out of place, so compensate
   currentNavPaddingDiv.addClass("padding-on" + ((subnavDiv.length > 0) ? "-subnav" : ""));
   if (subnavDiv.length > 0) {
    subnavDiv.addClass("subnav-on");
	   if (subnavDiv.hasClass("find-us-on")) {currentSubnav = "find-us";}
	   if (subnavDiv.hasClass("news-on")) {currentSubnav = "news";}
	   if (subnavDiv.hasClass("white-papers-on")) {currentSubnav = "white-papers";}
   }
   currentNavImg = $(".nav-" + currentNav + " .padding img.rollover-fade");
	  currentNavImgSrc = currentNavImg.attr("src");
	  currentNavImg.attr("src", getImageFilename(currentNavImgSrc, "on"));
	 }
	}

 rolloverFadeDivs = $("div.rollover-fade"); // set up all rollover fade anims including the nav links above
 rolloverFadeImgs = $("img.rollover-fade");
	for (linkIndex=0; linkIndex<rolloverFadeDivs.length; linkIndex++) {
	 rolloverFadeDiv = rolloverFadeDivs.eq(linkIndex);
		rolloverFadeImg = rolloverFadeImgs.eq(linkIndex);
		rolloverFadeImgSrc = rolloverFadeImg.attr("src");
		navStatus = (rolloverFadeImgSrc.indexOf("-on") > -1) ? "on" : "off";
	 rolloverFadeDiv.css("background-image", "url('" + rolloverFadeImgSrc + "')");
	 rolloverFadeDiv.css("background-repeat", "no-repeat");
	 rolloverFadeDiv.css("width", String(Number(rolloverFadeImg.attr("width")) + 1) + "px"); // include 1 pixel spacer gif needed for ie6 rendering
	 rolloverFadeDiv.css("height", String(rolloverFadeImg.attr("height")) + "px");
	 rolloverFadeImg.attr("id", "rollover-fade-" + String(linkIndex));
	 rolloverFadeImg.attr("src", getImageFilename(rolloverFadeImgSrc, "over"));
	 rolloverFadeImg.css("opacity", "0");
 	rolloverFadeImg.bind("mouseenter", function() {updateRollover(this.id, "over", "fade");});
  rolloverFadeImg.bind("mouseleave", function() {updateRollover(this.id, "up", "fade");});
 }
 rolloverSwapImgs = $("img.rollover-swap"); // some less important rollovers (eg. subnav) work as swap, rather than fade, to avoid nested div floats in ie6
	for (linkIndex=0; linkIndex<rolloverSwapImgs.length; linkIndex++) {
		rolloverSwapImg = rolloverSwapImgs.eq(linkIndex);
	 rolloverSwapImg.attr("id", "rollover-swap-" + String(linkIndex));
		rolloverEnabled = true; // rollover enabled by default...
		if (currentSubnav != undefined) {
			rolloverSwapImgSrc = rolloverSwapImg.attr("src");
			if (rolloverSwapImgSrc.indexOf(currentSubnav) > -1) {
    rolloverSwapImg.attr("src", getImageFilename(rolloverSwapImgSrc, "on"));
				rolloverEnabled = false; // ...but disabled for current subnav
			}
		}
		if (rolloverEnabled) {
   rolloverSwapImg.bind("mouseenter", function() {updateRollover(this.id, "over", "swap");});
   rolloverSwapImg.bind("mouseleave", function() {updateRollover(this.id, "up", "swap");});
	 }
	}
}

function updateRollover(rolloverImgID, rolloverStatus, animMode) { // for all rollover anims
	switch (animMode) {
		case "fade": // including anims that fade & move
   rolloverImg = $("#" + rolloverImgID);
   rolloverImg.stop(); // stop old fade anim
   rolloverImg.animate({opacity: Number(rolloverStatus == "over")}, 450);
   rolloverPaddingDiv = rolloverImg.parent().parent().parent(); // if this is a nav link that isn't "on", do the movement anim
   if (rolloverPaddingDiv.length > 0) {
    if (rolloverPaddingDiv.hasClass("padding")) {
	   	rolloverPaddingDiv.stop(); // stop old movement anim
     if ((! rolloverPaddingDiv.hasClass("padding-on")) && (! rolloverPaddingDiv.hasClass("padding-on-subnav"))) {
      rolloverPaddingDiv.animate({top: (-28 * Number(rolloverStatus == "over")) }, 450);
     }
    }
   }
			break;
		case "swap": // ye olde image-swap rollovers for stuff with css browser compatibility issues
   rolloverImg = $("#" + rolloverImgID);
		 rolloverImgSrc = rolloverImg.attr("src");
	  rolloverImg.attr("src", getImageFilename(rolloverImgSrc, rolloverStatus));
			break;
	}
}

function getImageFilename(filename, rolloverStatus) { // a link can have separate images for the following 3 states: "up", "over" for rollover and the optional "on" for the current nav section.  "-over" or "-on" must appear in image filenames for those states
 if (rolloverStatus == undefined) {rolloverStatus = "up";}
 statusSubstring = "-" + rolloverStatus;
 overIndex = filename.indexOf("-over"); // strip any old statusSubstring from filename first
 if (overIndex > -1) {filename = filename.substring(0, overIndex) + filename.substring(overIndex + 5);}
	onIndex = filename.indexOf("-on");
 if (onIndex > -1) {filename = filename.substring(0, onIndex) + filename.substring(onIndex + 3);}
	gifIndex = filename.indexOf(".gif");
	jpgIndex = filename.indexOf(".jpg");
	pngIndex = filename.indexOf(".png");
	if (gifIndex > -1) {
  filename = filename.substring(0, gifIndex);
		if (statusSubstring != "-up") {filename += statusSubstring;}
		filename += ".gif";
	} else if (jpgIndex > -1) {
  filename = filename.substring(0, jpgIndex);
		if (statusSubstring != "-up") {filename += statusSubstring;}
		filename += ".jpg";
	} else if (pngIndex > -1) {
  filename = filename.substring(0, pngIndex);
		if (statusSubstring != "-up") {filename += statusSubstring;}
		filename += ".png";
	}
	return filename;
}



function initLatestStuff() { // draggable Latest Stuff banner - homepage only
	latestStuff = $("#latest-stuff");
	if (latestStuff.length > 0) { /* only proceed if this is the homepage */
		windowWidth = $(window).width(); // auto-position according to browser window width while still hidden...
  latestStuff.css("left", (windowWidth * 0.5) + 188 + "px");
 	latestStuff.easydrag();
 	$(".latest-stuff-off").css("display", "block"); // ...then make visible, to avoid jump glitch in ie6
		$(".latest-stuff-more").bind("click", function() {updateLatestStuff(true); return false;});
		$(".latest-stuff-less").bind("click", function() {updateLatestStuff(false); return false;});
	}
}

function updateLatestStuff(more) { // switch between 'less' & 'more' versions of Latest Stuff
	$(".latest-stuff-off").css("display", more ? "none" : "block");
	$(".latest-stuff-on").css("display", more ? "block" : "none");
	if (more) { // when showing 'more', move it up if necessary, to fit the whole thing in browser window
	 latestStuff = $("#latest-stuff");
	 latestStuffTop = latestStuff.css("top");
	 latestStuffTop = Number(latestStuffTop.substring(0, latestStuffTop.indexOf("px")));
	 latestStuffHeight = latestStuff.height();
  windowHeight = $(window).height();
	 if (latestStuffTop + latestStuffHeight > windowHeight) {latestStuff.css("top", (windowHeight - latestStuffHeight) + "px");}
	}
}



var scrollHolderWidth = 0;
var scrollItemWidth = 0;
var scrollerPages;
var currentScrollerPage;

function initScroller() { // scrolling thumbnails - Our Work page etc.
	scrollItems = $(".scroll-items");
	if (scrollItems.length > 0) { // only proceed if this is a relevant page
	 if ($(".scroll-item-3x2").length > 0) {
			scrollHolderWidth = 813; // (270 + 1) * 3
			scrollItemWidth = 271; // 270 + 1
		} else if ($(".scroll-item-2x2").length > 0) {
	  scrollHolderWidth = 812; // (405 + 1) * 2
			scrollItemWidth = 406; // 405 + 1
		} else if ($(".scroll-item-2x3").length > 0) {
	  scrollHolderWidth = 812; // (405 + 1) * 2
			scrollItemWidth = 406; // 405 + 1
		}
  scrollerPage = $(".scroll-items .scroll-items-page");
	 scrollerPage.css("width", scrollHolderWidth + "px");
  scrollerPages = $(".scroll-items .scroll-items-page").length;
		currentScrollerPage = 0;
	 $(".scroll-items-holder").css("width", scrollHolderWidth + "px");
	 scrollItems.css("width", (scrollerPages * scrollHolderWidth) + "px"); // force scrollable content into horizontal format
  pagesDiv = $(".pages");
		htmlBuffer = "";
		for (pageIndex=0; pageIndex<scrollerPages; pageIndex++) {
			htmlBuffer += "<a href=\"#\" onclick=\"updateScroller('absolute', " + pageIndex + "); return false;\">" + (pageIndex + 1) + "</a>&nbsp;&nbsp;&nbsp;";
		}
		pagesDiv.html(htmlBuffer);
		$(".pages a").eq(currentScrollerPage).addClass("page-on");
			updateScrollerButton("left", false);
		if (scrollerPages > 1) {
   $(".scroll-left a").bind("click", function() {updateScroller("relative", -1); return false;});
		 $(".scroll-right a").bind("click", function() {updateScroller("relative", 1); return false;});
 	} else { // hide scroller interface if only one page
			pagesDiv.css("display", "none");
			updateScrollerButton("right", false);
	 }
	}
}

function updateScroller(mode, scrollAmount) { // scroll the portfolio
	scrollItems = $(".scroll-items");
	switch (mode) {
  case "absolute":
   targetScrollerPage = scrollAmount;
   break;
  case "relative":
   targetScrollerPage = currentScrollerPage + scrollAmount;
   break;
	}
	if (targetScrollerPage < 0) {targetScrollerPage = 0;}
	if (targetScrollerPage >= scrollerPages) {targetScrollerPage = scrollerPages - 1;}
	if (targetScrollerPage != currentScrollerPage) {
		currentPosition = scrollItems.css("left");
 	currentPosition = Number(currentPosition.substring(0, currentPosition.indexOf("px")));
 	targetPosition = - (targetScrollerPage * scrollHolderWidth);
 	animDuration = (Math.abs(targetPosition - currentPosition)) * (750 / scrollHolderWidth); // 750ms per page
  pagesDiv = $(".pages");
		$(".pages a").removeClass("page-on");
		$(".pages a").eq(targetScrollerPage).addClass("page-on");
		updateScrollerButton("left", targetScrollerPage > 0);
		updateScrollerButton("right", targetScrollerPage < scrollerPages - 1);
  scrollItems.stop();
  scrollItems.animate({left: (targetPosition + "px")}, animDuration);
	 currentScrollerPage = targetScrollerPage;
	}
}

function updateScrollerButton(direction, visible) { // show/hide the left/right scroller buttons
 if ((direction == "left") || (direction == "right")) {
  if (visible) {
	  $(".scroll-" + direction + " div.rollover-fade").css("background-image", "url('assets/images/scroll-" + direction + ".gif')");
	  $(".scroll-" + direction + " a").css("display", "block");
	 } else {
	  $(".scroll-" + direction + " div.rollover-fade").css("background-image", "none"); // set background image to one you can't see; keep the div displayed at all times so that its size keeps the floated content in the right place
	  $(".scroll-" + direction + " a").css("display", "none"); // hide the link, while preserving its mouse events for when it is shown again later
	 }
 }
}



function initFilter() { // filter - Our Work page only
	filterx = $("div#filter");
	if (filterx.length > 0) { /* only proceed if this is the Our Work page */
		windowWidth = $(window).width(); // auto-position according to browser window width while still hidden...
        filterx.css("left", (windowWidth * 0.5) + 188 + "px");
 	    filterx.easydrag();
 	    filterx.css("display", "block"); // ...then make visible, to avoid jump glitch in ie6
		$(".close a").bind("click", function() {updateFilter(false); return false;});
	}
}

function updateFilter(show) { // show/hide filter
	filterx = $("div#filter");
	filterx.css("display", show ? "block" : "none");
}



var galleryImages;
var currentGalleryImage;
function	initGallery() {
	galleryImages = [];
	currentGalleryImage = 0;
 galleryLinks = $(".gallery-thumbs a");
	if (galleryLinks.length > 0) { // only proceed if this is a relevant page
	 galleryTitles = $(".gallery-titles .title");
	 galleryTitles.eq(0).css("display", "block");
	 for (linkIndex=0; linkIndex<galleryLinks.length; linkIndex++) {
	  galleryLink = galleryLinks.eq(linkIndex);
	 	galleryImages.push(galleryLink.attr("href"));
   galleryLink.attr("id", "gallery-link-" + linkIndex);
   galleryLink.attr("href", "#");
	  galleryLink.bind("click", function() {updateGallery(this.id); return false;});
	 }
	}
}

function updateGallery(photoID) {
	currentGalleryImage = Number(photoID.substring(13));
	photoURL = galleryImages[currentGalleryImage];
	//alert(photoURL);
	$("img.gallery-image").attr("src", photoURL);
	galleryTitles = $(".gallery-titles .title");
	galleryTitles.css("display", "none");
	galleryTitles.eq(currentGalleryImage).css("display", "block");
}



function initContactForm() {
 textArea = $("#txtEnquiry");
	if (textArea.length > 0) {
 	textArea.bind("focus", function() {if (textArea.html() == "What you'd like to know...") {textArea.html("");}});
	}
}
