// JavaScript Document
function case_init(parentDiv, imageHeight, imageWidth){
	
	galleryImages = new Array();
	galleryTitles = new Array();
	galleryHeads = new Array();
	if(document.getElementById(parentDiv)){
	galleryImagesPrep = document.getElementById(parentDiv).getElementsByTagName('a');
	for (var i=0; i<galleryImagesPrep.length; i++){
		if(galleryImagesPrep[i].className=='galleryImage'){
			
			galleryImages.push(galleryImagesPrep[i].getElementsByTagName('img')[0].src);
			galleryTitles.push(galleryImagesPrep[i].getAttribute("title"));
			galleryHeads.push(galleryImagesPrep[i].getAttribute("heading"));
		}
	}
	g_imageHeight = imageHeight;
	g_imageWidth = imageWidth;
	divId = parentDiv;
	new case_Gallery();
	}
}
var case_Gallery = Class.create();
case_Gallery.prototype = {
	initialize: function (){
		this.imageHeight = g_imageHeight;
		this.imageWidth = g_imageWidth;
		this.parentDiv = divId;
		this.currentImage = 0;
		this.imageArray = new Array();
		this.titlesArray = new Array();
		this.titlesArray = galleryTitles;
		this.imageArray = galleryImages;
		this.headsArray = galleryHeads;
		
		
		
		
		this.upperLimit = this.imageArray.length-1;
		$(this.parentDiv).appendChild(
			Builder.node('div', {id:this.parentDiv+'cases_'},[
				Builder.node('div', {id:this.parentDiv+'cases_head'}),
				Builder.node('div', {id:this.parentDiv+'cases_body'},[
					Builder.node('ul', {id:this.parentDiv+'cases_list'}),
					
					Builder.node('img', {id:this.parentDiv+'cases_loading', src:'images/loading.gif'}),
						Builder.node('h3', {id:this.parentDiv+'cases_heading'}),
					
					Builder.node('a', {id:this.parentDiv+'cases_link', href:'#', rel:'caseStudy['+this.parentDiv+']'},[
				Builder.node('img', {id:this.parentDiv+'cases_img'}),
					Builder.node('div', {id:this.parentDiv+'cases_text'})
					]),
				])
			])
		);
		$(this.parentDiv+'cases_heading').style.margin = "5px 0px 3px 0px";
	$(this.parentDiv).style.textAlign="center";
	$(this.parentDiv+'cases_loading').hide();
	$(this.parentDiv+'cases_').show();
	$(this.parentDiv+'cases_img').setStyle({height: this.imageHeight+'px', width: this.imageWidth+'px'});	
	$(this.parentDiv+'cases_img').hide();
	//$('cases_link').getAttribute('rel') = 'caseStudy[cases]';
	this.changeImages(0);
	this.preL();
	},
	changeImages: function(changeNum){
		
		$(this.parentDiv+'cases_loading').show();

		this.nextCase = changeNum;
		
		var backgroundImage = this.imageArray[this.nextCase];
		var imgPreloader = new Image();
		if (this.headsArray.length>1){
        var popList = "";
        // once image is preloaded, resize image container
		for(var x=0;x<this.headsArray.length;x++){
			popList += '<li'
			
			popList += '><a href="#" id="'+this.parentDiv+'case_change_'+x+'">'+this.headsArray[x]+'</a></li>';
			
		}
		$(this.parentDiv+'cases_list').show();
		
		$(this.parentDiv+'cases_list').innerHTML = popList;
		if($(this.parentDiv+'case_change_0')){
			$(this.parentDiv+'case_change_0').observe('click', (function(event) { event.stop(); this.changeImages(0); }).bindAsEventListener(this));
		}
		if($(this.parentDiv+'case_change_1')){
			$(this.parentDiv+'case_change_1').observe('click', (function(event) { event.stop(); this.changeImages(1); }).bindAsEventListener(this));
		}
		if($(this.parentDiv+'case_change_2')){
			$(this.parentDiv+'case_change_2').observe('click', (function(event) { event.stop(); this.changeImages(2); }).bindAsEventListener(this));
		}
		$(this.parentDiv+'case_change_'+changeNum).style.color = "#00aa44";
		}
		else { $(this.parentDiv+'cases_list').hide(); }
        imgPreloader.onload = (function(){
		$(this.parentDiv+'cases_img').src = backgroundImage;
		$(this.parentDiv+'cases_link').href = this.imageArray[this.nextCase].replace('/images/case_studies/images/', '/images/case_studies/large/');
		$(this.parentDiv+'cases_heading').innerHTML = this.headsArray[this.nextCase];
		$(this.parentDiv+'cases_text').innerHTML = this.titlesArray[this.nextCase];
		$(this.parentDiv+'cases_loading').hide();
		new Effect.Appear($(this.parentDiv+'cases_'));
		if (this.titlesArray[this.nextCase] != "") { $(this.parentDiv+'cases_text').show(); }
		else { $(this.parentDiv+'cases_text').hide(); }
		
		
        }).bind(this);
		$(this.parentDiv+'cases_img').show();
		$(this.parentDiv+'cases_loading').hide();
        imgPreloader.src = backgroundImage;
		imgPreloader.onerror = (function(){
		
		$(this.parentDiv+'cases_link').href = this.imageArray[this.nextCase].replace('/images/case_studies/images/', '/images/case_studies/large/');
//		$(this.parentDiv+'cases_heading').innerHTML = this.headsArray[this.nextCase];
		$(this.parentDiv+'cases_text').innerHTML = this.titlesArray[this.nextCase];
		new Effect.Appear($(this.parentDiv+'cases_'));
		if (this.titlesArray[this.nextCase] != "") { $(this.parentDiv+'cases_text').show(); }
		else { $(this.parentDiv+'cases_text').hide(); }
		
		}).bind(this);
	
		
		
	},
	preL: function(){
		this.preLimg = new Array();
		for(var i=0; i<this.imageArray.length; i++){
			this.preLimg[i] = new Image();
			this.preLimg[i].src = this.imageArray[i];
		}
	}
	
}


document.observe('dom:loaded', function () { case_init('cases', 150, 250); });
document.observe('dom:loaded', function () { case_init('cases2', 150, 250); });
document.observe('dom:loaded', function () { case_init('cases3', 0, 0); });
document.observe('dom:loaded', function () { case_init('cases4', 0, 0); });
document.observe('dom:loaded', function () { case_init('cases5', 0, 0); });