/**
 * Crossfader.js - Cross fades slides
 * 
 * @author  Webstores <info at webstores dot nl>
 *           Copyright (c) Webstores internet totaalbureau <http://www.webstores.nl/>
 */

var fader;

var Crossfader = function(duration, firstSlide, slideCls, controlCls) {
	var slides,
		controls,
		interval,
		activeSlide,
		duration = duration || 5000,
		firstSlide = firstSlide || 0,
		slideCls = slideCls || 'slide',
		controlCls = controlCls || 'fade-control',
		looping = false;
	
	return {
		initialize: function() {
			slides = WS.DOM.getElementsByClass(slideCls);
			controls = WS.DOM.getElementsByClass(controlCls);
			activeSlide = slides[firstSlide];
			for(var i = 0; i < slides.length; i++) {
				if(i != firstSlide)
					WS.setOpacity(slides[i], 0);
			}
			this.initEvents();
		},
		initEvents: function() {
			var timeout;
			var self = this;
			for(var i = 0; i < controls.length; i++) {
				WS.Event.addEvent(controls[i], 'mouseover', function() {
					c = this;
					timeout = setTimeout(function() {
						self.moveTo(c.rel);
					}, 500);
				});
				WS.Event.addEvent(controls[i], 'mouseout', function() {
					clearTimeout(timeout);
					if(!looping) {
						self.start();
					}
				});
			}
			this.start();
		},
		start: function() {
			var self = this;
			interval = setInterval(function() {
				self.next();
			}, duration);
			looping = true;
		},
		stop: function() {
			clearInterval(interval);
			looping = false;
		},
		moveTo: function(id) {
			this.stop();
			WSEffect.FadeOut(activeSlide);
			WSEffect.FadeIn(id);
			activeSlide = $(id);
		},
		next: function() {
			WSEffect.FadeOut(activeSlide);
			if(activeSlide == slides.last()) {
				WSEffect.FadeIn(slides.first());
				activeSlide = slides.first();
			}
			else {
				WSEffect.FadeIn(slides[slides.indexOf(activeSlide) + 1]);
				activeSlide = slides[slides.indexOf(activeSlide) + 1];
			}
		}
	}
}

var WSEffect = {
	fps: 15,
	step: 0.125,
	
	FadeIn: function(el, opacity) {
		el = $(el);
		opacity = opacity || 0;
		WS.setOpacity(el, opacity);
		var self = this;
		if(opacity < 1) {
			setTimeout(function() {
				self.FadeIn(el, opacity + self.step);
			}, 1000 / this.fps);
		}
	},
	
	FadeOut: function(el, opacity) {
		el = $(el);
		if(opacity !== 0)
			opacity = opacity || 1;
		WS.setOpacity(el, opacity);
		var self = this;
		if(opacity > 0) {
			setTimeout(function() {
				self.FadeOut(el, opacity - self.step);
			}, 1000 / this.fps);
		}
	}
}

WS.Event.addEvent(window, 'load', function() {
	fader = new Crossfader(5000, 0, 'slide-visual', 'fade-control');
	fader.initialize();
});