/**
 * this script will implement a javascript slideshow with backing support which will allow
 * different image size display while including a fading effect when switching from one picture
 * to the next.
 **/
var isKHTML = navigator.vendor == 'KDE' || ( document.childNodes && !document.all && !navigator.taintEnabled );

function isipSlideshowGetDistanceFromBody(elm) {
	if(elm.nodeName == "body" || elm.nodeName == "BODY") {
		return 0;
	} else {
		return elm.offsetTop+isipSlideshowGetDistanceFromBody(elm.offsetParent);
	}
}

function isipSlideshow(id) {
	//we should load all of the images we can find in the slideshow	
	this.id = id;
	this.slideshow = document.getElementById(id);
	this.slideshow.style.visibility = "hidden";		
	this.slh = this.slideshow.clientHeight;
	this.slw = this.slideshow.clientWidth;	
	this.offsetFromBody = isipSlideshowGetDistanceFromBody(this.slideshow);
	if(!document.all) {
		var slStyle = window.getComputedStyle(this.slideshow,null);
		var padTop = new Number(slStyle.paddingTop.substring(0,slStyle.paddingTop.indexOf("px")));
		var padBottom = new Number(slStyle.paddingBottom.substring(0,slStyle.paddingBottom.indexOf("px")));
		var padLeft = new Number(slStyle.paddingLeft.substring(0,slStyle.paddingLeft.indexOf("px")));
		var padRight = new Number(slStyle.paddingRight.substring(0,slStyle.paddingRight.indexOf("px")));
			
		this.slh = this.slh-(padTop+padBottom);
		this.slw = this.slw-(padLeft+padRight);
	} else {
		//internet explorer has a different way of doing this.
		this.slh = new Number(this.slideshow.currentStyle["height"].substring(0,this.slideshow.currentStyle["height"].indexOf("px")));
		this.slw = new Number(this.slideshow.currentStyle["width"].substring(0,this.slideshow.currentStyle["width"].indexOf("px")));
		var padTop = new Number(this.slideshow.currentStyle["paddingTop"].substring(0,this.slideshow.currentStyle["paddingTop"].indexOf("px")));
		var padBottom = new Number(this.slideshow.currentStyle["paddingBottom"].substring(0,this.slideshow.currentStyle["paddingBottom"].indexOf("px")));
		var padLeft = new Number(this.slideshow.currentStyle["paddingLeft"].substring(0,this.slideshow.currentStyle["paddingLeft"].indexOf("px")));
		var padRight = new Number(this.slideshow.currentStyle["paddingRight"].substring(0,this.slideshow.currentStyle["paddingRight"].indexOf("px")));
		
		this.slh = this.slh-(padTop+padBottom);
		this.slw = this.slw-(padLeft+padRight);
	}
	
	this.imgList = this.slideshow.getElementsByTagName("img");	
	for(var i = 0; i < this.imgList.length; i++) {
		/*if(i > 0) {
			this.imgList[i].style.visibility = "hidden";
		}*/
		if(this.imgList[i].width > this.slw || this.imgList[i].height > this.slh) {
			if(this.imgList[i].width > this.imgList[i].height) {
				this.imgList[i].width=this.slw;
			} else {
				this.imgList[i].height=this.slh;
			}
		}
		this.imgList[i].style.position = "absolute";
		//now we have to center the image with respect to the rectange.
		if(this.slh-this.imgList[i].height > 0) {
			this.imgList[i].style.top=(((this.slh-this.imgList[i].height)/2)+this.offsetFromBody)+"px";			
		}
		if(this.slw-this.imgList[i].width > 0) {
			this.imgList[i].style.left=((this.slh-this.imgList[i].width)/2)+"px";
		}
		//we also need to calculate the size of these images relative to their surrounding box.
		if(i > 0) {
			this.imgList[i].style.opacity="0";
			if(document.all) {
				this.imgList[i].style.filter="alpha(opacity=0)";
			}
		} else {			
			this.imgList[i].style.opacity="1";
			if(document.all) {
				this.imgList[i].style.filter="alpha(opacity=100)";
			}
		}
		this.imgList[i].style.zIndex=(100+i);
		this.imgList[i].id="slide_"+i;
	}
	this.currentFrame = 0;
	this.animCtr = 0;
	this.frames = this.imgList.length;
	this.nextFrame = 1;		
	this.blocked = false;
	this.blockCtr = 0;
	this.frameChanged = function() {
		var currentOpacity = this.imgList[this.currentFrame].style.opacity;
		var nextOpacity = this.imgList[this.nextFrame].style.opacity;
		if(nextOpacity < 1) {
			nextOpacity = new Number(nextOpacity)+0.1;
		}
		currentOpacity = currentOpacity-0.1;
		if(nextOpacity >= 0.7) {
			var titleElm = document.getElementById("slideshowTitle");
			if(titleElm) {
				var currentTitle = this.currentFrame+1;
				if(currentTitle >= this.imgList.length) {
					currentTitle = 0;
				}
				titleElm.innerHTML=this.imgList[currentTitle].title;
			}
		}
		if(currentOpacity <= 0) {
			this.imgList[this.currentFrame].style.opacity = "0.0";
			this.imgList[this.nextFrame].style.opacity = "1.0";
			this.currentFrame++;
			this.nextFrame++;
			if(this.nextFrame >= this.frames) {
				this.nextFrame = 0;				
			}
			if(this.currentFrame >= this.frames) {
				this.currentFrame = 0;
			}
			this.blocked = true;
			this.blockCtr = 0;
		} else {
			if(currentOpacity > 0) {
				this.imgList[this.currentFrame].style.opacity = currentOpacity;
				if(document.all) {
					this.imgList[this.currentFrame].style.filter = "alpha(opacity="+(currentOpacity*100)+")";
				}
			}
			this.imgList[this.nextFrame].style.opacity = nextOpacity;
			if(document.all) {
				this.imgList[this.nextFrame].style.filter = "alpha(opacity="+(nextOpacity*100)+")";
			}			
		}		
	}
	this.slideshow.style.visibility = "visible";
}

function initSlideshow() {
	var slideshow = document.getElementById("slideshow");
	if(slideshow) {
		var slideshowRef = new isipSlideshow("slideshow");
		if(slideshowRef.frames > 1) {
			var slideshowAnim = new YAHOO.util.Anim(slideshowRef,{ animCtr: { from: 0, to: 100 } },1,YAHOO.util.Easing.easeOutStrong);
			slideshowAnim.duration = 9999999;
			slideshowAnim.onTween.subscribe(function() {
					slideshowRef.animCtr++;				
					if(slideshowRef.animCtr % 10 == 0) {
						if(!slideshowRef.blocked) {
							slideshowRef.frameChanged();
						} else if(slideshowRef.blockCtr == 10) {
							slideshowRef.blockCtr = 0;
							slideshowRef.blocked = false;
						} else {
							slideshowRef.blockCtr++;
						}
					}
			});
			slideshowAnim.animate();			
		}
		var titleElm = document.getElementById("slideshowTitle");
		if(titleElm) {
			titleElm.innerHTML=slideshowRef.imgList[slideshowRef.currentFrame].title;
		}
	}
}

window.onload = function() {
	initSlideshow();
};

/*if(!isKHTML)
	YAHOO.util.Event.onDOMReady(initSlideshow);
else {
	
}*/