/* 
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */


Ext.ns('hf');

hf.ToggleCarousel = Ext.extend(Ext.util.Observable, {

    itemSelector: 'img',
    activeSlide: 0,
    nextButton: false,
    prevButton: false,
    slides : false,
    rootEl : false,
    activeItems : 3,

    constructor: function(root, config) {
        config = config || {};
        Ext.apply(this, config);

        //hf.ToggleCarousel.constructor.call(this, config);

        this.addEvents(
            'beforeprev',
            'prev',
            'beforenext',
            'next',
            'change',
            'play',
            'pause',
            'freeze',
            'unfreeze'
            );

        this.rootEl = Ext.get(root);

        this.slides = Ext.query(this.itemSelector);
        
        this.initMarkup();

        this.initEvents();
    },

    initMarkup: function() {
        
    },

    initEvents: function() {
        this.prevButton.on('click', this.prev.createDelegate(this));
        this.nextButton.on('click', this.next.createDelegate(this));
        this.refresh();
    },

    prev: function() {
        if (this.isPrevPossible()) {
            this.activeSlide--;
            var el = this.slides[this.activeSlide];
            Ext.get(el).removeClass('hidden');
            this.refresh();
        }
    },

    next: function() {
        if (this.isNextPossible()) {
            var el = this.slides[this.activeSlide];
            Ext.get(el).addClass('hidden');
            this.activeSlide++;
            this.refresh();
        }
    },

    refresh : function() {
        if (!this.isNextPossible()) {
            this.nextButton.addClass('disabled');
        }else {
            this.nextButton.removeClass('disabled');
        }
        // -------------------------------------------------------------
        if (this.isPrevPossible()) {
            this.prevButton.removeClass('disabled');
        }else {
            this.prevButton.addClass('disabled');
        }
    },

    isNextPossible : function() {
        var res = (this.activeItems + this.activeSlide) < this.slides.length;
        return res;
    },

    isPrevPossible : function() {
        var prev = (this.activeSlide > 0);
        return prev;
    }
    
});