/* Slideflow - Javascript slideshow library - http://www.10flow.com/
 Copyright 2010 Scott Sawyer, all rights reserved */
 
// Requires mootools
 
function Slideflow(id, timeout) {
	this.id = id;
	this.timeout = timeout;
	this.operating_mode = "PAUSED";
	this.slides = [];
	
	this.init = function() {
		var id = this.id;
		var o = " style='opacity:0' ";
		var m = " onmouseover='"+id+".pause()' onmouseout='"+id+".resume()' ";
		this.div_show = document.id(this.id);
		this.div_show.innerHTML =
			"<div id='" + id + "-controls'"+m+"></div>" +
			"<div id='" + id + "-photo1'"+o+m+"class='" + id + "-photo'>"+
			"<img id='" + id + "-img1' style='position:absolute'></div>" +
			"<div id='" + id + "-content1'"+o+m+"class='" + id + "-content'></div>" +
			"<div id='" + id + "-photo0'"+o+m+"class='" + id + "-photo'>"+
			"<img id='" + id + "-img0' style='position:absolute'></div>" +
			"<div id='" + id + "-content0'"+o+m+"class='" + id + "-content'></div>" +
                        "<div id='" + id + "-loader'><img src='" + this.loader + "'></div>";
		this.controls_element = document.id(this.id + "-controls");
                this.loader_element = document.id(this.id + "-loader");
		this.elements = [];
		this.elements[0] = new Object;
		this.elements[1] = new Object;
		this.elements[0].photo = document.id(this.id + "-photo0");
		this.elements[1].photo = document.id(this.id + "-photo1");
		this.elements[0].content = document.id(this.id + "-content0");
		this.elements[1].content = document.id(this.id + "-content1");
		this.elements[0].img = document.id(this.id + "-img0");
		this.elements[1].img = document.id(this.id + "-img1");
		
		this.H = this.elements[0].photo.offsetHeight;
		this.W = this.elements[0].photo.offsetWidth;
		
		this.elements[0].photo.set('tween', {duration: 500});
		this.elements[1].photo.set('tween', {duration: 500});
		this.elements[0].content.set('tween', {duration: 250});
		this.elements[1].content.set('tween', {duration: 250});
		
		this.next_element = 0;
		this.current_element = 1;
		this.next_slide = 0;
		this.current_slide = -1;
		this.stage(0,0,"onInitialLoad");
	}
	
	this.addSlide = function(src, content) {
		var p = new Object();
		p.src = src;
		//p.title = title;
		p.content = content;
		this.slides.push(p);
	}
	
	this.getHandle = function(function_name) {
		var tmp = this;
		return(function(){ tmp[function_name](); });
	}
	
	this.stage = function(el_ind, sl_index, callback) {
		var e = this.elements[el_ind];
		var p = this.slides[sl_index];
		e.img.src = "";
		this.slide_ready = false;
		var cb = this.getHandle(callback)
		e.img.onload = cb;
		e.img.src = p.src;
		//e.content.innerHTML = "<h3>" + p.title + "</h3>" + p.content;
                e.content.innerHTML = p.content;
	}
	
	this.getNextElInd = function(current) {
		return (current+1) % 2;
	}
	this.getNextSlInd = function(current) {
		return (current+1) % this.slides.length;
	}
	this.updateIndices = function() {
		this.current_element = this.next_element;
		this.current_slide = this.next_slide;
		this.next_element = this.getNextElInd(this.current_element);
		this.next_slide = this.getNextSlInd(this.current_slide);
	}
	
	this.onInitialLoad = function() {
		this.swap();
		this.updateIndices();
		this.stage(this.next_element, this.next_slide, "onRunningLoad");
		this.setSlideTimer();
	}
	this.onRunningLoad = function() {
		this.slide_ready = true;
		this.trigger();
	}
	this.onPausedLoad = function() {
		this.swap();
		this.current_element = this.next_element;
		this.next_element = this.getNextElInd();
		this.current_slide = this.next_slide;
	}
	this.onSlideTimer = function () {
		this.slide_timer_ready = true;
		this.trigger();
	}
	this.onTransitionTimer = function() {
		this.updateIndices();
		this.stage(this.next_element, this.next_slide, "onRunningLoad");
		this.setSlideTimer();
	}
	this.swap = function() {
		this.elements[this.next_element].img.onload = null;
		var h = this.elements[this.next_element].img.height;
		var w = this.elements[this.next_element].img.width;
		this.elements[this.next_element].img.style.left = (this.W-w)/2 + "px";
		this.elements[this.next_element].img.style.top = (this.H-h)/2 + "px";
                this.elements[this.current_element].photo.fade('out');
		this.elements[this.next_element].photo.fade('in');
                this.elements[this.current_element].content.fade('out');
		this.elements[this.next_element].content.fade('in');
		
		this.controls_element.innerHTML = this.controls(this.next_slide+1,
			this.slides.length);
	}
	this.trigger = function() {
		if(this.slide_timer_ready && this.slide_ready) {
			this.slide_timer_ready = false;
			this.slide_ready = false;
			this.swap();
			this.setTransitionTimer();
		}
	}
	
	this.controls = function(current, total) {
		return current + " of " + total;
	}
	
	this.setSlideTimer = function() {
		var cb = this.getHandle("onSlideTimer");
		this.slide_timer = setTimeout(cb, this.timeout);
		this.slide_timer_ready = false;
	}
	this.clearSlideTimer = function() {
		clearTimeout(this.slide_timer);
		this.slide_timer_ready = false;
	}
	this.setTransitionTimer = function() {
		var cb = this.getHandle("onTransitionTimer");
		this.trans_timer = setTimeout(cb, 550);
	}
	this.clearTransitionTimer = function() {
		clearTimeout(this.trans_timer);
	}
	
	//"public" (button) methods
	this.resume = function() {
		this.next_slide = this.getNextSlInd(this.current_slide);
		this.next_element = this.getNextElInd(this.current_element);
		this.stage(this.next_element, this.next_slide, "onRunningLoad");
		this.setSlideTimer();
                this.loader_element.style.visibility = "visible";
	}
	
	this.pause = function() {
		this.clearSlideTimer();
		this.clearTransitionTimer();
                this.loader_element.style.visibility = "hidden";
	}
	
	this.back = function() {
		this.pause();
		this.next_slide = (this.current_slide-1) % this.slides.length;
		if(this.next_slide < 0)
			this.next_slide = this.slides.length - 1;
		this.next_element = this.getNextElInd(this.current_element);
		this.stage(this.next_element, this.next_slide, "onPausedLoad");
	}
	
	this.next = function() {
		this.pause();
		this.next_slide = this.getNextSlInd(this.current_slide);
		this.next_element = this.getNextElInd(this.current_element);
		this.stage(this.next_element, this.next_slide, "onPausedLoad");
	}
}