var Media = Class.create(
{
	duration: 0.25,

	initialize: function()
	{
	},

	parse: function()
	{
		if (this.container = $$('.media').shift())
		{
			var box_image	= this.container.select('.box_image').shift(); this.calculate(box_image, 'height');
			var box_thumb	= this.container.select('.box_thumb').shift(); this.calculate(box_thumb, 'width');

			box_thumb.list.elements.each(function(element) { element.down().observe('click', this.goto.bindAsEventListener(this, box_image, box_thumb.list.elements.indexOf(element))); }, this);

			this.container.select('.scroll').inject(-1, function (direction, element) { element.observe('click', this.scroll.bindAsEventListener(this, box_thumb, direction)); return direction + 2; }, this);
		}
	},

	calculate: function(box, type)
	{
		box.cssprop = (type == 'width' ? 'left' : 'top');
		box.list = box.down();

		box.list.elements	= box.list.select('li');
		box.list.number		= box.list.elements.size();
		box.list.dim		= box.list.elements.inject(0, function(memo, element) { element.offset = memo; return memo + element.getDimensions()[type]; } );
		box.list.bindim		= (box.list.number ? box.list.dim/box.list.number : 0);
		box.list.value		= 0;

		box.dim			= box.getDimensions()[type];
		box.number		= (box.list.bindim ? box.dim/box.list.bindim : 1);
		box.delta		= box.list.number - box.number;

		box.list.style[type]	= box.list.dim + 'px';
	},

	slide: function(box, value, morph)
	{
		box.list.value	= Math.max(Math.min(value, 1), 0);

		if (morph)
		{
			this.morph && this.morph.cancel();
			this.morph = new Effect.Morph(box.list, { style: box.cssprop + ': -' + box.list.value*box.delta*box.list.bindim + 'px', duration: this.duration });
		}
		else
		{
			box.list.style[box.cssprop] = -box.list.value*box.delta*box.list.bindim + 'px';
		}
	},

	scroll: function(event, box, direction)
	{
		event.preventDefault();

		box.delta > 0 && this.slide(box, (Math.round(box.list.value*box.delta) + direction)/box.delta, true);
	},

	goto: function(event, box, index)
	{
		event.preventDefault();

		box.delta > 0 && this.slide(box, index/box.delta, 1);
	}
});

var media = new Media();

document.observe('dom:loaded', function(event) { media.parse(); });