var Dom = YAHOO.util.Dom;
var Event = YAHOO.util.Event;
var $ = function(id) {
      return document.getElementById(id);
}

//++++++++++++++++++++++++++++++++++++
// YUI IMAGE SLIDESHOW
// based on the work of Edwart Visser & Arjen Weeber
//
// show a slideshow of images
//
// REQUIRES: yahoo-dom-event.js
// OPTIONAL: animation-min.js
//
//++++++++++++++++++++++++++++++++++++

YAHOO.namespace("YAHOO.util.App.Images");

YAHOO.util.App.Images.slideshow = {
	// global variables inside properties objects
	properties : {
		slideshowAutoStart : true,
		slideshowPreload : false,
		slideshowSpeed : 4000,
		slideshowRootNode : null,
		slideshowListItems : null,
		slideshowFrames : null,
		slideshowFrameContainerId : null,
		slideshowIsAnimating : false,
		slideshowFadeInLink: null,
		slideshowFadeInObject : null,
		slideshowFadeOutLink: null,
		slideshowFadeOutObject : null,
		isActive : null,
		isNext : null,
		slideshowKeyboardNavigation : false
	},

	disableDefaultBehaviour : function(e) {
		Event.preventDefault(e);
	},

	init : function(slideshowProperties) {		
		// set properties
		this.properties.slideshowAutoStart = slideshowProperties.autoStart;
		this.properties.slideshowPreload = slideshowProperties.preloadImages;
		this.properties.slideshowSpeed = slideshowProperties.slideSpeed;
		this.properties.slideshowRootNode =  $(slideshowProperties.rootId);
		this.properties.slideshowFrameContainerId =  slideshowProperties.frameContainer;

		if(this.properties.slideshowRootNode){
			var slideshowList = this.properties.slideshowRootNode.getElementsByTagName("ul")[0];
			this.properties.slideshowListItems = slideshowList.getElementsByTagName("li");
			this.properties.slideshowFrames = Dom.getElementsByClassName("slide_nav_link","li",slideshowList);
			this.properties.isActive = this.getCurrent();
			this.properties.isNext = this.getNext();

			// build image container
			this.buildContainer();

			// set slide objects
			this.properties.slideshowFadeInLink = Dom.get("link2");
			this.properties.slideshowFadeInObject = Dom.get("slide2");
      this.properties.slideshowFadeOutLink = Dom.get("link1");
			this.properties.slideshowFadeOutObject = Dom.get("slide1");

			// init navigation controlls
			this.initPagination();

			if(this.properties.slideshowAutoStart) {
				this.startTimer();
			}

			if(this.properties.slideshowPreload) {
				this.preloadImages();
			}
		}

		if(this.properties.slideshowKeyboardNavigation) {
			this.keyboardNavigation();
		}
	},

	getCurrent : function() {
		if(this.properties.slideshowFrames.length > 0) {
			for(var i=0; i<this.properties.slideshowFrames.length; i++) {
				if(Dom.hasClass(this.properties.slideshowFrames[i],"isActive")) {
					return i;
				}
			}
		}
	},

	getNext : function() {
		if(this.properties.isActive == this.properties.slideshowFrames.length -1) {
			return 0;
		} else {
			return this.properties.isActive + 1;
		}
	},
	
	getPrevious : function() {
		if(this.properties.isActive == 0) {
			return this.properties.slideshowFrames.length -1;
		} else {
			return this.properties.isActive - 1;
		}
	},

	buildContainer : function() {
		if(!$(this.properties.slideshowFrameContainerId)){
			var frameContainer = document.createElement("div");
			var linkA = document.createElement("a");			
			var imgA = document.createElement("img");
			
			var linkB = document.createElement("a");
			var imgB = document.createElement("img");
			
      // set link hrefs
			linkA.setAttribute("href", this.properties.slideshowFrames[this.properties.isActive].getElementsByTagName("a")[0].getAttribute("href"));
			linkB.setAttribute("href", this.properties.slideshowFrames[this.properties.isNext].getElementsByTagName("a")[0].getAttribute("href"));
			
			// set image sources
			imgA.setAttribute("src",this.properties.slideshowFrames[this.properties.isActive].getElementsByTagName("img")[0].getAttribute("src"));
			imgB.setAttribute("src",this.properties.slideshowFrames[this.properties.isNext].getElementsByTagName("img")[0].getAttribute("src"));

			Dom.addClass(imgA,"slide_show");
			Dom.addClass(imgB,"slide_hide");

			frameContainer.id = this.properties.slideshowFrameContainerId;
			imgA.id = "slide1"; // starts as back image
			imgB.id = "slide2"; // starts as front image
      
			linkA.id = "link1"; // starts as back link
      linkB.id = "link2"; // starts as front link
      
			// append elements
			linkA.appendChild(imgA);			
			linkB.appendChild(imgB);
			
			frameContainer.appendChild(linkA);
			frameContainer.appendChild(linkB);
			this.properties.slideshowRootNode.appendChild(frameContainer);
		}
	},
	
	initPagination : function() {
		for(var i=0; i<this.properties.slideshowListItems.length; i++) {
			var controlNode = this.properties.slideshowListItems[i].getElementsByTagName("a")[0];
			Event.addListener(controlNode,"click",this.disableDefaultBehaviour);

			// add behaviour based on classname
			switch(true) {
				case Dom.hasClass(this.properties.slideshowListItems[i],"navPrev") : var slideTarget = -1;
				break;

				case Dom.hasClass(this.properties.slideshowListItems[i],"navNext") : var slideTarget = 1;
				break;

				default : var slideTarget = 0;
				break;
			}

			Event.addListener(controlNode,"click",this.slideTo,{slidePosition:slideTarget,slideshowObject:this});
		}
	},

	slideTo : function(e,slideProperties,refObj) {
		var slideshowObject = slideProperties.slideshowObject;

		// turn off autostart
		slideshowObject.properties.slideshowAutoStart = false;

    //cancel schedule slide animation
		window.clearTimeout(slideshowObject.animationTimer);

		if(!refObj) {
			refObj = this;
		}

		if(slideshowObject.properties.slideshowIsAnimating) {
			var timedAnim = window.setTimeout(function() {slideshowObject.slideTo(null,slideProperties,refObj);}, 1000);
			return false;
		}

		// set frame
		if(slideProperties.slidePosition == 1) {
			slideshowObject.properties.isNext = slideshowObject.getNext();
		} else if (slideProperties.slidePosition == -1) {
			slideshowObject.properties.isNext = slideshowObject.getPrevious();
		} else {
			slideshowObject.properties.isNext = slideshowObject.getSelected(refObj);
		}

		// set slideTo img object source
		slideshowObject.properties.slideshowFadeInLink.href = slideshowObject.properties.slideshowFrames[slideshowObject.properties.isNext].getElementsByTagName("a")[0].getAttribute("href");
		slideshowObject.properties.slideshowFadeInObject.src = slideshowObject.properties.slideshowFrames[slideshowObject.properties.isNext].getElementsByTagName("img")[0].getAttribute("src");

		// animate to slideTo img
		slideshowObject.startAnimate(slideshowObject);
	},
	
	startAnimate : function(slideshowObject) {
    
		
		// fade out current slide
		fadeOutAnimation = new YAHOO.util.Anim(slideshowObject.properties.slideshowFadeOutObject, { opacity: { to: 0 }}, 25);
		fadeOutEnd = function() {
      Dom.removeClass(slideshowObject.properties.slideshowFrames[slideshowObject.properties.isActive],"isActive");
      Dom.addClass(slideshowObject.properties.slideshowFrames[slideshowObject.properties.isNext],"isActive");
		}
		fadeOutAnimation.useSeconds = false;
		fadeOutAnimation.onComplete.subscribe(fadeOutEnd);
		fadeOutAnimation.animate();
		slideshowObject.properties.slideshowIsAnimating = true;

		// fade in new slide		
		fadeInAnimation = new YAHOO.util.Anim(slideshowObject.properties.slideshowFadeInObject, { opacity: { to: 0.999}}, 25);		
		fadeInEnd = function() {
			// var s = slideshowObject.properties.slideshowFadeInLink.href;
			
			slideshowObject.properties.slideshowFadeOutObject.src = slideshowObject.properties.slideshowFrames[slideshowObject.properties.isActive].getElementsByTagName("img")[0].getAttribute("src");
			slideshowObject.properties.slideshowFadeOutLink.src = slideshowObject.properties.slideshowFrames[slideshowObject.properties.isActive].getElementsByTagName("a")[0].getAttribute("href");
			slideshowObject.properties.isActive = slideshowObject.properties.isNext;

			// replace classes
			Dom.replaceClass(slideshowObject.properties.slideshowFadeInObject,"slide_hide","slide_show");
			Dom.replaceClass(slideshowObject.properties.slideshowFadeInLink,"slide_hide","slide_show");
			Dom.replaceClass(slideshowObject.properties.slideshowFadeOutObject,"slide_show","slide_hide");
			Dom.replaceClass(slideshowObject.properties.slideshowFadeOutLink,"slide_show","slide_hide");

			// set new fadeIn & fadeOut object references			
			slideshowObject.properties.slideshowFadeInObject = Dom.getElementsByClassName("slide_hide","img",slideshowObject.properties.slideshowRootNode)[0];
			slideshowObject.properties.slideshowFadeInLink = Dom.getElementsByClassName("slide_hide","a",slideshowObject.properties.slideshowRootNode)[0];
			slideshowObject.properties.slideshowFadeOutObject = Dom.getElementsByClassName("slide_show","img",slideshowObject.properties.slideshowRootNode)[0];
			slideshowObject.properties.slideshowFadeOutLink = Dom.getElementsByClassName("slide_show","a",slideshowObject.properties.slideshowRootNode)[0];
			
			// remove any inline styling
			slideshowObject.properties.slideshowFadeInObject.removeAttribute("style");
			slideshowObject.properties.slideshowFadeInLink.removeAttribute("style");
			slideshowObject.properties.slideshowFadeOutObject.removeAttribute("style");
			slideshowObject.properties.slideshowFadeOutLink.removeAttribute("style");
			slideshowObject.properties.slideshowIsAnimating = false;

			if(slideshowObject.properties.slideshowAutoStart) {
				slideshowObject.properties.isNext = slideshowObject.getNext();
				slideshowObject.properties.slideshowFadeInObject.src = slideshowObject.properties.slideshowFrames[slideshowObject.properties.isNext].getElementsByTagName("img")[0].getAttribute("src");
				slideshowObject.properties.slideshowFadeInLink.href = slideshowObject.properties.slideshowFrames[slideshowObject.properties.isNext].getElementsByTagName("a")[0].getAttribute("href");
				slideshowObject.startTimer();
			}
		}
		fadeInAnimation.useSeconds = false;
		fadeInAnimation.onComplete.subscribe(fadeInEnd);		
		fadeInAnimation.animate();
	},
	
	startTimer : function() {
		var slideshowObject = this;
		slideshowObject.animationTimer = window.setTimeout(function() { slideshowObject.startAnimate(slideshowObject);},this.properties.slideshowSpeed);
	},

	preloadImages : function() {
		for(var i=2; i<this.properties.slideshowFrames.length;i++) {
			var preloadImage = document.createElement("img");
			preloadImage.src = this.properties.slideshowFrames[i].getElementsByTagName("img")[0].getAttribute("src");
		}
	},

	getSelected : function(refObject) {
		// remove previous active class
		Dom.removeClass(this.properties.slideshowFrames[this.properties.isActive],"isActive");

		// set active class
		Dom.addClass(refObject.parentNode,"isActive");

		return this.getCurrent();
	},

	keyboardNavigation : function() {
		var refObj = this;
		Event.addListener(window,"keydown",this.keyPressed,refObj);
	},
	
	keyPressed : function(e,refObj) {
		if(e.keyCode == 37) {
			var slideProperties = {
				slidePosition:-1,
				slideshowObject:refObj
			}
			refObj.slideTo(e,slideProperties,refObj);
		} else if (e.keyCode == 39) {
			var slideProperties = {
				slidePosition: 1,
				slideshowObject:refObj
			}
			refObj.slideTo(e,slideProperties,refObj);
		}
	}
}

initPage = function() {
	// call slideshow init function 
	YAHOO.util.App.Images.slideshow.init({
		rootId:"slideshow",
		autoStart:true,
		slideSpeed:4000,
		preloadImages:false,
		frameContainer:"slideshow_stage"
	});
}