(function(){
    var $ = document.id;


	this.Slider = new Class({

		Implements: [Options, Events],

		options:{
			start : 0,
			controlContainer: 'controls',
			slide_duration: 1000,
			slideWidth: 571,
			slideLength: 6000
		},

		initialize: function(images, text, options){
			this.setOptions(options);
			this.buildObject($$(images), $$(text));
			this.buildControls();

			this.start();
			this.slide();
			this.timer = this.slide.periodical(6000,this);
                        //this.timer = this.slide.periodical(6000, this);
                 	},

		start: function(){
			this.key = -1;
			this.total = this.slides.length;
			this.currentKey = 0;
		},

		buildObject: function(images, text){
			this.slides = [];
			images.each(function(image, key){
				var slide = [];
				slide['image'] = images[key];
				slide['text'] = text[key];

				this.slides.push(slide);
			}.bind(this));
		},

		buildControls: function(){
			this.controlsContainer = $(this.options.controlContainer);

			this.slides.each(function(slide, key){
				key = key + 1;
				var li = new Element('li');

				// Set initial control to be active.
				if(key == 1){
					li.addClass('on'); 
				}

				var a = new Element('a',{
					'href' : '#',
					'class' : key.toFriendly()
				}).set('text', key);

				var control = li.adopt(a);

				this.attachControl(control, key);

				slide['control'] = control;

				this.controlsContainer.adopt(control);

			}.bind(this));
		},

		attachControl: function(control, key){
			control.addEvent('click', function(){
				if(key - 1 != this.currentKey){
					this.slideTo(key - 1);
				}

				$clear(this.timer);

				return false;
			}.bind(this));
		},

		incrementKey: function(){
			if(this.key >= this.total - 1){
                               this.key = 0;
			}
			else{
				this.key += 1;
                                  
			}
		},

		// Used to grab the key before (or maybe after.)
		getKey: function(which){
			switch(which){
				case 'previous':
					if(this.key <= 0){
						return this.total - 1;
					}else{
						return this.key - 1;
					}
				break;
			}
		},

		slide: function(){
			
                        this.incrementKey();
			var old = this.getKey('previous');
			this.hideSlide(old);
			this.showSlide(this.key);
		},

		slideTo: function(slide){
			this.key = slide;

			var old = this.currentKey;
                        
                        
			this.hideSlide(old);
			this.showSlide(this.key);
                       
		},

		hideSlide: function(slide){
			var image = this.slides[slide]['image'];
			var text = this.slides[slide]['text'];
			var control = this.slides[slide]['control'];

			image.set('morph', {
				duration: this.options.slide_duration,
				onComplete: function(){
					image.setStyle('left', this.options.slideWidth+'px');
				}.bind(this)
			});

			image.morph({
				'opacity': 0,
				'left' : -200
			});

			text.set('tween', {duration:500});
			text.fade('out');

			control.removeClass('on');
		},

		showSlide: function(slide){
			var image = this.slides[slide]['image'];
			var text = this.slides[slide]['text'];
			var control = this.slides[slide]['control'];
			image.set('morph', {
				duration: this.options.slide_duration
                                 //  duration: 100
			});

			image.morph({
				'left': 0,
				'opacity' : 1
			});

			text.set('tween', {duration:1000});
			text.setStyle('opacity', '0').show().fade('in');

			control.addClass('on');
			this.currentKey = slide;
		}
	});
	
	
})();

