var poster_width = 175;
var posters_width;
var poster_margin = 10;
var max_x = 53;
var enable_transitions = true;
var button_width = 53;
var carousel_width = 1000;

document.observe("dom:loaded", function() {
	init();
});
function init() {
	//Render full-width of posters_container
	var posters = $('posters_container').getElementsByTagName('a');
	
	//attach events
	for (var i=0;i<posters.length;i++)
	{
		posters[i].onclick = function(){
			//alert('Loading movie info: ' + this.id);
			//return false;
		}
	}
	
	posters_width = posters.length * (poster_width + poster_margin);
	$('posters_container').style.width = posters_width + 'px';
	$('posters_container').style.left = '53px';
	
	//btn_left/btn_right
	$('button_left').onclick = function() {
		if (enable_transitions)
		{
			slidePosters('l');
		}
		return false;
	}
	$('button_right').onclick = function() {
		if (enable_transitions)
		{
			slidePosters('r');
		}
		return false;
	}
}

function updateButtonClass(left_peaked,right_peaked)
{
	$('button_left').className = (left_peaked ? 'off' : 'on');
	$('button_right').className = (right_peaked ? 'off' : 'on');
}

function slidePosters(direction){
	var posters_container = $('posters_container');
	var dir = (direction == 'l' ? 1 : -1);
	//var offset = 185;
	// var offset = 370;
	// 3 x poster
	var offset = 555;
	// 4 x poster
	var offset = 740;
	
	var left_peaked = false;
	var right_peaked = false;
	
	//839px = width of carousel 892px - right button 53px
	//var working_width = 839;
	
	
	var current_x = Position.positionedOffset(posters_container)[0];

	if (((dir * offset) + current_x) >= 53)
	{
		//cannot slide images left anymore
		offset = 53 - current_x;
		left_peaked = true;
	}
	else if (current_x + posters_width + (dir * offset) <= (carousel_width - button_width)){
		//cannot slide images right anymore
		offset = ((carousel_width - button_width) - (current_x + posters_width)) / dir;
		right_peaked = true;
	}
	
	updateButtonClass(left_peaked,right_peaked);
	//tip = current_x + posters_width;
	//alert('currentx + posterswidth:' + tip + ' going to be:' + (tip + (dir * offset)));
	
	new Effect.Move(posters_container, { 
		x: (dir * offset), 
		y: 0, mode: 'relative', 
		duration: 0.7, 
		beforeStart: function(){
			enable_transitions = false;
		},
		afterFinish: function(){
			enable_transitions = true;
		}
	});
}