$("document").ready(function(){
    // core Display object
    var Display = function(pages){
        this._init = function(pages){
            this.page = 0;

            // create page url and thumbnail dictionaries:
            this.urls = {};
            this.thumbs = {};
            page_array = pages.map(function(){
                page = $(this);
                return {'element': page, 'url': page.attr('href')};
            }).get();
            for (var i in page_array) {
                p = page_array[i];
                this.urls[i] = p.url;
                this.thumbs[i] = p.element;
                // add page numbers and urls to thumbnails:
                p.element.data({'page': i, 'url': p.url});
            };

            // set up display buffers
            this.buffer = $('#display_area div.buffer');
            this.active = $('#display_area div.active');
        };
        this.getPage = function(){
            // get active page
            return this.page;
        };
        this.update = function() {
            this.buffer.fadeIn(400);
            this.active.fadeOut(400);
            tmp = this.active;
            this.active = this.buffer;
            this.buffer = tmp;
        };
        this.turn = function(page){
            // dim last active thumbnail
            this.thumbs[this.page].removeClass('active');

            // highlight active thumbnail:
            this.thumbs[page].addClass('active');

            // turn page:
            this.page = page - 0; // force conversion to int
            this.buffer.find('img').attr('src', this.urls[page]);
            this.update();
        };
        this.next = function(){
            this.turn(this.page + 1);
        };
        this.prev = function(){
            this.turn(this.page - 1);
        };

        this._init(pages);
        this.turn(0);
        return this;
    };

    display = new Display($('#sidebar div.pages a'));

    // bind actions
    $('#next').click(function(){
        display.next();
        return false;
    });
    $('#prev').click(function(){
        display.prev();
        return false;
    });
    $('#sidebar div.pages a').click(function(){
        display.turn($(this).data('page'));
        return false;
    });
});