$(document).ready(function() {
 initClouds();
	//initScroller(); // moved to onload so Mac Safari gets it
});



var clouds = ["clouds-gardens.jpg", "clouds-driveways.jpg", "clouds-much-more.jpg"];
var cloudIndex = -1; // initialises to zero on first updateClouds()

function initClouds() {
	jQuery.each(jQuery.browser, function(i, val) {
  if(i=="safari") {
   if(val==true) {
		 	leftColumn = $(".intro-left-column");
		 	rightColumn = $(".intro-right-column");
				htmlBuffer = leftColumn.html();
		 	leftColumn.html(htmlBuffer + "inspire our town and city");
		 	leftColumn.css("height", "120px");
				htmlBuffer = rightColumn.html();
		 	rightColumn.html(htmlBuffer.substring(26,127) + "<br >" + htmlBuffer.substring(127));
		 	rightColumn.css("height", "120px");
	 	}
		}
 });
	setInterval("updateClouds();", 8000);
}

function updateClouds() {
	var cloudBG = $(".cloud-banner .cloud-bg");
	var cloudFG = $(".cloud-banner .cloud-fg");
	cloudIndex++;
	if (cloudIndex >= clouds.length) {cloudIndex = 0;} 
	nextCloudIndex = cloudIndex + 1;
	if (nextCloudIndex >= clouds.length) {nextCloudIndex = 0;} 
	cloudFG.attr("src", "images/" + clouds[cloudIndex]);
	cloudFG.css("opacity", "1");
	cloudBG.css("background-image", "url('images/" + clouds[nextCloudIndex] + "')");
	cloudFG.animate({opacity: 0}, 2000);
}



var scrollHolderWidth = 0;
var scrollItemWidth = 0;
var scrollerPages;
var currentScrollerPage;

function initScroller() { // scrolling thumbnails - gallery
	scrollItems = $(".scroll-items");
	if (scrollItems.length > 0) { // only proceed if this is a relevant page
  scrollHolderWidth = 672;
		scrollItemWidth = 96;
  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
  $(".scroll-left a").bind("click", function() {updateScroller("relative", -1); return false;});
		$(".scroll-right a").bind("click", function() {updateScroller("relative", 1); return false;});

  galleryLinks = $(".scroll-item a");
 	for (linkIndex=0; linkIndex<galleryLinks.length; linkIndex++) {
		 galleryLink = galleryLinks.eq(linkIndex);
   galleryLink.attr("id", "gallery-link-" + padNumber(linkIndex + 1, 2));
 	 galleryLink.bind("click", function() {updateGallery(this.id); return 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)) * (1100 / scrollHolderWidth); // 1100ms per page
  scrollItems.stop();
  scrollItems.animate({left: (targetPosition + "px")}, animDuration);
	 currentScrollerPage = targetScrollerPage;
	}
}

function updateGallery(photoID) {
	photoURL = "images/gallery-photo-" + photoID.substring(13) + ".jpg";
	//alert(photoURL);
	$("img.photo").attr("src", photoURL);
}

function padNumber(theNumber, theLength) { // converts number to string with leading zeros
	numberBuffer = String(theNumber);
	while (numberBuffer.length < theLength) {
		numberBuffer = "0" + numberBuffer;
	}
	return numberBuffer;
}
