Panable = Class.create();
Panable.prototype =
{
	initialize: function(name, options)
	{
		this.busy = false;
		this.element = $P(name);
		this.name = name;
		options = options || {};
		this.leftButton = options.left || false;
		this.rightButton = options.right || false;
		this.width = options.width || 400;
		this.mode = options.mode || "double";
		this.elementType = options.element || "row";
		this.pages = new Array();
		this.currentPage = new Array();
		this.horizontal = options.horizontal ? true : false;
		this.offset = $P(this.element.parentNode).cumulativeOffset();
		
		if (this.leftButton)
		{
			$P(this.leftButton).style.cursor = "pointer";
			Event.observe(this.leftButton, 'click', this.rightAction.bindAsEventListener(this), false);
		}
		
		if (this.rightButton)
		{
			$P(this.rightButton).style.cursor = "pointer";
			Event.observe(this.rightButton, 'click', this.leftAction.bindAsEventListener(this), false);
		}
		
		this.pages[this.name] = options.pages;
		if (this.pages[this.name] <= 1)
		{
			$P(this.leftButton).hide();
			$P(this.rightButton).hide();
		}
		this.currentPage[this.name] = 0;
		this.updateCounter();
	},
	
	changeElement: function(name)
	{
		this.name = name;
		this.element = $P(name);
		if (!this.pages[this.name])
		{
			if (this.mode == "simple")
				this.pages[this.name] = $A(this.element.select(this.elementType)).size();
			else
				this.pages[name] = Math.floor(($A(this.element.select(this.elementType)).size() + 1) / 2);
			this.currentPage[this.name] = 0;
		}
		if (this.pages[this.name] <= 1)
		{
			$P(this.leftButton).hide();
			$P(this.rightButton).hide();
		}
		else
		{
			$P(this.leftButton).show();
			$P(this.rightButton).show();
		}
	},

	updateCounter: function()
	{
		if (!$P("counter"))
			return;
			
		current = (this.currentPage[this.name] + 1).toString();
		if (current < 10)
			current = "0" + current;
			
		total = (this.pages[this.name]).toString();
		if (total < 10)
			total = "0" + total;
			
		$P("counter").innerHTML = current + " / " + total;
	},

	leftAction: function()
	{
		if (this.isLocked())
		{
			this.leftAction.bind(this).delay(0.1);
			return;
		}
		if (this.currentPage[this.name] > 0)
		{
			this.lock();
			if (this.horizontal)
				new Effect.Move(this.element, {x: - (this.currentPage[this.name]-1) * this.width, y: 0, mode:"absolute", afterFinish: this.unlock.bind(this)});
			else
				new Effect.Move(this.element, {y: - (this.currentPage[this.name]-1) * this.width, x: 0, mode:"absolute", afterFinish: this.unlock.bind(this)});
			this.currentPage[this.name]--;
		}
		else
		{
			this.lock();
			if (this.horizontal)
				new Effect.Move(this.element, {x: - this.width*(this.pages[this.name] - 1), y: 0, mode:"absolute", afterFinish: this.unlock.bind(this)});
			else
				new Effect.Move(this.element, {y: - this.width*(this.pages[this.name] - 1), x: 0, mode:"absolute", afterFinish: this.unlock.bind(this)});
			this.currentPage[this.name] = this.pages[this.name] - 1;
		}
		this.updateCounter();
	},

	rightAction: function()
	{
		if (this.isLocked())
		{
			this.rightAction.bind(this).delay(0.1);
			return;
		}
		if (this.currentPage[this.name] < this.pages[this.name] - 1)
		{
			this.lock();
			if (this.horizontal)
				new Effect.Move(this.element, {x: - (this.currentPage[this.name] + 1) * this.width, y: 0, mode:"absolute", afterFinish: this.unlock.bind(this)});
			else
				new Effect.Move(this.element, {y: - (this.currentPage[this.name] + 1) * this.width, x: 0, mode:"absolute", afterFinish: this.unlock.bind(this)});
			this.currentPage[this.name]++;
		}
		else
		{
			this.lock();
			if (this.horizontal)
				new Effect.Move(this.element, {x: 0, y: 0, mode:"absolute", afterFinish: this.unlock.bind(this)});
			else
				new Effect.Move(this.element, {y: 0, x: 0, mode:"absolute", afterFinish: this.unlock.bind(this)});
			this.currentPage[this.name] = 0;
		}
		this.updateCounter();
	},

	lock: function()
	{
		this.busy = true;
	},

	unlock: function()
	{
		this.busy = false;
	},

	isLocked: function()
	{
		return this.busy;
	}
};