var FeaturedCarousel = new Class({
    Implements: [Options],
    options: {
        requestUrl: '/shop/ajax/featured_items/'
    },
    initialize: function(el, options) {
        this.setOptions(options);
        this.el = $(el);
        this.prev = this.el.getElement('.prev-page-icon');
        this.next = this.el.getElement('.next-page-icon');
        this.inner = this.el.getElement('.carousel-inner');
        this.page = 1;
        this.max = -1;
        this.request = new Request.JSON({
            'url': this.options.requestUrl,
            'link': 'cancel'
        });
        this.request.addEvent('success', this.completed.bind(this));
        this.setupButtons();
    },
    setupButtons: function() {
        var self = this;
        this.prev.addEvent('click', function(ev) {
            ev.stop();
            self.page = self.page == 1? self.max : self.page - 1;
            self.request.get({'page': self.page});
        });
        this.next.addEvent('click', function(ev) {
            ev.stop();
            self.page = self.page == self.max? 1 : self.page + 1;
            self.request.get({'page': self.page});
        });
    },
    completed: function(json) {
        this.max = json['count'];
        this.page = json['page'];
        this.inner.empty().set('html', json['html']);
    }
    
});

