/**
* jquery.album 0.11. Making HTML elements scroll.
* 
* http://flowplayer.org/tools/album.html
*
* Copyright (c) 2008 Tero Piirainen (tero@flowplayer.org)
*
* Released under the MIT License:
* http://www.opensource.org/licenses/mit-license.php
* 
* >> Basically you can do anything you want but leave this header as is <<
*
* Since  : 0.01 - 03/01/2008
* Version: 0.11 - 05/20/2008
*/
(function ($) {
    $.fn.extend({ album: function (arg1, arg2, arg3) { return this.each(function () { if (typeof arg1 == "string") { var el = $.data(this, "album"); el[arg1].apply(el, [arg2, arg3]); } else { new $.album(this, arg1, arg2); } }); } }); $.album = function (el, opts) { $.data(el, "album", this); this.init(el, opts); }; $.extend($.album.prototype, { init: function (el, config) {
        var self = this; var opts = { size: 5, horizontal: false, activeClass: 'active', speed: 300, onSeek: null, items: '.items', prev: '.prev', next: '.next', navi: '.navi', naviItem: 'span' }; this.opts = $.extend(opts, config); var root = this.root = $(el); var itemRoot = $(opts.items, root); if (!itemRoot.length) itemRoot = root; itemRoot.css({ position: 'relative', overflow: 'hidden', visibility: 'visible' }); itemRoot.children().wrapAll('<div class="__album" style="position:absolute"/>'); this.wrap = itemRoot.children(":first"); this.wrap.css(opts.horizontal ? "width" : "height", "200000em").after('<br clear="all"/>'); this.items = this.wrap.children(); this.index = 0; if (opts.horizontal) { itemRoot.width(opts.size * (this.items.eq(1).offset().left - this.items.eq(0).offset().left) - 2); } else { itemRoot.height(opts.size * (this.items.eq(1).offset().top - this.items.eq(0).offset().top) - 2); }
        if ($.isFunction($.fn.mousewheel)) { root.bind("mousewheel.album", function (event, delta) { self.move(-delta, 50); return false; }); }
        $(window).bind("keypress.album", function (evt) {
            if ($(evt.target).parents(".__album").length) {
                if (opts.horizontal && (evt.keyCode == 37 || evt.keyCode == 39)) { self.move(evt.keyCode == 37 ? -1 : 1); return false; }
                if (!opts.horizontal && (evt.keyCode == 38 || evt.keyCode == 40)) { self.move(evt.keyCode == 38 ? -1 : 1); return false; } 
            }
            return true;
        }); this.items.each(function (index, arg) { $(this).bind("click.album", function () { self.click(index); }); }); this.activeIndex = 0; $(opts.prev, root).click(function () { self.prev() }); $(opts.next, root).click(function () { self.next() }); $(opts.navi, root).each(function () { var navi = $(this); var status = self.getStatus(); if (navi.is(":empty")) { for (var i = 0; i < status.pages; i++) { var item = $("<" + opts.naviItem + "/>").attr("page", i).click(function () { var el = $(this); el.parent().children().removeClass(opts.activeClass); el.addClass(opts.activeClass); self.setPage(el.attr("page")); }); if (i == 0) item.addClass(opts.activeClass); navi.append(item); } } else { navi.children().each(function (i) { var item = $(this); item.attr("page", i); if (i == 0) item.addClass(opts.activeClass); item.click(function () { item.parent().children().removeClass(opts.activeClass); item.addClass(opts.activeClass); self.setPage(item.attr("page")); }); }); } });
    }, click: function (index) { var item = this.items.eq(index); var klass = this.opts.activeClass; if (!item.hasClass(klass) && (index >= 0 || index < this.items.size())) { var prev = this.items.eq(this.activeIndex).removeClass(klass); item.addClass(klass); this.seekTo(index - Math.floor(this.opts.size / 2)); this.activeIndex = index; } }, getStatus: function () { var len = this.items.size(); var s = { length: len, index: this.index, size: this.opts.size, pages: Math.round(len / this.opts.size), page: Math.round(this.index / this.opts.size) }; return s; }, seekTo: function (index, time) {
        if (index < 0) index = 0; index = Math.min(index, this.items.length - this.opts.size); var item = this.items.eq(index); if (item.size() == 0) return false; this.index = index; if (this.opts.horizontal) { var left = this.wrap.offset().left - item.offset().left; this.wrap.animate({ left: left }, time || this.opts.speed); } else { var top = this.wrap.offset().top - item.offset().top; this.wrap.animate({ top: top }, time || this.opts.speed); }
        if ($.isFunction(this.opts.onSeek)) { this.opts.onSeek.call(this.getStatus()); }
        var navi = $(this.opts.navi, this.root); if (navi.length) { var klass = this.opts.activeClass; var page = Math.round(index / this.opts.size); navi.children().removeClass(klass).eq(page).addClass(klass); }
        return true;
    }, move: function (offset, time) { this.seekTo(this.index + offset, time); }, next: function (time) { this.move(1, time); }, prev: function (time) { this.move(-1, time); }, movePage: function (offset, time) { this.move(this.opts.size * offset, time); }, setPage: function (index, time) { this.seekTo(this.opts.size * index, time); }, begin: function (time) { this.seekTo(0, time); }, end: function (time) { this.seekTo(this.items.size() - this.opts.size, time); } 
    });
})(jQuery);

$(document).ready(function () {
    $("#album").album({ items: '.items', horizontal: true, size: 2 });
    $("#album").album("begin");
});