// JavaScript Document
	
$(document).ready(function(){
	cufonReplacement();

	var currentPage = $('body').attr('id');

	if(currentPage=='home'){
		loadThumbnails();
		activateHoverEffect();
	} else if(currentPage=='homedb'){
		$('.thumbnail').each(function(){
			centerThumbnailTitle($(this));
		});
		activateHoverEffect();
	} else if(currentPage=='detail-view'){
		initSlider();
		$('#slider').find('.panel').find('img');
	}
	
});  	
	//Load thumbnails
	function loadThumbnails(){
		var paras = $('.thumbnail');
		paras.hide();
		var i = 0;
		(function() {											 
			 $(paras[i]).fadeIn(100, arguments.callee);
			 if(i>0)
			 	centerThumbnailTitle($(paras[i-1]));
			 i++;								
	    })();
	}
	

	//Thumbnail hover effect
	function activateHoverEffect(){
		$('.thumbnail').hover(function(){  
			$(".cover", this).stop().animate({top:'-77px', left:'0px'},{queue:false,duration:300});  
		}, function() {  
			$(".cover", this).stop().animate({top:'0px', left:'0px'},{queue:false,duration:300});  
		});
	}
	
	function centerThumbnailTitle($thumbnail){
		$thumbnail.find("a").html(function(){
			return '<span>'+ $(this).text() + '</span>';
		});	
		var $span = $thumbnail.find("a").find("span");		
		thumbnailContent=$span.height();		
		topMargin=Math.round(38 - (thumbnailContent/2));
		$span.css({'margin-top':topMargin+'px'});
	}
	
	function cufonReplacement(){
		Cufon.replace('h1 a', { fontFamily: 'Craw Modern Regular' }); 
		Cufon.replace('#menu', { fontFamily: 'Bank Gothic Medium', hover:{color:'#974435'} });
		Cufon.replace('.scrollButtons', { fontFamily: 'Bank Gothic Medium', hover:{color:'#974435'} });
		Cufon.replace('#image-title', { fontFamily: 'Bank Gothic Medium'});
		Cufon.replace('.exhibitions', { fontFamily: 'Mrs Eaves Roman', fontSize:14});
		Cufon.replace('.biography', { fontFamily: 'Mrs Eaves Roman'});
		Cufon.replace('.contact', { fontFamily: 'Mrs Eaves Roman'});
		Cufon.replace('#content h2', { fontFamily: 'Bank Gothic Light'});
		Cufon.replace('.date', { fontFamily: 'Bank Gothic Light'});
		Cufon.replace('.author', { fontFamily: 'Bank Gothic Light'});
		$('.cufon.cufon-canvas').filter('[alt=" "]').detach();
	}
	

	function initSlider(){
		$('.details').fadeIn(2000);
		
		var $panels = $('#slider .scrollContainer > div');
		var $container = $('#slider .scrollContainer');
	
			$panels.css({
				'float' : 'left',
				'position' : 'relative' // IE fix to ensure overflow is hidden
			});
	
			// calculate a new width for the container (so it holds all panels)
			$container.css('width', $panels[0].offsetWidth * $panels.length);
	
		// collect the scroll object, at the same time apply the hidden overflow
		// to remove the default scrollbars that will appear
		var $scroll = $('#slider .scroll').css('overflow', 'hidden');
	
		// apply our left + right buttons
		$scroll
			.before('<a class="scrollButtons left" href="javascript:void(0);">PREV</a>')
			.after('<a class="scrollButtons right" href="javascript:void(0);">/ NEXT</a>');
	
	
		$('#slider .navigation').find('a').click(selectNav);
		
		if (window.location.hash) {
			trigger({ id : window.location.hash.substr(1), hash : true });
		} else {
			$('ul.navigation a:first').click();
		}
		
		var offset = parseInt(($container.css('paddingTop')) || 0) * -1;
		
		
		var scrollOptions = {
			target: $scroll, // the element that has the overflow
			// can be a selector which will be relative to the target
			items: $panels,
			navigation: '.navigation a',
			// selectors are NOT relative to document, i.e. make sure they're unique
			prev: 'a.left', 
			next: 'a.right',
			axis: 'xy',// allow the scroll effect to run both directions
			onAfter: trigger, // our final callback
			offset: offset,
			duration: 500,
			easing: 'swing',
			cycle :false
		};
		
		$('#slider').serialScroll(scrollOptions);
		
		$.localScroll(scrollOptions);
		
		scrollOptions.duration = 1;
		$.localScroll.hash(scrollOptions);
		
		cufonReplacement();
		setImageTitle();
		
	}
	
	// handle nav selection
	function selectNav() {
		$(this)
			.parents('ul:first')
				.find('a')
					.removeClass('selected')
				.end()
			.end()
			.addClass('selected');
	}
	
	// go find the navigation link that has this target and select the nav
	function trigger(data) {
		var el = $('#slider .navigation').find('a[href$="' + data.id + '"]').get(0);
		var isHash = data.hash;
		selectNav.call(el);
		if(!isHash){ setImageTitle(); }
		if($(el).size() > 0){
		window.location.hash = $(el).attr("href")	
		}
	}
	function setImageTitle(){
		var idTarget =$('.navigation').find('.selected').attr('href');
		var imageTitle = $(idTarget).find('img').attr('alt');
		var finalText = imageTitle.split("-");
		finalText = finalText.join("&nbsp;");
		finalText = finalText.replace("*", "-");
		$('#image-title').html(finalText);
		cufonReplacement();
	}