/* NAMESPACE */

	if (typeof JS == 'undefined') {
		var JS = {};
	}


/* CSS FIX */

	JS.CssFix = function(parent) {};
	

/* SCRIPT */

	var Timeline = new Class(
	{
		initialize: function(element)
		{
			this.element	= element;
			this.jumps		= this.element.getElements('.jumps li');
			this.inner		= this.element.getElement('div');
			this.width		= parseInt(this.element.getStyle('width'));
			this.scroll		= parseInt(this.inner.getStyle('width'));
			this.offset		= 0;
			this.drag		= new Drag(this.inner, {
				limit: {x: [(this.scroll - this.width) * -1, 0], y: [0, 0]},
				onComplete: function() {
					this.offset = parseInt(this.inner.getStyle('left')) * -1;
				}.bind(this)
			});
			
			this.element.getElement('.back')
				.addEvent('click', this.back.bindWithEvent(this));
			this.element.getElement('.forward')
				.addEvent('click', this.forward.bindWithEvent(this));

			this.jumps.each(function(jump) {
				jump.addEvent('click', function(event) {
					var offset = jump.getAttribute('data-offset');
					this.inner.tween('left', '-' + offset + 'px');
					this.offset = offset;
				}.bindWithEvent(this));
			}, this);
				
			this.inner.tween('left', '0px');
		},
		
		back: function(event)
		{
			var offset = this.offset - this.width;
			if (offset < 0) {
				offset = 0;
			}
			this.inner.tween('left', '-' + offset + 'px');
			this.offset = offset;
		},
		
		forward: function(event)
		{
			var offset = this.offset + this.width;
			if (offset > (this.scroll - this.width)) {
				offset = this.scroll - this.width;
			}
			this.inner.tween('left', '-' + offset + 'px');
			this.offset = offset;
		}
	});