// JavaScript Document
$currentPage = 'home';
$jsonObj = null;

function changePage(page, node){

	//Remove star and bar from old tab
	var oldPageTab = document.getElementById($currentPage);
	oldPageTab.setAttribute("class", $currentPage);
	oldPageTab.setAttribute("className", $currentPage);
	
	var oldContent = document.getElementById($currentPage + "_contents");
	oldContent.setAttribute("class", "main_middle hidden");
	oldContent.setAttribute("className", "main_middle hidden");
	
	var oldPhotos = document.getElementById($currentPage + "_collection");
	oldPhotos.setAttribute("class", "hidden");
	oldPhotos.setAttribute("className", "hidden");
	
	$currentPage = page;
	
	var newContents = document.getElementById($currentPage + "_contents");
	newContents.setAttribute("class", "main_middle visible");
	newContents.setAttribute("className", "main_middle visible");
	
	var newPhotos = document.getElementById($currentPage + "_collection");
	newPhotos.setAttribute("class", "visible");
	newPhotos.setAttribute("className", "visible");
	
	var api =  $(".scroll").scrollable();
	api.seekTo(newPhotos.getAttribute("title"), 0);

	// activate item
	$(".items img").removeClass("active");
	newPhotos.firstChild.setAttribute("class", "active");
	newPhotos.firstChild.setAttribute("className", "active");
}


$(document).ready(function() {

$(".scroll").scrollable({ circular: true }).click(function() {
	$(this).data("scrollable").next();		
});

$(".items img").click(function() {

	// see if same thumb is being clicked
	if ($(this).hasClass("active")) { return; }

	var api =  $(".scroll").scrollable();
	api.seekTo($(this).attr("id"), 0);

	// activate item
	$(".items img").removeClass("active");
	$(this).addClass("active");

// when page loads simulate a "click" on the first image
});

$(".gallery_items img").click(function() {

	// see if same thumb is being clicked
	if ($(this).hasClass("active")) { return; }

	var api =  $(".scroll").scrollable();
	api.seekTo($(this).attr("id"), 0);

	// activate item
	$(".gallery_items img").removeClass("active");
	$(this).addClass("active");

// when page loads simulate a "click" on the first image
}).filter(":first").click();

});