Slider = new Class({
	
	Implements: Options,
		
	options: {
		nextText: 'Next',
		prevText: 'Previous',
		transitionTime: 250,
		transition: 'quad',
		initialisedClass: 'active',
		cssClass: 'slider',
		windowSize: 800
	},
	
	Binds: [
		'slideToElement',
		'checkTagName',
		'slide'
	],
	
	className: 'Slider',
		
	initialize:function(id, options){
		this.setOptions(options);
		if(window.getSize().x > this.options.windowSize){
			
			// Elements
			this.slider = $(id);
			//console.log(this.slider);
			this.slider.addClass(this.options.cssClass+'-'+this.options.initialisedClass);
			this.slideContainer = this.slider.getElement('.'+this.options.cssClass+'-wrapper');
			this.slides = this.slideContainer.getChildren('.column');
			
			// don't configure as slider if there isn't more than one panel
			if(this.slides.length > 1){
				
				this.containerWidth = 0;
				
				// Slides
				this.slides.each(function(slide, index){
					
					if(!slide.hasClass('clear')){
						//slide.setStyle('width',this.slideWidth-40);
						//console.log(slide);
						this.containerWidth += (slide.getComputedSize().totalWidth.toInt() + slide.getStyle('margin-left').toInt() + slide.getStyle('margin-right').toInt());
						
						/*var slideFx = new Fx.Tween(slide, {property:'opacity'});
						if(index > 0){
							slideFx.set(0.4)
						}
						slide.store('slideFx', slideFx);*/
						
						// special handling of vertical scroll within horizontal scroll
						if(slide.hasClass('slider-vertical')){
							console.log(slide);
							slide.addClass('slider-vertical-active');
							var wrapper = new Element('div',{
								'class':'slider-vertical-wrapper'
							});
							var slideChildren = slide.getChildren();
							wrapper.inject(slide,'top');
							wrapper.adopt(slideChildren);
							
							console.log(wrapper);
							//set inner scroll height to total height of all elements
							//set height to first child (or element in location.hash)
							slide.setStyle('height',slideChildren[0].getComputedSize().totalHeight.toInt());
							
							//add tween to fade out and in next and previous
							this.verticalScrollFx = new Fx.Scroll(slide, {duration: this.options.transitionTime, transition:this.options.transition});
							this.verticalScrollTween = new Fx.Tween(slide,{
								property:'height'
							})
							//console.log(this.verticalScrollFx);
						}
						
					}
				}.bind(this));
				
				this.slideContainer.setStyle('width',this.containerWidth);
				this.index = 0;
				
				// FX
				this.scrollFx = new Fx.Scroll(this.slider, {duration: this.options.transitionTime, transition:this.options.transition});
				if(window.location.hash){
					this.hash = window.location.hash.replace('#','');
	    	
			    	if($(this.hash)){
			    		element = $(this.hash);
			    		this.scrollFx.toElementEdge(element, 'x');
	
			    		if(this.verticalScrollFx && this.verticalScrollFx.element.contains(element)){
			    			this.verticalScrollTween.start(element.getComputedSize().totalHeight.toInt()).chain(function(){
			    				this.verticalScrollFx.toElement(element, 'y');
			    			}.bind(this));
			    		}
			    	}
				}
				
				//this.heightFx = new Fx.Tween(this.slideContainer, {duration: this.options.transitionTime, transition:this.options.transition});
				//this.heightFx.set('height', this.slides[0].getComputedSize().totalHeight);
	
				/*this.controlNext = new Element('a', {'class':this.options.cssClass+'-controls-next'}).inject(this.slider, 'after');
				this.controlNext.addClass(this.options.cssClass+'-controls-'+this.options.initialisedClass);
				this.controlPrevious = new Element('a', {'class':this.options.cssClass+'-controls-previous'}).inject(this.slider, 'after');
				this.controlNext.addEvent('click', this.slideNext.bind(this));
				this.controlPrevious.addEvent('click', this.slidePrev.bind(this));*/
				
				this.slideContainer.getElements('a').each(function(link){
					//console.log(link.get('href'));
					if(link.get('href') && link.get('href').match(/#/)){
						link.addEvent('click',this.slideToElement);
					}		
				},this);
				
			}
		}else {
			this.slider = $(id);
			this.slider.removeClass(this.options.cssClass+'-'+this.options.initialisedClass);
			this.slideContainer = this.slider.getElement('.'+this.options.cssClass+'-wrapper');
			this.slideContainer.setStyle('width','auto');
			// remove any vertical slides
			$$('.slider-vertical').each(function(vertical){
				vertical.removeClass('slider-vertical-active');
				vertical.setStyle('height','auto');
			});
		};
	},
	
	slideNext:function(evt) {
        evt.preventDefault();
        console.log('slide next');
        this.slide(1, evt);
    }, 
    slidePrev:function(evt) {
        evt.preventDefault();
        console.log('slide previous');
        this.slide(-1, evt);
    },
    slide:function(move, evt){
    	this.checkTagName(evt.target);
    	if(this.target.hasClass(this.options.cssClass+'-controls-'+this.options.initialisedClass)){	        
	        // scroll to next increment	
	        //var index = Math.floor(this.slideContainer.getScroll().x / this.containerWidth);  	        
	        var newIndex = this.index + move;
			console.log(this.index +' => '+newIndex);
			console.log(this.slides[newIndex]);
	        //this.setupControls(newIndex);
	        this.index = newIndex;
	        this.scrollFx.toElement(this.slides[newIndex], 'x');
	        this.verticalScrollFx.toElement(this.slides[newIndex], 'x');
	        /*
	        this.heightFx.start('height', this.slides[newIndex].getComputedSize().totalHeight).chain(function(){
	        	this.slides[index].retrieve('slideFx').start(0);
	        	this.slides[newIndex].retrieve('slideFx').start(1);
	        	this.scrollFx.toElement(this.slides[newIndex], 'x');
	        }.bind(this));*/
			 
	    }
    },
    slideToElement:function(evt){
    	evt.preventDefault();
    	this.checkTagName(evt.target);

    	this.hash = this.target.get('href').replace('#','');
    	element = $(this.hash);
    	
    	if(element){
    		this.scrollFx.toElement(element, 'x');
    		if(this.verticalScrollFx && this.verticalScrollFx.element.contains(element)){
    			this.verticalScrollTween.start(element.getComputedSize().totalHeight.toInt()).chain(function(){
    				this.verticalScrollFx.toElement(element, 'y');
    			}.bind(this));
    		}
    	}
    },
    setupControls:function(newIndex) {

    	//this.controls.controlPrevious.removeClass(this.options.cssClass+'-controls-'+this.options.initialisedClass);
    	//this.controls.controlNext.removeClass(this.options.cssClass+'-controls-'+this.options.initialisedClass);
    	this.controlPrevious.removeClass(this.options.cssClass+'-controls-'+this.options.initialisedClass);
    	this.controlNext.removeClass(this.options.cssClass+'-controls-'+this.options.initialisedClass);
    	
    	if(newIndex > 0){
        	//this.controls.controlPrevious.addClass(this.options.cssClass+'-controls-'+this.options.initialisedClass);
        	this.controlPrevious.addClass(this.options.cssClass+'-controls-'+this.options.initialisedClass);	
        }
        if(newIndex < this.slides.length - 1){
        	//this.controls.controlNext.addClass(this.options.cssClass+'-controls-'+this.options.initialisedClass);
        	this.controlNext.addClass(this.options.cssClass+'-controls-'+this.options.initialisedClass);
        }
    },
    checkTagName:function(element){
		if(element.tagName != 'A'){
			this.checkTagName(element.getParent());
		}else {
			this.target = element;
		}    		
    } 
  
   
});