// JavaScript Document
var sliding = false;
function setupScroller() {
	
	var mask = $('scroll_container');
	panels = $('tlist').getElements('li');	
	var widthTally = 0;
	panels.each(function(el, idx) {
		widthTally += el.getCoordinates().width;
	});
	$('tlist').setStyle('width',widthTally+'px');
	
	// Setup first panel
	panels[0].addClass('active-panel');
	
	//new Fx.Style('tlist', 'margin-left', {duration:500}).start(mask.getCoordinates().left);		
	
	 $$('.slide-control').addEvent('click', function(ev) {
		var	curPanel = $('tlist').getElement('.active-panel');
		var destination = 0;
		canMove = false;
		ev = new Event(ev);
		ev.preventDefault();
		switch(this.id) {
			case 'arrow_prev':
				if(curPanel.getPrevious()) {
					destPanel = curPanel.getPrevious();	
					destination = $('tlist').getStyle('margin-left').toInt() + destPanel.getCoordinates().width;				
					canMove = true;
				}
			break;
			case 'arrow_next':
				if(curPanel.getNext()) {
					destPanel = curPanel.getNext();				
					destination = $('tlist').getStyle('margin-left').toInt() - destPanel.getCoordinates().width;
					canMove = true;					
				} 
			break;
		}
		if(canMove) {
			moveSlider(destPanel, destination);	
		}
	});	
}

function moveSlider(destPanel, destination) {
	if(destPanel) {
		panels.removeClass('active-panel');
		destPanel.addClass('active-panel');				
		
		if(!sliding) {
			sliding = true;
			new Fx.Style('tlist', 'margin-left', {
				duration:500,
				transition: Fx.Transitions.Quad.easeOut,
				onComplete: function() { sliding = false; }				
			}).start(destination);
		}
	}
}



var evnt = (window.webkit) ? 'load' : 'domready';
window.addEvent(evnt, function() {
    if($defined($('arrow_prev')) && $defined($('arrow_next'))) {
        setupScroller();
    }

});