// JavaScript Document


		//toc[currentIndex].removeClass(tocActive);
		//var nextIndex = ($defined(to)) ? currentIndex + 1 : to;	
		//currentIndex = (nextIndex < slides.length) ? nextIndex : 0;
		//toc[currentIndex].addClass(tocActive);

var SimpleSlideshow = new Class({
	options: {
		showControls: true,
		showDuration: 7000,
		showTOC: true,
		tocWidth: 20,
		tocClass: 'toc',
		tocActiveClass: 'toc-active'
	},
	Implements: [Options,Events],
	initialize: function(slider,container,elements,thumbs,options) {
		//settings
		this.slider = $(slider);
		this.container = $(container);
		this.elements = $$(elements);
		this.currentIndex = 0;
		this.interval = '';
		this.status = 'play';
		if(this.options.showTOC) this.toc = $$(thumbs);
		
		//assign
		this.elements.each(function(el,i){
			if(this.options.showTOC) {
				this.toc[i].addEvent('click', function(e) {
					if(e) e.stop();
					this.stop();
					this.show(i);
					if (this.status == 'play') this.start();
				}.bind(this));
			}
		},this);
		
		//next,previous links
		if(this.options.showControls) {
			this.createControls();
		}

	},
	show: function(to) {
		if(this.options.showTOC) {
			this.toc[this.currentIndex].removeClass(this.options.tocActiveClass);
			//this.toc[this.currentIndex].set('html', '<img src="/images/slide-off.png" height="12" width="12" alt="View This Slide">');
		}
		var nextIndex = ($defined(to)) ? to : this.currentIndex + 1;	
		this.currentIndex = (nextIndex < this.elements.length) ? nextIndex : 0;
		this.container.set('tween', {duration: 'short'});
		this.container.tween('margin-left', -(this.currentIndex * 960));
		if(this.options.showTOC) {
			this.toc[this.currentIndex].addClass(this.options.tocActiveClass);
			//this.toc[this.currentIndex].set('html', '<img src="/images/slide-on.png" height="12" width="12" alt="View This Slide">');
		}
	},
	start: function() {
		this.interval = this.show.bind(this).periodical(this.options.showDuration);
	},
	stop: function() {
		$clear(this.interval);
	},
	//"private"
	createControls: function() {
		var next = new Element('a',{
			href: '#',
			id: 'next',
			'html' : '<img src="/images/slide-next.png" height="46" width="42" alt="Next Slide">',
			//text: '>>',
			events: {
				click: function(e) {
					if(e) e.stop();
					this.stop(); 
					this.show();
					if (this.status == 'play') this.start();
				}.bind(this)
			}
		}).inject(this.slider);
		
		var previous = new Element('a',{
			href: '#',
			id: 'previous',
			'html' : '<img src="/images/slide-prev.png" height="46" width="42" alt="Next Slide">',
			//text: '<<',
			events: {
				click: function(e) {
					if(e) e.stop();
					this.stop(); 
					this.show(this.currentIndex != 0 ? this.currentIndex -1 : this.elements.length-1);
					if (this.status == 'play') this.start();
				}.bind(this)
			}
		}).inject(this.slider);
		
		/*var pause = new Element('a',{
			href: '#',
			id: 'pause',
			'html' : '<img src="/images/slide-pause.png" height="27" width="27" alt="Pause">',
			//text: '<<',
			events: {
				click: function(e) {
					if(e) e.stop();
					if (this.status == 'play') {
						$('pause').set('html', '<img src="/images/slide-play.png" height="27" width="27" alt="Play">');
						this.status = 'paused';
						this.stop(); 
					} else {
						$('pause').set('html', '<img src="/images/slide-pause.png" height="27" width="27" alt="Pause">');
						this.status = 'play';
						this.start();	
					}
				}.bind(this)
			}
		}).inject(this.slider);*/
		
		
	}
});