// Image Gallery
var d=document, imgs = new Array(), gallery = new Array(), current=0, fading=false, speed=0, wait=0, changespeed=2500, anim, queue;

function so_init(){	
	if(d.getElementById("image_container")){
		
		function setupMainImages(){			
			// Hide all but first image
			imgs = d.getElementById("image_container").getElementsByTagName("img");
			for(i=1;i<imgs.length;i++){
				imgs[i].style.display = 'none';
				imgs[i].xOpacity = 0;
			}
			imgs[0].style.display = "block";
			imgs[0].xOpacity = .99;
			imgs[0].style.zIndex = 88;
			
			// Big image navigation
			big_links = d.getElementById("image_container").getElementsByTagName('a');
			for (var i=0; i < big_links.length; i++) {
				big_links[i].onclick = function(){
					goToNextImage('next',wait);
					return false;			
				};
			};									
		};
		
		
		function setUpThumbNails(){
			gallery = d.getElementById("gallery").getElementsByTagName("a");
			for (var i=0; i < gallery.length; i++) {
				gallery[i].onclick = function(){
					selection = parseInt(this.className.replace('t','').replace('s',''));
					if(selection != current){
						goToNextImage(selection,wait);						
					}
					return false;
				};			
			};
		};
		
		function insertAfter( referenceNode, newNode )
		{
		    referenceNode.parentNode.insertBefore( newNode, referenceNode.nextSibling );
		}
		
		function setUpControls(){
			var control = document.createElement('div');
			control.id = 'controls';
			var button = document.createElement('a');
			button.href = "#";
			button.className = 'pause';
			button.innerHTML = 'Pause';
			control.appendChild(button);
			
			document.getElementById('project_module').appendChild(control);			
			var pp = document.getElementById('controls').getElementsByTagName('a')[0];
			pp.onclick = function(){
				switch(this.className){
					case 'pause':
						pause();
					break;					
					case 'play':
						play();
					break;
				}

				return false;
			};			
		};
		
		
		function initiateWhenReady(){
			// Only begin when at least second image is finished
			it = 0;
			function isComplete(){
				if(imgs[1].complete || imgs[1].complete == undefined || it == 500){				
						goToNextImage('noselection',changespeed);
						clearTimeout(com);
				} else {
					it += 1;
				}
			};
			com = setInterval(isComplete,10);		
		};


		// Initiate
		setupMainImages();
		setUpThumbNails();
		setUpControls();
		initiateWhenReady();
	}
};
		
// Function to hold off while another fade finishes
function goToNextImage(selection,seconds){
	if(speed > 0){
			if (fading == false){
				clearTimeout(anim);	
				anim = setTimeout(function(){so_xfade(selection);},seconds);
			} else {
				queue = setTimeout(function(){queueNext(selection);},wait);
			}			
	} else {
			clearTimeout(anim);
			anim = setTimeout(function(){so_xfade(selection);},seconds);
	}
		
	function queueNext(selection){
		clearTimeout(anim);
		so_xfade(selection);
	};
};

function pause(){
	var pp = document.getElementById('controls').getElementsByTagName('a')[0];
	(fading == false ? clearTimeout(anim) : setTimeout(function(){clearTimeout(anim)},wait));
	pp.className = 'play';	
}

function play(){
	var pp = document.getElementById('controls').getElementsByTagName('a')[0];
	goToNextImage('noselection',wait);
	pp.className = 'pause';
}

// this is called multiple times until fully faded
function so_xfade() {
	var selection = so_xfade.arguments[0];
	
	fading = true;			
	// Decide on skipping to defined image or just to next one
	if(selection == 'noselection' || selection == 'next'){
		nIndex = (imgs[current+1] ? current+1 : 0);
		sel = selection;		
	} else {
		nIndex = selection;
		sel = selection;		
	}

	cOpacity = imgs[current].xOpacity;
	nOpacity = imgs[nIndex].xOpacity;

	(speed > 0 ? cOpacity-=speed : cOpacity=0);
	(speed > 0 ? nOpacity+=speed : nOpacity=1);
			
	imgs[nIndex].style.display = "block";

	imgs[current].xOpacity = cOpacity;
	imgs[nIndex].xOpacity = nOpacity;
	
	setOpacity(imgs[current]); 
	setOpacity(imgs[nIndex]);

	// If current image is fully faded out, display it as none and reset the step through gallery
	if(cOpacity<=0) {
		imgs[current].style.display = "none";
		current = nIndex;
		document.getElementById('wrapper').className = "current_"+current;
		sel = (sel == current ? 'noselection' : sel);
		
		// Continue incrementing or pause
		if(selection == 'noselection'){
			anim = setTimeout("so_xfade(sel)",changespeed);
		} else {
			pause();
		}
	} else {
		// keep doing this function until faded
		anim = setTimeout("so_xfade(sel)",25);
	}
	
	// ----- does the fading
	function setOpacity(obj) {
		if(obj.xOpacity>0.99) {
			if(speed == 0){imgs[nIndex].style.zIndex = 99;}
			obj.xOpacity = 1;
			fading = false;
			setThumb(imgs[nIndex]);
			return;
		} else {
			if(speed == 0 && obj.xOpacity == 0){
				obj.xOpacity = 1;
			} else {
				// x-browser fading
				obj.style.opacity = obj.xOpacity;
				obj.style.MozOpacity = obj.xOpacity;
				obj.style.filter = "alpha(opacity=" + (obj.xOpacity*100) + ")";				
			}
		}
	};
	
	// set the selected thumb
	function setThumb(obj){
		var lis = document.getElementById('gallery').getElementsByTagName('a');
		for (var i=0; i < lis.length; i++) {
			var n = parseInt(obj.parentNode.id.replace('img',''));
			lis[i].parentNode.className = (i == n ? 'selected' : '');
		};		
	};	
};