/* 
 * This set of javascript implements a simple transitioning slide show display
 * the main interface is
 *	startSlideShow(div1, div2, arrayOfImages, randomize, delay, transitionSpeed);
 *	   where div1 and div2 are the "IDs" of the DIVS on the page to use for the transition (should be the same size)
 *	         arrayOfImages is an array of "URLS" to the image list to be displayed
 *	         randomize, if "true" will randomly select from the array, otherwise they will play in order
 *	         delay is the time between image transitions
 *	         transitionSpeed is the time (ms) to run the transition animation
 *
 *   08-14-09 developed by MikeO for Rob
 *  see sstest.php for a stand alone example (but note that it's php function is now in /global/lp/page_elements.php
*/

// variables to store the parameters
var ss_div1;
var ss_div2;
var ss_transitionIntervalStep;
var ss_delay;
var ss_randomize;
var ss_arrayOfImages;
var ss_current; // current index of the image being displayed
var ss_timer;

// from morrison.ben@gmail.com , http://lists.evolt.org/archive/Week-of-Mon-20070115/187466.html
function ss_setOpacity(obj, opacity) {
	opacity = (opacity == 100)?99.999:opacity;
	obj.style.filter="progid:DXImageTransform.Microsoft.Alpha(opacity="+ opacity + ");"; //IE
	obj.style.MozOpacity = opacity/100; // Older Mozilla and Firefox
	obj.style.opacity = opacity/100; // standard CSS
}

function ss_fadeOut(id, level){
	ss_setOpacity(document.getElementById(id), level);
	if (level > 0) {
		level = level - 5;
		setTimeout( "ss_fadeOut('"+id+"', "+level+");", ss_transitionIntervalStep );
	}
}
function ss_fadeIn(id, level){
	ss_setOpacity(document.getElementById(id), level);
	if (level < 100) {
		level = level + 5;   // at 5 is 1/20 of fade on each step, so for smoother step do it 4,3,2,1; but no longer than duration of fade
		setTimeout( "ss_fadeIn('"+id+"', "+level+");", ss_transitionIntervalStep );
	}
}

function ss_findPos(obj) {
	var cleft = 0;
	var ctop = 0;
	if (obj.offsetParent) {
		do {
			cleft += obj.offsetLeft;
			ctop += obj.offsetTop;
		} while (obj = obj.offsetParent);
	}
	return [ctop,cleft];
}

function ss_transition(fromId, toId) {
	ss_setOpacity(document.getElementById(toId), 0);
	var div1 = document.getElementById(fromId);
	var div2 = document.getElementById(toId);
	var p = ss_findPos(div1);
	div2.style.top = p[0];
	div2.style.left = p[1];
	div2.style.visibility="visible";
	div2.style.display="";
	ss_fadeOut(fromId, 100);
	ss_fadeIn(toId, 0);
}

function ss_play() {
	var i1;
	var i2;
	if (ss_randomize) {
		i1 = ss_current;
		i2 = Math.floor(Math.random()*ss_arrayOfImages.length);
		// just in case
		if (i2 == i1) {
			i2++; // if we randomize to the same index, just be incremental
			if (i2 >= ss_arrayOfImages.length) {
				i2 = 0;
			}
		}
	} else {
		i1 = ss_current;
		i2 = ss_current+1;
		if (i2 >= ss_arrayOfImages.length) {
			i2 = 0;
		}
	}
	ss_current = i2;
	var imghere = document.getElementById(ss_div1);
	var imghere2 = document.getElementById(ss_div2);
	var pos = ss_findPos(imghere);
	imghere2.style.visibility="hidden";
	imghere2.innerHTML="<img id=\"sl_image2\"src=\""+ss_arrayOfImages[i1]+"\" class=\"ss_photo\" >";
	imghere2.style.top = pos[0];
	imghere2.style.left = pos[1];
	imghere2.style.visibility="visible";
	imghere2.style.display="";

	imghere.style.visibility="hidden";
	imghere.innerHTML="<img id=\"sl_image\"src=\""+ss_arrayOfImages[i2]+"\"  class=\"ss_photo\" >";
	ss_transition(ss_div2, ss_div1);
}

function startSlideShow(div1, div2, arrayOfImages, randomize, delay, transitionSpeed) {
	ss_div1 = div1;
	ss_div2 = div2;
	var imghere = document.getElementById(ss_div1);
	ss_arrayOfImages = arrayOfImages;
	ss_randomize = randomize;
	ss_delay = delay;
	ss_transitionIntervalStep = transitionSpeed;
	ss_current = 0;   // set to 1 or try 0, comment out ss_play, set image tag 

	imghere.innerHTML="<img id=\"sl_image\"src=\""+ss_arrayOfImages[0]+"\"  class=\"ss_photo\" >";
	// ss_play();   // if I don't want to have the previous line stuff the starter image in for immediate display, then can kick off play , but that flashes past first image...

	ss_timer = setInterval("ss_play()", ss_delay);
}

function stopSlideShow() {
	if (ss_timer != null) {
		clearInterval(ss_timer);
		ss_timer = null;
	}
}