var ShowCase = Class.create(
{
	initialize: function()
	{
		this.addEventListeners();
	},
	
	addEventListeners: function()
	{
		document.observe('lb:DrawComplete', this.paginate.bind(this));
		document.observe('keypress', this.keyPressed.bind(this));
	},
	
	paginate: function(linkId)
	{
		var images = $$('.showcaseImages .image');
		var imageCounter = images.length;
		
		if (linkId < 0)
		{
			linkId = imageCounter-1;
		}
		
		this.linkId = (!linkId || typeof linkId == 'object' || linkId >= imageCounter) ? 0 : linkId;
		
		var i=0;
		
		images.each(function(container)
		{
			if (i != this.linkId)
			{
				container.hide();
			}
			else
			{
				container.show();
			}
			
			i++;
		}.bind(this));
		
		$$('.showcasePagination .paginate').each(function(link)
		{
			if (link.id == 'left' || link.id == 'right')
			{
				link.stopObserving();
				
				if (link.id == 'left')
				{
					link.observe('click', this.paginate.bind(this, this.linkId-1));
				}
				else
				{
					link.observe('click', this.paginate.bind(this, this.linkId+1));
				}
			}
			else
			{
				if (link.id == this.linkId)
				{
					link.addClassName('paginateOn');
				}
				else
				{
					link.removeClassName('paginateOn');
				}
				
				link.stopObserving();
				link.observe('click', this.paginate.bind(this, link.id));
			}
		}.bind(this));
	},
	
	keyPressed: function(event)
	{
		if (event.keyCode == Event.KEY_LEFT)
		{
			this.paginate(this.linkId-1);
		}
		else if (event.keyCode == Event.KEY_RIGHT)
		{
			this.paginate(this.linkId+1);
		}
	}
});

document.observe('dom:loaded', function()
{
	var showcase = new ShowCase();
});