var els = new Array();
var max = null;
var timer = null;
var offset = 5000;
var index = 0;

var els_space = new Array();
var u_idx = null;
var clk = 0;
var timer = null;

$(function(){
	
	$('#big-pictures div.ele').each(function(){
		els.push(this.id);
	});
	max = els.length;
	
	hook_scroll();
	auto();
	
	$("#glide1").jCarouselLite({
		  btnNext: "#glide1_next",
		  btnPrev: "#glide1_prev",
		  visible: 4,
	      auto: 800,
	      speed: 500
	});
	
	$("#glide2").jCarouselLite({
		  btnNext: "#glide2_next",
		  btnPrev: "#glide2_prev",
		  visible: 4,
	      auto: 800,
	      speed: 500
	});
	
	$('ul.space').each(function(){
		els_space.push(this.id);
	});
	u_idx = els_space.length;
	autoScroll();
});

function autoScroll(){
	clk++;
	if(clk > u_idx-1){
		clk = 0;
	}
	for(var i=0;i<u_idx;i++){
		if($('#'+els_space[i]).hasClass('visable')){
			$('#'+els_space[i]).removeClass('visable').addClass('hidden');
		}
	}
	$('#'+els_space[clk]).addClass('visable').removeClass('hidden');
	
	timer = window.setTimeout(autoScroll, 5000);
}

function auto(){
	index++;
	if(index > max){
		index = 0;
	}
	slide(index);
	timer = window.setTimeout(auto,offset);
}
function slide(i){
	var id = els[i];
	
	i+=1;
	$('#n_'+i).siblings('.now').removeClass('now')
		.end().addClass('now');
	
	$('#'+id)
		.animate({opacity:1},800).show()
		.siblings('div:visible')
		.animate({opacity:0},800).hide();
	var title = $('#'+id).children('a').eq(0).attr('title');
	var link = $('#'+id).children('a').eq(0).attr('href');
	
	$('#picture-plink').attr({'href':link}).html(title);
}
function hook_scroll(){
	$('#pic-nav a').bind('click',function(){
		var index = parseInt(this.hash && this.hash.substr(1)) - 1;
		$(this)
			.siblings('.now').removeClass('now')
			.end().addClass('now');	
		if(timer){
			clearTimeout(timer);
		}
		slide(index);
		timer = window.setTimeout(auto,offset);
		
		return false;
	});
}