Photos = Class.create();

Photos.prototype = {    
    options : {
        'page'      : 1,
        'total'     : 0,
        'step'      : 3,
        'pages'     : 0
    },
    
    start   : 0,
    end     : 2,
    current : 0,
    
    initialize : function(options) {
        Object.extend(this.options, options || {});
        this.options.pages = Math.ceil(this.options.total/this.options.step);
                
        $$('img[id^=thumbnail-]').each(function(e) {
            var img = new Image();
            img.src = e.src.replace('-small','');
        });
        
        /**
         * image scrollers
         */
        $$('.photo-gallery > a.scroll').each(function(element) {
            element.observe('click', function(event) {
                if (event.target.hasClassName('scr-right')) {
                    this.current  = this.current+1 > this.options.total-1 ? 0 : this.current+1;
                } else {
                    this.current  = this.current-1 < 0 ? this.options.total-1 : this.current-1;
                }
                this.updateMainImage();
                               
                this.markSelected();
                
                if (this.current > this.end) {
                    this.nextThumbs();
                } else if (this.current < this.start) {
                    this.prevThumbs();
                }                
            }.bind(this))
        }.bind(this))

        /**
         * thumbnails scrollers
         */
        $$('.photo-gallery > div > a.scroll').each(function(element) {
            element.observe('click', function(event) {                
                if (this.options.pages <= 1) {
                    return ;
                }
                if (element.hasClassName('scr-right')) {
                    this.nextThumbs();
                } else {
                    this.prevThumbs();
                }
            }.bind(this))
        }.bind(this))

        /**
         * thumbnails clicks
         */
        $$('img[id^=thumbnail-]').each(function(e) {
            e.observe('click', function(event) {
                event.stop();
                this.current = event.target.id.replace('thumbnail-','');
                this.updateMainImage();
                this.markSelected();
            }.bind(this))
        }.bind(this))
    },
 
    updateMainImage : function() {
        var img = new Image();
        //$('galery-main-image').src = '/img/ajax-loader.gif';
        img.onload = function() {                                   
            $('galery-main-image').src = ($('thumbnail-' + this.current )).src.replace('-small','');
        }.bind(this);
        img.src = ($('thumbnail-' + this.current )).src.replace('-small','');
    },
 
    markSelected : function() {
        $$('ul#thumbnails-list > li > a.selected').each(function(e) {
            e.className = '';
        })
        $('thumbnail-' + this.current).up().className = 'selected';
    },
 
    hideAllThumbs : function() {        
        $$('ul#thumbnails-list > li').each(function(e) {           
            Element.hide(e);
        })
    },
    
    getStartEndItems : function() {
        this.start = (this.options.page-1)*this.options.step;        
        this.end = (this.start + this.options.step)-1;        
        if (this.end > this.options.total) {
            this.end = this.options.total;
        }
    },
    
    prevThumbs : function() {
        if (this.options.page == 1) {
            this.options.page = this.options.pages;
        } else {
            this.options.page--;
        }
        
        this.getStartEndItems();
                
        this.hideAllThumbs();
        for (var i=this.start; i<=this.end; i++) {
            try {
                Element.show($('thumb-' + i));
            } catch (e) {};            
        }        
    },
    
    nextThumbs : function() {
        if (this.options.page < this.options.pages) {
            this.options.page++;
        } else {
            this.options.page = 1;
        }
        
        this.getStartEndItems();
        
        this.hideAllThumbs();
        for (var i=this.start; i<=this.end; i++) {        
            try {
                Element.show($('thumb-' + i));
            } catch (e) {};            
        }
    }    
}