// We only want these styles applied when javascript is enabled
$('div.navigation').css({'width' : '506px' });
$('div.content').css('display', 'block');
// Initially set opacity on thumbs and add
// additional styling for hover effect on thumbs
var onMouseOutOpacity = 0.67;
$('#thumbs ul.thumbs li').css('opacity', onMouseOutOpacity)
	.hover(
		function () {
			$(this).not('.selected').fadeTo('fast', 1.0);
		}, 
		function () {
			$(this).not('.selected').fadeTo('fast', onMouseOutOpacity);
		}
	);

// Initialize Advanced Galleriffic Gallery
var galleryAdv = $('#gallery').galleriffic('#thumbs', {
	delay:                  3000,
	numThumbs:              10,
	preloadAhead:           10,
	enableTopPager:         false,
	enableBottomPager:      true,
	imageContainerSel:      '#slideshow',
	controlsContainerSel:   '#controls',
	captionContainerSel:    '#caption',
	loadingContainerSel:    '#loading',
	renderSSControls:       true,
	renderNavControls:      true,
	playLinkText:           'Play Slideshow',
	pauseLinkText:          'Pause Slideshow',
	prevLinkText:           '< Foto anterior',
	nextLinkText:           'Pr&oacute;xima foto >',
	nextPageLinkText:       'Pr&oacute;xima >',
	prevPageLinkText:       '< Anterior',
	enableHistory:          false,
	autoStart:              false,
	onChange:               function(prevIndex, nextIndex) {
		$('#thumbs ul.thumbs').children()
			.eq(prevIndex).fadeTo('fast', onMouseOutOpacity).end()
			.eq(nextIndex).fadeTo('fast', 1.0);
	},
	onTransitionOut:        function(callback) {
		$('#caption').fadeTo('fast', 0.0);
		$('#slideshow').fadeTo('fast', 0.0, callback);
	},
	onTransitionIn:         function() {
		$('#slideshow').fadeTo('fast', 1.0);
		$('#caption').fadeTo('fast', 1.0);
	},
	onPageTransitionOut:    function(callback) {
		$('#thumbs ul.thumbs').fadeTo('fast', 0.0, callback);
	},
	onPageTransitionIn:     function() {
		$('#thumbs ul.thumbs').fadeTo('fast', 1.0);
	}
});