Shadowbox.loadSkin('classic', 'styles/shadowbox');
//use the classic shadowbox skin

$(document).ready(function(){		
	Shadowbox.init({
		onOpen: setOpenGalleryURL,
		onChange: setChangeGalleryURL,
		onClose: setCloseGalleryURL			
	});
		
	setupScroller("#weController", "div.we");
	setupScroller("#createController", "div.create");
	setupScroller("#greatController", "div.great");
	makeAccordion();

	deepLink = document.location.hash
	if(deepLink){
		//load panel from deep link
		deepLink = deepLink.replace("#l=", "");
		hashVars = deepLink.split(".")	
		
		if(hashVars[0]){		
			$('.accordion').accordion("activate",  $("#" + hashVars[0]));
			
			if(hashVars[1]){
				
				if($("." + hashVars[0] + " li").eq(parseInt(hashVars[1])).children("a").get(0)){
					Shadowbox.open($("." +  hashVars[0]  +  " li").eq(parseInt(hashVars[1])).children("a").get(0));
				}
								
				if(hashVars[2]){
					Shadowbox.change(parseInt(hashVars[2]));
				}
			}			
		}
	}

/*
	$(".great .featured a").click(function(){
		//start the featured gallery
		if($(".great a.featuredGallery").length){
			Shadowbox.open($(".great a.featuredGallery").get(0))		
		}	
	});
*/
	
	$(".work .featured a").click(function(){
		//start the featured gallery
		if($(".work a.featuredGallery").length){
			Shadowbox.open($(".work a.featuredGallery").get(0))		
		}	
	});
	
	$('.accordion dt').hover(function() {
		if (!$(this).hasClass("selected")){
			$(this).find("ul").addClass("hovered");
		
			var originalCol = "rgb(45, 45, 45)";
			var newCol = "rgb(102, 116, 255)"; //"#6674FF"
			//var newCol = randomColor();	
					
	  		$(this).animate({ backgroundColor: newCol }, {queue: false, duration: 'fast', complete: function(){
	  			$(this).animate({ backgroundColor: originalCol }, {duration: 'slow', complete: function(){
	  				if($(this).css('backgroundColor') != originalCol){		
	  					// if the section hasn't returned to the original color (bug) do one more fast transition to clean up
	  					$(this).animate({ backgroundColor: originalCol}, {duration: 'fast'});
	  				}
	  			}});
	  		}});
		}
	},
	function() {
		$(this).find("ul").removeClass("hovered");
	});
	
	$("dt ul li a").click(function(){
		$(this).parents("ul").find("li").removeClass("active");
		$(this).parent("li").addClass("active");
		//$(this).closest("ul").find("img").css('left', $(this).parent().position().left + ($(this).width() / 2) - 10);
	})		
});

function randomColor() {
	return 'rgb(' + (Math.floor(Math.random() * 256)) + ',' + (Math.floor(Math.random() * 256)) + ',' + (Math.floor(Math.random() * 256)) + ')'; 
}

function setOpenGalleryURL(gallery) {
	if($(gallery.el).parents(".panel").length){
		//set the url hash to the id of the open panel, plus the index of the current gallery
		document.location.hash = "l=" + $(gallery.el).closest("dd").prev("dt").attr("id") + "." + $(gallery.el).closest("dd").find("li").index($(gallery.el).parent("li"));
	}
}

function setChangeGalleryURL(gallery) {
	if($(gallery.el).parents(".panel").length){
		//set the url hash to the id of the open panel, plus the index of the current gallery, plus the index of the current item 
		document.location.hash = "l=" + $(gallery.el).closest("dd").prev("dt").attr("id") + "." + $(gallery.el).closest("dd").find("li").index($(gallery.el).parent("li")) + "." + $(gallery.el).parent().children("a").index(gallery.el);
	}
}

function setCloseGalleryURL(gallery) {
	if($(gallery.el).parents(".panel").length){
		//set the url hash to the id of the open panel
		document.location.hash = "l=" + $(gallery.el).closest("dd").prev("dt").attr("id");
	}
}

function makeAccordion(){
	$('.accordion').accordion({
		header: "dt",
		autoHeight: false,
		animated: 'easeslide',
		alwaysOpen: true
	});
	
	$('.accordion dt').click(function(event, ui, accordion) {
	  	document.location.hash = "l=" + $(this).attr("id");
		//add listener to update hash on panel open for deep linking
	});	
}


function setupScroller(navContainer, panelsContainer){

	var $panels = $(panelsContainer + ' .scrollContainer > div');
	var $container = $(panelsContainer + ' .scrollContainer');
	
	$container.css('width', $panels[0].offsetWidth * $panels.length);
	var $scroll = $(panelsContainer + ' .scroll').css('overflow', 'hidden');
	
	
	var scrollOptions = {
	  target: $scroll,
	  items: $panels,  
	  navigation: navContainer + 'a',
	  axis: 'x',
	  duration: 500
	};
	
	$(navContainer).localScroll(scrollOptions);
	
	$(navContainer + ' a').bind("click", function(event){
		if(!$(this).parents("dt").hasClass("selected")){
			var that = this;
			window.setTimeout(function() {
				//console.log("setting timeout");
				$(that).click();
			}, 0);
		}  
 	});
}