/*
        SlideItMoo v1.0 - Image slider
        (c) 2007-2008 Constantin Boiangiu <http://www.php-help.ro>
        MIT-style license.
*/
var SlideItMoo = new Class({

        initialize: function(options){
                this.options = $extend({
                        itemsVisible:2,
                        showControls:1,
                        autoSlide: 0,
                        transition: Fx.Transitions.linear,
                        currentElement: 0,
                        thumbsContainer: 'thumbs',
                        elementScrolled: 'thumb_container',
                        overallContainer: 'gallery_container'
                },options || {});

                this.images = $(this.options.thumbsContainer).getElements('a');
                // assumes that all thumbnails have the same width
                this.image_size = this.images[0].getSize();

                // resizes the container div's according to the number of itemsVisible thumbnails
                this.setContainersSize();

                this.myFx = new Fx.Scroll(this.options.elementScrolled,{ transition: this.options.transition });
                // adds the forward-backward buttons
                if( this.images.length > this.options.itemsVisible ){
                        this.fwd = this.addControlers('addfwd');
                        this.forward();
                        this.bkwd = this.addControlers('addbkwd');
                        this.backward();

                        /* if autoSlide is not set, scoll on mouse wheel */
                        if( !this.options.autoSlide ){
                                $(this.options.thumbsContainer).addEvent('mousewheel', function(ev){
                                        new Event(ev).stop();
                                        ev.wheel < 0 ? this.fwd.fireEvent('click') : this.bkwd.fireEvent('click');
                                }.bind(this));
                        }
                        else{
                                this.startIt = function(){ this.fwd.fireEvent('click') }.bind(this);
                                this.autoSlide = this.startIt.periodical(this.options.autoSlide, this);
                                this.images.addEvents({
                                        'mouseover':function(){
                                                $clear(this.autoSlide);
                                        }.bind(this),
                                        'mouseout':function(){
                                                this.autoSlide = this.startIt.periodical(this.options.autoSlide, this);
                                        }.bind(this)
                                })
                        }
                };

                // if there's a specific default thumbnail to start with, slide to it
                if( this.options.currentElement != 0 ){
                        this.options.currentElement-=1;
                        this.slide(1);
                }
        },

        setContainersSize: function(){

                $(this.options.overallContainer).set({
                        styles:{
                                'width': this.options.itemsVisible * this.image_size.x + 35*this.options.showControls + (this.options.itemsVisible-1)*3
                        }
                });
                $(this.options.elementScrolled).set({
                        styles:{
                                'width': this.options.itemsVisible * this.image_size.x + (this.options.itemsVisible-1)*10
                        }
                });
        },

        forward: function(){
                this.fwd.addEvent('click',function(){
                        this.slide(1);
                }.bind(this));
        },

        backward: function(){
                this.bkwd.addEvent('click',function(){
                        this.slide(-1);
                }.bind(this))
        },

        addControlers: function(cssClass){
                element = new Element('div',{
                        'class': cssClass,
                        styles:{
                                'display': this.options.showControls ? '' : 'none'
                        }
                }).injectInside($(this.options.overallContainer));
                return element;
        },

        slide: function(step){

                this.options.currentElement += step*this.options.itemsVisible;
                this.myFx.toElement( this.images[this.options.currentElement]);


                /* if autoslice is on, when end is reached, go back to begining */
                if(this.options.autoSlide && this.options.currentElement >= this.images.length-this.options.itemsVisible ){
                    this.options.currentElement = -1;
                }

              /*

                this.myFx.cancel();
                this.options.currentElement += step;
                console.log('current ' + this.options.currentElement);
                this.myFx.toElement( this.images[this.options.currentElement]);

                console.log('current ' + this.options.currentElement);
                console.log((this.images.length));
                */

               
                /*
                if ( ( this.options.currentElement < this.images.length-this.options.itemsVisible && step>0 ) || ( step < 0 && this.options.currentElement !== 0 ) ){
                    this.myFx.cancel();
                    this.options.currentElement += step;
                    this.myFx.toElement( this.images[this.options.currentElement] );
                }
                */
                


		if((this.options.currentElement == (this.images.length/this.options.itemsVisible)) || this.images.length==this.options.itemsVisible){
                    $$('div.addfwd').setStyle('display','none');
		} else {
                    $$('div.addfwd').setStyle('display','block');
		}
		if(this.options.currentElement === 0 || this.images.length==this.options.itemsVisible){
                    $$('div.addbkwd').setStyle('display','none');
		} else {
                    $$('div.addbkwd').setStyle('display','block');
		}


        }
})