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);
  }
);

$(document).ready(function() {
  var gallery = $('#gallery').galleriffic('#thumbs', {
    delay:                  3000, // in milliseconds
    numThumbs:              20, // The number of thumbnails to show page
    preloadAhead:           40, // Set to -1 to preload all images
    enableTopPager:         false,
    enableBottomPager:      true,
    imageContainerSel:      '#slideshow', // The CSS selector for the element within which the main slideshow image should be rendered
    controlsContainerSel:   '#controls', // The CSS selector for the element within which the slideshow controls should be rendered
    captionContainerSel:    '#caption',
    loadingContainerSel:    '#loading',
    renderSSControls:       false, // Specifies whether the slideshow's Play and Pause links should be rendered
    renderNavControls:      true, // Specifies whether the slideshow's Next and Previous links should be rendered
    playLinkText:           'Play',
    pauseLinkText:          'Pauza',
    prevLinkText:           'Precedenta',
    nextLinkText:           'Urmatoarea',
    nextPageLinkText:       'Urmatoarea &rsaquo;',
    prevPageLinkText:       '&lsaquo; Precedenta',
    enableHistory:          false, // Specifies whether the url's hash and the browser's history cache should update when the current slideshow image changes 
    autoStart:              true, // Specifies whether the slideshow should be playing or paused when the page first loads 
    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);
    }
  });
});

