/*
*
* Copyright (c) 2006 Millstream Web Software http://www.millstream.com.au
* 
* Permission is hereby granted, free of charge, to any person
* obtaining a copy of this software and associated documentation
* files (the "Software"), to deal in the Software without
* restriction, including without limitation the rights to use, copy,
* modify, merge, publish, distribute, sublicense, and/or sell copies
* of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
* 
* The above copyright notice and this permission notice shall be
* included in all copies or substantial portions of the Software.
* 
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
* EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
* MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
* NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS
* BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN
* ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
* SOFTWARE.
* * 
*/

/*
* Class: Slideshow
* Written by: Andrew Tetlaw http://tetlaw.id.au
* Displays a cross-fading slideshow
* Option:default
* 	uri : [], // an array of image URIs
*		interval : 5, // seconds for each slide to be visible
*		duration : 1, // duration of fade efefct
*		fps : 50, // frames per second of slide effect; shouldn't need to adjust this
*		crossfade : true // if you don't want a cross-fade set this to false and it'll do a fade out - fade in , instead.
*/
var Slideshow = Class.create();

Slideshow.prototype = {
	initialize : function(elm, options) {
		
		this.elm = $(elm);
		this.counter = 0;
		this.loaded = false;
		this.options = Object.extend({
			uri : [],
			interval : 5,
			duration : 1,
			fps : 50,
			crossfade : true
		}, options || {})
		this.options.uri = $A(this.options.uri);
		if(FastInit) {
			FastInit.addOnLoad(this.start.bind(this));
		} else {
			Event.observe(window, 'load', this.start.bind(this));
		}
	},
	start: function() {
		//console.log('start... ' + this.options.uri.length + ' uris defined');
		var img = document.createElement('img');
		img.src = this.options.uri[0];
    this.cycle();

		new PeriodicalExecuter(this.cycle.bind(this), this.options.interval); 
	},
	cycle: function() {
		var elm = this.elm;
		var opt = this.options;
		if(this.counter++ == opt.uri.length) {
			this.counter = 1
			this.loaded = true;
		}
		count = this.counter;
		var next = document.createElement('img');
		next.src = this.options.uri[count-1];
		if(!this.loaded) {
			var preload = document.createElement('img');
			preload.src = this.options.uri[count]; 
		}
		//console.log(next.src);
		if(this.options.crossfade) {
			var currentSlide;
			if(elm.firstChild) {
				currentSlide = elm.firstChild;
			} else {
				currentSlide = document.createElement('div');
				elm.appendChild(currentSlide);
			}
			if(this.options.uri[count-1] == ''){
			var nextSlide = $(document.createElement('div'));
			nextSlide.className = 'slide-image';
			//nextSlide.style.backgroundImage = 'url('+next.src+')';
			nextSlide.setOpacity(0);
			elm.appendChild(nextSlide);
			var tbl     = document.createElement("table");
        var tblBody = document.createElement("tbody");

       
		// creating all cells
        for (var j = 0; j < 1; j++) {
            // creates a table row
            var row = document.createElement("tr");
			
            for (var i = 0; i < 2; i++) {
                // Create a <td> element and a text node, make the text
                // node the contents of the <td>, and put the <td> at
                // the end of the table row
                var cell = document.createElement("td");
				cell.className = 'slide-image2';
               
				if(i==0){
					
               // cell.appendChild(cellText);
					var image = document.createElement('img');
					var str = this.options.uri[count-3];
					//alert(str);
					str1 = str.replace("before.", "before_thumb.");
					image.src=str1;
					
					 var cellText = document.createTextNode("Before");
					
                
				}
				if(i==1){					 
                //cell.appendChild(cellText);
					
					var image = document.createElement('img');
					var str2 = this.options.uri[count-2];
					//alert(str);
					str3 = str2.replace("after.", "after_thumb.");
					image.src=str3;
					var cellText = document.createTextNode("After");
				}
				
				cell.appendChild(image);
				cell.appendChild(document.createElement('br'));
                cell.appendChild(cellText);
                row.appendChild(cell);
            }

            // add the row to the end of the table body
            tblBody.appendChild(row);
        }

        // put the <tbody> in the <table>
        tbl.appendChild(tblBody);
        // appends <table> into <body>
        nextSlide.appendChild(tbl);
        // sets the border attribute of tbl to 2;
        
			
			new Effect.Parallel([new Effect.Fade(currentSlide,{sync:true}),
				new Effect.Appear(nextSlide,{sync:true})],
				{duration: opt.duration, fps: opt.fps, afterFinish : function() {Element.remove(currentSlide)}}
			);}else{
				var nextSlide = $(document.createElement('div'));
			nextSlide.className = 'slide-image';
			nextSlide.style.backgroundImage = 'url('+next.src+')';
			nextSlide.setOpacity(0);
			elm.appendChild(nextSlide);
			new Effect.Parallel([new Effect.Fade(currentSlide,{sync:true}),
				new Effect.Appear(nextSlide,{sync:true})],
				{duration: opt.duration, fps: opt.fps, afterFinish : function() {Element.remove(currentSlide)}}
			);
				}
		} else {
			new Effect.Fade(elm, { 
				duration: opt.duration, 
				fps: opt.fps, 
				afterFinish: function() {
					elm.style.backgroundImage = 'url('+next.src+')';
					new Effect.Appear(elm, {
							duration: opt.duration,
							fps: opt.fps,
							queue:'end'
					});
				} 
			})
		}
	}
};