// JavaScript Document
function change_main_pics(to_show) {
	$(main_pics[actual_main_pic]).fadeOut('fast');
	$(main_pics[to_show]).fadeIn('fast');
	$('#pg-main-panel-led-'+actual_main_pic).removeClass('active');
	$('#pg-main-panel-led-'+to_show).addClass('active');
	actual_main_pic = to_show;
}
	
function prev_main_pics() {
	var prev = actual_main_pic == 0 ? main_pics.length-1 :  actual_main_pic-1;
	change_main_pics(prev);
}

function next_main_pics() {
	var next = actual_main_pic == main_pics.length-1 ? 0 : actual_main_pic+1;
	change_main_pics(next);
}

function activate_led() {
	$(this).addClass('active');
}

function inactivate_led() {
	if (this.i != actual_main_pic) $(this).removeClass('active');
}

stop_step_main_pic = 0;
function step_main_pic() {
	if (stop_step_main_pic==1) return;
	next_main_pics();
}

function init_main_pics() {
	main_pics = $('.pg-main-panel-pic');
	actual_main_pic = 0;
	$('#pg-main-panel-arrow-left').bind('click', function(e) {
		e.preventDefault();
		prev_main_pics();
	});
	$('#pg-main-panel-arrow-right').bind('click', function(e) {
		e.preventDefault();
		next_main_pics();
	});
	if (main_pics.length>1) {
		main_pic_leds = [];
		var i = 0;
		$.each(main_pics, function(e) {
			var led = document.createElement('span');
			led.i = i;
			$led = $(led);
			$led.attr('id', 'pg-main-panel-led-'+i);
			$led.hover(activate_led, inactivate_led);
			$led.bind('click', function() {
				change_main_pics(this.i);	
			});
			$led.addClass('pg-main-panel-led');
			$('#pg-main-panel-leds').append(led);
			main_pic_leds.push(led);
			i++;
		});
		$('#pg-main-panel-led-0').addClass('active');
		setInterval(step_main_pic, 3000);
		$('#pg-main-panel').hover( 
			function() {
				stop_step_main_pic = 1;
			}, 
			function() {
				stop_step_main_pic = 0;	
			} 
		);
	}
}


$(document).ready( function() {
	init_main_pics();
	actual_tab = 1;
});