// ### DOM IS READY, KICK OUT THE JAMS
$(document).ready( function(){

	$("#next").click(moveNext);
	$("#prev").click(moveBack);

	$(document).keydown(function(e){
		if (e.keyCode == 37) { moveBack(); }
		if (e.keyCode == 39) { moveNext(); }
	});

	$("#bgimg").load(function(e){
		$("#header #loader").hide();
	});

	init();
});

// ### INIT THE UI
function init() {
	UI_Hider	= 0;
	active_node = 0;
	is_hidden	= 0;
	$("#bgimg").attr('src', pics[active_node].url);
	$("#bgimg").attr('alt', pics[active_node].txt);
	$("#prev").css('opacity', .25);
	$(document).mousemove(function(e){resetHide();});
	$(document).click(function(e){resetHide();});
	checkNode();
}

// ### RESET THE HIDE TIMER
function resetHide() {
	if (is_hidden) unHide();
	clearInterval(UI_Hider);
	//UI_Hider = setInterval(doHide, 4000);
}

// ### HIDE THE SITE UI
function doHide() {
	clearInterval(UI_Hider);
	is_hidden = 1;
	$("#header, #footer").stop().fadeOut();
}

// ### UNHIDE THE SITE UI
function unHide() {
	is_hidden = 0;
	$("#header, #footer").stop().fadeIn();
}
// ### MOVE TO THE NEXT PIC
function moveNext(e) {
	for (var x=0; x<pics.length; x++) {
		if ($("#bgimg").attr('src') == pics[x].url && pics.length !== x+1) {
			$("#bgimg").attr('src', pics[x+1].url);
			$("#bgimg").attr('alt', pics[x+1].txt);
			$("#info").text('( '+page+' : '+(x+2)+'/'+pics.length+' )');
			active_node = x+1;
			$("#header #loader").show();
			break;
		}
	}
	checkNode();
}

// ### MOVE TO THE PREVIOUS PIC
function moveBack(e) {
	for (var x=pics.length-1; x>=0; x--) {
		if ($("#bgimg").attr('src') == pics[x].url && x-1 >= 0) {
			$("#bgimg").attr('src', pics[x-1].url);
			$("#bgimg").attr('alt', pics[x-1].txt);
			$("#info").text('( '+page+' : '+(x)+'/'+pics.length+' )');
			active_node = x-1;
			$("#header #loader").show();
			break;
		}
	}
	checkNode();
}

// ### CHECK THE NODE AND SET UI ELEMS
function checkNode() {
	var c_node 	= (active_node+1).toString();
	var c_total	= pics.length.toString();
	$("#prev").stop().fadeTo(500, (active_node == 0) ? .25 : 1);
	$("#next").stop().fadeTo(500, (active_node == pics.length-1) ? .25 : 1);
	$("#info").html('( &nbsp;'+page+' : '+(c_node.length == 1 ? '0'+c_node : c_node)+' / '+(c_total.length == 1 ? '0'+c_total : c_total)+'&nbsp; )');
}