var deGallery = Class.create({
        frequency: 3,
        loop: true,
        pagesize: 10,
        timer: null,
        loading: 'Loading...',
        pageBack: '«',
        pageNext: '»',
        imageBack: '‹',
        imageNext: '›',
        playButton: 'Play',
        customClassPrefix: '',
        customClassSuffix: '',
        
        
        initialize: function(container, data, options){
            for(var key in options){
                if(typeof(options[key]) == 'string'){
                    value = '\'' + options[key] + '\'';
                }else{
                    value = options[key];
                }
                eval('this.' + key + '=' + value +';');
            }
            this.container = $(container);
            this.data = data;
            this.current = 0;
            this.currentpage = 0;
            this.timer = null;
            this.direction = 'forward';
            this.screen = this.createScreen();
            this.caption = this.createCaption();
            this.control = this.createControl();
            this.createImage();
        },
        
        createScreen: function(){
            var el = new Element('div');
            el.addClassName(this.customClassPrefix + 'deGalleryScreen' + this.customClassSuffix);
            this.container.appendChild(el);
            return el;
        },
        
        createImage: function(){
            if(this.data[this.current].url == ''){
                this.screen.innerHTML = '<img src="' + this.data[this.current].image  + '" alt="' + this.data[this.current].caption  + '" />';
            }else{
                this.screen.innerHTML = '<a href="' + this.data[this.current].url  + '"><img src="' + this.data[this.current].image  + '" alt="' + this.data[this.current].caption  + '" /></a>';
            }
        },
        
        createControl: function(){
            var el = new Element('div');
            el.addClassName(this.customClassPrefix + 'deGalleryControl' + this.customClassSuffix);
            el.innerHTML = '<span class="' + this.customClassPrefix + 'deGalleryLoading' + this.customClassSuffix + '">' + this.loading + '</span>';
            this.container.appendChild(el);
            return el;
        },
        
        createCaption: function(){
            var el = new Element('div');
            el.addClassName(this.customClassPrefix + 'deGalleryCaption' + this.customClassSuffix);
            el.innerHTML = this.data[this.current].caption;
            this.container.appendChild(el);
            return el;
        },
        
        createPlayButton: function(){
//            var el = new Element('div');
            var el = new Element('a');
            el.writeAttribute('href', 'javascript:void(0);');
            el.addClassName(this.customClassPrefix + 'deGalleryPlayButton' + this.customClassSuffix);
            el.innerHTML = this.playButton;
            el.observe('click', function(){this.playSlideshow();}.bind(this));
            this.control.appendChild(el);
            return el;
        },
        
        createFalsePlayButton: function(){
//            var el = new Element('div');
            var el = new Element('a');
            el.writeAttribute('href', 'javascript:void(0);');
            el.addClassName(this.customClassPrefix + 'deGalleryFalsePlayButton' + this.customClassSuffix);
            el.style.visibility = 'hidden';
            el.innerHTML = this.playButton;
//            el.observe('click', function(){this.playSlideshow();}.bind(this));
            this.control.appendChild(el);
            return el;
        },
        
        createPageBack: function(){
//            var el = new Element('div');
            var el = new Element('a');
            el.writeAttribute('href', 'javascript:void(0);');
            el.addClassName(this.customClassPrefix + 'deGalleryPageBack' + this.customClassSuffix);
            el.innerHTML = this.pageBack;
            el.observe('click', function(){this.gotoPageBack();}.bind(this));
            this.control.appendChild(el);
        },
        
        createPageNext: function(){
//            var el = new Element('div');
            var el = new Element('a');
            el.writeAttribute('href', 'javascript:void(0);');
            el.addClassName(this.customClassPrefix + 'deGalleryPageNext' + this.customClassSuffix);
            el.innerHTML = this.pageNext;
            el.observe('click', function(){this.gotoPageNext();}.bind(this));
            this.control.appendChild(el);
        },
        
        createImageNext: function(){
//            var el = new Element('div');
            var el = new Element('a');
            el.writeAttribute('href', 'javascript:void(0);');
            el.addClassName(this.customClassPrefix + 'deGalleryImageNext' + this.customClassSuffix);
            el.innerHTML = this.imageNext;
            el.observe('click', function(){this.gotoImageNext();}.bind(this));
            this.control.appendChild(el);
        },
        
        createImageBack: function(){
//            var el = new Element('div');
            var el = new Element('a');
            el.writeAttribute('href', 'javascript:void(0);');
            el.addClassName(this.customClassPrefix + 'deGalleryImageBack' + this.customClassSuffix);
            el.innerHTML = this.imageBack;
            el.observe('click', function(){this.gotoImageBack();}.bind(this));
            this.control.appendChild(el);
        },
        
        addIndicator: function(index, active){
            var kludge = new Element('a');
            kludge.addClassName(this.customClassPrefix + 'deGalleryIndicator' + this.customClassSuffix);
            kludge.writeAttribute('href', 'javascript:void(0);');
            if(active){ 
                kludge.addClassName(this.customClassPrefix + 'deGalleryIndicatorActive' + this.customClassSuffix); 
            }
            var el = new Element('span');
            /*
            el.addClassName(this.customClassPrefix + 'deGalleryIndicator' + this.customClassSuffix);
            if(active){ 
                el.addClassName(this.customClassPrefix + 'deGalleryIndicatorActive' + this.customClassSuffix); 
            }
            */
            el.innerHTML = index;
            kludge.observe('click', function(){this.jumpTo(index);}.bind(this));
      //      el.observe('click', function(){this.jumpTo(index);}.bind(this));
      //      this.control.insert({bottom:el});
            this.control.insert({bottom:kludge});
            kludge.insert({bottom:el});
        },
        
        destroyIndicators: function(){
            this.control.childElements().each(function(el){
                    Element.remove(el);
            });
        },
        
        jumpTo: function(index){
            this.current = index - 1;
            this.pause = true;
            this.advance();
        },
        
        gotoPageBack: function(){
            this.pause = true;
            if(this.currentpage > 0){
                this.current -= this.pagesize;
                this.advance();
            }
        },
        
        gotoPageNext: function(){
            this.pause = true;
            if(this.currentpage < Math.ceil(this.data.length / this.pagesize) - 1){
                if(this.current + this.pagesize * 1 < this.data.length -1){
                    this.current += this.pagesize * 1
                }else{
                    this.current += (this.data.length - 1 - this.current) * 1;
                }
                this.advance();
            }
        },

        gotoImageNext: function(){
            this.pause = true;
            if(this.current < this.data.length - 1){
                this.current++;
                this.advance();
            }
        },
        
        gotoImageBack: function(){
            this.pause = true;
            if(this.current > 0){
                this.current--;
                this.advance();
            }
        },
        
        playSlideshow: function(){
            this.pause = false;
            if(this.current >= this.data.length - 1){
                this.current = 0;
                this.currentpage = 0;
            }
            this.advance();
        },

        display: function(){
            if(this.data.length < this.pagesize){
                this.pagesize = this.data.length;
            }
            if(this.current >= this.pagesize * this.currentpage + this.pagesize * 1){
                    this.currentpage++;
            }
            if(this.currentpage > 0 && this.current < (this.pagesize * this.currentpage)){
                    this.currentpage--;
            }
            this.destroyIndicators();
            
            this.createPageBack();
            this.createImageBack();
            this.createFalsePlayButton();
            this.createPageNext();
            this.createImageNext();
            var playbutton = this.createPlayButton();
//            if(this.pause && this.current < this.data.length - 1){
            if(this.pause){
                playbutton.style.visibility = 'visible';
            }else{
                playbutton.style.visibility = 'hidden';
            }

            for(var i = 0; i < this.pagesize && i < this.data.length; i++){
                if(i + (this.currentpage * this.pagesize) == this.current){
                    this.addIndicator(i + (this.currentpage * this.pagesize) + 1, true);
                }else if((i + (this.currentpage * this.pagesize)) < this.data.length){
                    this.addIndicator(i + (this.currentpage * this.pagesize) + 1, false);
                }
            }
            
            this.control.insert({bottom: '<div style="clear: both; width: 0px; height: 0px;"></div>'});
            if((!this.loop && this.current >= this.data.length - 1) || this.pause == true){
                this.stop();
                playbutton.style.visibility = 'visible';
            }else{
                this.timer = setTimeout(this.fadeout.bind(this), this.frequency * 1000);
            }
        },

        advance: function(){
            if(this.data[this.current].url == ''){
                this.screen.innerHTML = '<img src="' + this.data[this.current].image  + '" alt="' + this.data[this.current].caption  + '" />';
            }else{
                this.screen.innerHTML = '<a href="' + this.data[this.current].url  + '"><img src="' + this.data[this.current].image  + '" alt="' + this.data[this.current].caption  + '" /></a>';
            }
            this.caption.innerHTML = this.data[this.current].caption;            
            this.display();
        },
        
        fadeout: function(){
            if(this.screen.firstDescendant().nodeName == 'A'){
                Effect.Fade(this.screen.firstDescendant().firstDescendant(), { duration: 1, from:1.0, to:0.0 });
            }else{
                Effect.Fade(this.screen.firstDescendant(), { duration: 1, from:1.0, to:0.0 });
            }
            this.timer = setTimeout(this.fadein.bind(this), 1000);
        },
        
        fadein: function(){
            if(this.current + 1 * 1 >= this.data.length){
                this.current = -1;
                this.currentpage = 0;
            }
            this.current++;

            if(this.data[this.current].url == ''){
                this.screen.innerHTML = '<img src="' + this.data[this.current].image  + '" alt="' + this.data[this.current].caption  + '" />';
            }else{
                this.screen.innerHTML = '<a href="' + this.data[this.current].url  + '"><img src="' + this.data[this.current].image  + '" alt="' + this.data[this.current].caption  + '" /></a>';
            }
            
            this.caption.innerHTML = this.data[this.current].caption;
            this.display();
            
            if(this.screen.firstDescendant().nodeName == 'A'){
                this.screen.firstDescendant().firstDescendant().hide();
                Effect.Appear(this.screen.firstDescendant().firstDescendant(), { duration: 1, from:0.0, to:1.0 });
            }else{
                this.screen.firstDescendant().hide();
                Effect.Appear(this.screen.firstDescendant(), { duration: 1, from:0.0, to:1.0 });
            }

            
        },

        start: function(){
            this.direction = 'forward';
            this.pause = false;
//            this.timer = setTimeout(this.advance.bind(this), this.frequency * 1000);
            this.display();
        },
        
        stop: function(){
            clearTimeout(this.timer);
            this.timer = null;
        }
});