/**

 * jquery.scrollable 0.13. Put your HTML scroll.

 * 

 * http://flowplayer.org/tools/scrollable.html

 *

 * Copyright (c) 2008 Tero Piirainen (support@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.10 - 03/01/2008

 * Version: 0.13 - Wed Nov 05 2008 12:04:04 GMT-0000 (GMT+00:00)

 */

(function($) {

		

	// constructor

	function Scrollable(el, config) {   

		

		// current instance

		var self = this;  

		

		if (!Scrollable.current) {

			Scrollable.current = this;	

		}

		

		var opts = {								

			size: 5,

			vertical:false,				

			activeClass:'active',

			speed: 300,

			onSeek: null,

			clickable: true,

			

			// jquery selectors

			items: '.items',

			prev:'.prev',

			next:'.next',

			navi:'.navi',

			naviItem:'span', 

			loop: false

		}; 



		

		this.opts = $.extend(opts, config);  

		this.opts.horizontal = !opts.vertical;

		

		// root / itemRoot

		this.root = $(el);

		var root = this.root;

		var itemRoot = $(opts.items, root);			

		if (!itemRoot.length)  { itemRoot = root; }  

		

		

		// wrap itemRoot.children() inside container

		itemRoot.css({position:'relative', overflow:'hidden', visibility:'visible'});

		itemRoot.children().wrapAll('<div class="__scrollable" style="position:absolute"/>'); 

		

		this.wrap = itemRoot.find(":first");

		this.wrap.css(opts.horizontal ? "width" : "height", "200000em").after('<br clear="all" />');		

		this.items = this.wrap.children();

		this.index = 0;



		

		// set dimensions based on offsets of the two first elements

		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);	

		} 



		// mousewheel

		if ($.isFunction($.fn.mousewheel)) { 

			root.bind("mousewheel.scrollable", function(e, delta)  { 

				self.move(-delta, 50);		

				return false;

			});

		}  

		

		// item.click()

		if (opts.clickable) {

			this.items.each(function(index, arg) {

				$(this).bind("click.scrollable", function() {

					self.click(index);		

				});

			});				

		}





		this.activeIndex = 0;

		

		// prev

		$(opts.prev, root).click(function() { 

			self.prev(); 

		});

		



		// next

		$(opts.next, root).click(function() { 

			self.next(); 

		});

		



		// navi 			

		$(opts.navi, root).each(function() { 				

			var navi = $(this);

			

			var status = self.getStatus();

			

			// generate new entries

			if (navi.is(":empty")) {

				for (var i = 0; i < status.pages; i++) {		

					

					var item = $("<" + opts.naviItem + "/>").attr("page", i).click(function(e) {							

						var el = $(this);

						el.parent().children().removeClass(opts.activeClass);

						el.addClass(opts.activeClass);

						self.setPage(el.attr("page"));

						e.preventDefault();

					});

					

					if (i === 0) { item.addClass(opts.activeClass); }

					navi.append(item);					

				}

				

			// assign onClick events to existing entries

			} else {

				

				// find a entries first -> syntaxically correct

				var els = navi.find("a");

				

				if (!els.length) { 

					els = navi.children(); 

				}

				

				els.each(function(i)  {

					var item = $(this);

					item.attr("page", i);

					if (i === 0) { item.addClass(opts.activeClass); }

					

					item.click(function() {

						navi.find("." + opts.activeClass).removeClass(opts.activeClass);

						item.addClass(opts.activeClass);

						self.setPage(item.attr("page"));

					});

					

				});

			}

			

		});			

	} 

	

	

	// methods

	$.extend(Scrollable.prototype, {  

			

			

		getVersion: function() {

			return '@VERSION';	

		},



		click: function(index) {

			

			var item = this.items.eq(index);

			var klass = this.opts.activeClass;			

			

			if (!item.hasClass(klass) && (index >= 0 || index < this.items.size())) {				

				this.items.removeClass(klass);

				item.addClass(klass);

				var delta = Math.floor(this.opts.size / 2);

				var to = index - delta;



				if (to !== this.activeIndex) {

					this.seekTo(to);		

				}				 

			} 

		},

		

		

		getStatus: function() {

			var len =  this.items.size();

			return {

				size: this.opts.size,

				total: len, 

				index: this.index,  

				pages: Math.ceil(len / this.opts.size),

				page: Math.ceil(this.index / this.opts.size)

			};

		}, 



		

		// all other seeking functions depend on this generic seeking function		

		seekTo: function(index, time) {

			

			if (index < 0) { index = 0; }

			var max = Math.min(index, this.items.length - this.opts.size);  			

			

			if (index <= max) { 

				

				var item = this.items.eq(index);			

				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);							

				}

				

				Scrollable.current = this; 

			} 

			



			// custom onSeek callback

			if ($.isFunction(this.opts.onSeek)) {

				this.opts.onSeek.call(this);

			}

			

			// navi status update

			var navi = $(this.opts.navi, this.root);

			

			if (navi.length) {

				var klass = this.opts.activeClass;

				var page = Math.ceil(index / this.opts.size);

				page = Math.min(page, navi.children().length - 1);

				navi.children().removeClass(klass).eq(page).addClass(klass);

			} 

			

			this.activeIndex = index;			

			return true; 

		},

		

			

		move: function(offset, time) {

			var to = this.index + offset;

			if (this.opts.loop && to > (this.items.length - this.opts.size)) {

				to = 0;	

			}

			this.seekTo(to, 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(page, time) {

			var size = this.opts.size;

			var index = size * page;

 			var lastPage = index + size >= this.items.size(); 

			if (lastPage) {

				index = this.items.size() - this.opts.size;

			}

			this.seekTo(index, time);

		},

		

		prevPage: function(time) {

			this.setPage(this.getStatus().page - 1, time);

		},  



		nextPage: function(time) {

			this.setPage(this.getStatus().page + 1, time);

		}, 

		

		begin: function(time) {

			this.seekTo(0, time);	

		},

		

		end: function(time) {

			this.seekTo(this.items.size() - this.opts.size, time);	

		}

		

	});  

	

	

	

	// keyboard

	$(window).bind("keypress.scrollable", function(evt) {

		

		var el = Scrollable.current;	

		if (!el) { return; }

			

		if (el.opts.horizontal && (evt.keyCode == 37 || evt.keyCode == 39)) {

			el.move(evt.keyCode == 37 ? -1 : 1);

			return evt.preventDefault();

		}	

		

		if (!el.opts.horizontal && (evt.keyCode == 38 || evt.keyCode == 40)) {

			el.move(evt.keyCode == 38 ? -1 : 1);

			return evt.preventDefault();

		}

		

		return true;

		

	});	

		

	// jQuery plugin implementation

	jQuery.prototype.scrollable = function(opts, arg0, arg1) { 

			

		// return API associated with this instance

		if (!opts || typeof opts == 'number') {

			var index = opts || 0;

			var el = $.data(this.get()[index], "scrollable");

			if (el) { return el; }

		}

		

		this.each(function() {

				

			// @deprecated way of accessing API

			if (typeof opts == "string") {

				var el = $.data(this, "scrollable");

				el[opts].apply(el, [arg0, arg1]);

				

			// create new Scrollable instance

			} else { 

				var instance = new Scrollable(this, opts);	

				$.data(this, "scrollable", instance);

			}

		});

		

		return this;

	};

			

	

})(jQuery);