// JavaScript Document
/****************************************************
	Slide Show III
	version 1.0
	Last Revision: 08.25.2004
	steve@slayeroffice.com
	http://slayeroffice.com/code/slide_show3

	Please leave this notice in tact!

	Should you modify/improve upon this code
	please let me know so that I can update the
	version hosted at slayeroffice.

****************************************************/

window.onload = init;
var d=document;
var mObj,mImgObj,mThumbs;
var currentImg = 0;
var thumbStats = new Array();
var zInterval = null;

var INCREMENT = 4;

function init() {
	if(!document.getElementById)return;
	mObj = d.getElementById("mContainer");
	mImgObj = mObj.getElementsByTagName("img");
	
	cObj = d.getElementById("pContainer").appendChild(d.createElement("div"));
	cObj.id = "controls";
	ccObj = d.getElementById("pContainer").appendChild(d.createElement("h2"));
	ccObj.id = "caption";
	
	for(i=0;i<mImgObj.length;i++)mImgObj[i].style.display = "none";
	breakImage(mImgObj[currentImg],1);

	createNavigation();	
	d.getElementById("caption").innerHTML = mImgObj[0].alt;
}

function breakImage(imgObj,isFirst) {
	correction = isFirst?0:50;
	cols = 5;//imgObj.width/100;
	rows = 3;//imgObj.height/100;
	x=0;y=0;
	mThumbs = new Array();
	for(i=0;i<cols*rows;i++) {
		thumbStats[i] = new Array();
		mThumbs[i] = mObj.appendChild(d.createElement("div"));
		mThumbs[i].className = "thumbnail";
		if(!isFirst) {
			mThumbs[i].style.width="10px";
			mThumbs[i].style.height="10px";
			thumbStats[i][0] = 10;
			thumbStats[i][1] = 10;
		} else {
			thumbStats[i][0] = 100;
			thumbStats[i][1] = 100;
		}
		mThumbs[i].style.top = y+correction+"px";
		mThumbs[i].style.left = x+correction+"px";

		thumbStats[i][2] = x+correction;
		thumbStats[i][3] = y+correction;

		mThumbs[i].style.backgroundImage = "url(" + imgObj.src + ")";
		mThumbs[i].style.backgroundPosition = -x+"px " + -y + "px";

		mThumbs[i].title = imgObj.title;
		x+=100;
		if(x>=500) {
			x=0; y+=100;
		}
	}
}

function nextImage(nxtImage) {
	currentImg = nxtImage;
	if(zInterval == null) zInterval = setInterval("contractImage()",10);
}

function createNavigation() {
	for(i=0;i<mImgObj.length;i++) {
		nxt = d.getElementById("controls").appendChild(d.createElement("a"));
		nxt.innerHTML = i+1;
		nxt.href = "javascript: nextImage("+i+")";
	}
}

function removeThumbs() {
	for(i=0;i<mThumbs.length;i++)mObj.removeChild(mThumbs[i]);
}

function expandImage() {
	for(i=0;i<mThumbs.length;i++) {
		w = thumbStats[i][0];
		h = thumbStats[i][1];
		x = thumbStats[i][2];
		y = thumbStats[i][3];
		w+=INCREMENT; h+=INCREMENT; y-=INCREMENT/2; x-=INCREMENT/2;
		setThumbnailDimensions(w,h,x,y,i);
		
	}
	if(w>=100) {
		clearInterval(zInterval);
		zInterval = null;
		d.getElementById("caption").innerHTML = mThumbs[0].title;
	}
}

function setThumbnailDimensions(w,h,x,y,index) {
	mThumbs[index].style.backgroundPosition = -x + "px " + -y + "px";
	mThumbs[index].style.width = w+"px";
	mThumbs[index].style.height = h+"px";
	mThumbs[index].style.left = x+"px";
	mThumbs[index].style.top = y+"px";
	thumbStats[index][0] = w; thumbStats[index][1] = h; thumbStats[index][2]=x; thumbStats[index][3]=y;
}

function contractImage() {
	for(i=0;i<mThumbs.length;i++) {
		w = thumbStats[i][0];
		h = thumbStats[i][1];
		x = thumbStats[i][2];
		y = thumbStats[i][3];

		w-=INCREMENT; h-=INCREMENT; y+=Math.round(INCREMENT/2); x+=Math.round(INCREMENT/2);
		setThumbnailDimensions(w,h,x,y,i);
	}
	if(w<=2) {
		clearInterval(zInterval);
		removeThumbs();
		if(currentImg>=mImgObj.length)currentImg = 0;
		breakImage(mImgObj[currentImg],0);
		zInterval = setInterval('expandImage()',10);
	}
}