/*!
 * Andrea D'Aquino main website javascript file
 * http://www.andrea-daquino.com
 *
 * Copyright 2010, Andrea D'Aquino
 *
 * Includes jquery-1.4.2.js
 * http://jquery.org/license
 * Copyright 2010, The jQuery Project
 * Released under the MIT, and GPL Licenses.
 *
 * Date: 
 */

// Initialize when document is ready
$(document).ready(function() {
	init();
});


// Initialize method
function init() {

	// Window Center Layout logic
	$(window).resize(function(){
		var left = ($(window).width() - $('#main-area').outerWidth())/2;
		var top;
		
		if($('#gallery').is(':hidden')){
			top = ($(window).height() - $('#main-area').outerHeight()+80)/2;
		}
		else {
			top = ($(window).height() - $('#main-area').outerHeight())/2;
		}

		$('#main-area').css({
			position:'absolute',
			left: left,
			top: top
		});
	});
	
	// To initially run the function:
	$(window).resize();

	//
	// Centralization of variable values
	//
	var booksSections = ["work1", "work2"];
	var textSections = ["references", "contact"];

	createMenu(booksSections);
	createMenu(textSections);

	createContentContainer(booksSections);
	createContentContainer(textSections);
	
	createGalleryThumbList(12,"books/work1/","#work1");
	createGalleryThumbList(12,"books/work2/","#work2");
	//
	//
	//

	//$("#header").css("opacity",".3");

	// Gallery Back Button Setup
	$("#back-button").click(function() {
		unLoadGallery();
	});

	$("#back-button").hover(handlerIn, handlerOut);
	
	function handlerIn() {
		$("#back-button").css("opacity","1");
	};

	function handlerOut() {
		$("#back-button").css("opacity",".2");
	};

	$("#photo").click(function(){
		unLoadGallery();
	});
	
	// Main Menu Click Event Logic
	$("ul#menu li a").click(function(){
		var name;
		// Reset all Buttons
		$("ul#menu li a").each(function(index) {
			name = $(this).text();
			$(this).toggleClass("selected", false);
			$("ul#"+name).hide();
		});

		$(this).toggleClass("selected", true);
		name = $(this).text();
		$("ul#"+name).show();
	});

	// Register to the click event to show up the gallery 
	registerGalleryThumbListener();

	// Load References html and contact html
	loadTextContent(textSections);
	
	// Select the first item in the menu
	$("#navigation ul#menu li a:first").toggleClass("selected");

	// Show the first content box
	$("#content ul:first").show();
}

//Load galleries for given thumb id
function loadTextContent(sections) {
	// Load text content
	var i=0;
	var section;
	for (i=0;i<=sections.length-1;i++) {
		section = sections[i];
		$("ul#"+section).load('content/'+section+'.html');
	}
}

// Load galleries for given thumb id
function loadGallery(path, id) {

	// Hide the content an the main navigation
	$("#header").css("opacity",".2");
	$("#content").hide();
	$("#navigation").hide();

	toggleGallery(true);
	
	$("#back-button").show();

	createGallery(path);
}

function unLoadGallery() {
	$("#header").css("opacity",".6");
	$("#content").show();
	$("#navigation").show();

	toggleGallery(false);

	$("#photo").html("");
	$("#back-button").hide();
}

function createGallery(path) {
	// Reset the photo-thumb list
	$("#thumbs").html("");
	// Create new one's
	createPhotoThumbList(12, path);
	// Register them to the click event
	registerPhotoThumbListener();
	
	// Set the first photo to be visible
	var imgURL = path+"1.jpg";
	changeGalleryPhoto(imgURL);
}

function createMenu(items) {
	var i=0;
	var item;
	for (i=0;i<=items.length;i++) {
		item = items[i];
		$("#menu").append("<li><a class='"
				+item+"' href='#' >"+item+"</a></li>");
	}
}

function createContentContainer(items) {
	var i=0;
	var item;
	for (i=0;i<=items.length;i++) {
		item = items[i];
		$("#content").append("<ul id='"+item+"' class='grid'></ul>");
	}
}

function createPhotoThumbList(count, path) {
	var i=0;
	for (i=1;i<=count;i++) {
		$("#thumbs").append("<li><img id='"+i+"' class='photo-thumb' src='"
				+path+i+"_thumb.jpg'/></li>");
	}

	$("img").error(function(){
		  $(this).hide();
	});
}

function createGalleryThumbList(count, path, selector) {
	var i=0;
	var gallerySequencePath;
	for (i=1;i<=count;i++) {
		gallerySequencePath = i < 10? "0"+i : i;
		$(selector).append(
				"<li><img id='"+i+"' class='gallery-thumb' src='"
				+path+gallerySequencePath
				+"/thumb.jpg' width='230' height='150' /></li>");
	}
}

function registerPhotoThumbListener() {
	$("ul#thumbs li img.photo-thumb").click(function(){
		var id = $(this).attr("id");
		var path = $(this).attr("src");
		path = path.replace("/"+id+"_thumb.jpg", "/");
		var imgURL = path+id+".jpg";

		changeGalleryPhoto(imgURL);
	});
}

function registerGalleryThumbListener() {
	// Register Event listener for the gallery thumbs
	$("div#content ul li img.gallery-thumb").click(function(){
		var id = $(this).attr("id");
		var path = $(this).attr("src");
		path = path.replace("/thumb.jpg", "/");

		loadGallery(path, id)
	});
}

function toggleGallery(show) {
	if(show){
		$("#gallery").show();
	}
	else {
		$("#gallery").hide();
	}
	$(window).resize();
}

function changeGalleryPhoto(srcUrl) {
	$("#photo").html("");
	$("#photo").addClass("loading");

	var img = new Image();
	img.id = "current-photo";

	// wrap our new image in jQuery, then:
	$(img)
		// once the image has loaded, execute this code
		.load(function () {
			// set the image hidden by default    
			$(this).hide();
			// with the holding div #loader, apply:
			$('#photo')
			// remove the loading class (so no background spinner), 
			.removeClass('loading')
			// then insert our image
			.append(this);
			// fade our image in to create a nice effect
			$(this).fadeIn();
		})
		// if there was an error loading the image, react accordingly
		.error(function () {
		// notify the user that the image could not be loaded
		})
	// *finally*, set the src attribute of the new image to our image
	.attr('src', srcUrl);
}