/**
* Written by Declan Newman for risejoinery.co.uk 2009-09-20
*/

var mainImages;
var index = 0;

function initHome() {
	mainImages = new Array();
	for (i=0;i<4;i++) {
		var div = document.createElement('div');
		div.id = 'image-' + i;
		div.style.position = 'absolute';
		div.style.top = '0px';
		div.style.left = '0px';
		div.style.zIndex = '0';
		div.style.opacity = '0';
		
		var img = document.createElement('img');
		img.src = '../images/home-main-' + (i+1) + '.jpg';
		
		img.id = 'image-' + i;
		
		div.appendChild(img);
		$('right-col').appendChild(div);
		
		var mainImage = new Image();
		mainImage.src = '../images/home-main-' + (i+1) + '.jpg';
		mainImages[i] = mainImage;
	}
	
	fadeInMainImage(index);
	
}

function fadeInMainImage(localIndex) {
	index = localIndex;
	
	if (index == 4) {
		index = 0;
	}
	
	next = index + 1;
	
	if (next == 4) {
		next = 0;
	}
	
	new Effect.Parallel(
         [
         new Effect.Opacity('image-' + index, { from: 1, to: 0, duration: 1.45 }),
         new Effect.Opacity('image-' + next, { from: 0, to: 1, duration: 1.45 })
         ],
         {duration: 2.2}
     );
     index++;
	setTimeout("fadeInMainImage(index)", 5000);
}


function initAbout() {
	var loader = new Image();
	loader.src = "../images/ajax-loader.gif";
	var thumbs = $$('div.thumb-image');
	
	new Effect.Opacity('top-image', { from: 0, to: 1, duration: 0.5 });
	for (i=0;i<thumbs.length;i++) {
		thumbs[i].observe('click', handleThumbClick);
	}
}

function handleThumbClick(event) {
	var topImage = $('top-image');
	topImage.style.background = "url('../images/ajax-loader.gif') no-repeat center center";
	removeActiveClass();
	var element = event.element();
	element.addClassName('active');
	var imageClass = element.className.split(' ')[1];
	
	var imageName = imageClass.substring(0, (imageClass.indexOf('-')+1)) + imageClass[imageClass.length-1] + '-large.jpg';
	
	var im = new Image();
	
	im.src = '../images/' + imageName;
	
	im.onload = function() {
		topImage.title = element.childElements()[0].textContent;
	
		topImage.style.background = "url('../images/" + imageName + "') no-repeat center center";
		new Effect.Opacity(topImage, { from: 0, to: 1.0, duration: 0.5 });
	}
	
}

function removeActiveClass() {

	var thumbs = $$('div.active');
	
	for (i=0;i<thumbs.length;i++) {
		thumbs[i].removeClassName('active');
	}	
}