$(document).ready(function() {	
    // Initially set opacity on thumbs and add
    // additional styling for hover effect on thumbs
    var onMouseOutOpacity = 0.50;
    $('#thumbs ul.thumbs li').css('opacity', onMouseOutOpacity)
            .hover(
                    function () {
                            $(this).not('.selected').fadeTo('fast', 1.0);
                    }, 
                    function () {
                            $(this).not('.selected').fadeTo('fast', onMouseOutOpacity);
                    }
            );
    
    var gallery = $('#gallery').galleriffic('#thumbs', {
            delay:                  2000,
            numThumbs:              21,
            preloadAhead:           10,
            enableTopPager:         true,
            enableBottomPager:      true,
            imageContainerSel:      '#slideshow',
            controlsContainerSel:   '#controls',
            captionContainerSel:    '#caption',
            loadingContainerSel:    '#loading',
            renderSSControls:       true,
            playLinkText:           'Play',
            pauseLinkText:          'Pause',
            prevLinkText:           'Aurrekoa',
            nextLinkText:           'Hurrengoa',
            nextPageLinkText:       '›',
            prevPageLinkText:       '‹',
            enableHistory:          true,
            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) {
                    $('#slideshow, #caption').fadeOut('fast', callback);
            },
            onTransitionIn:         function() {
                    $('#slideshow, #caption').fadeIn('fast');
            },
            onPageTransitionOut:    function(callback) {
                    $('#thumbs ul.thumbs').fadeOut('fast', callback);
            },
            onPageTransitionIn:     function() {
                    $('#thumbs ul.thumbs').fadeIn('fast');
            }
    });
});