// when the DOM is ready:
$(function () {

  // find the div.fade elements and hook the hover event
  $('.fade').each(function() {
    var fade  = $(this);
    var hover = fade.find("> div")
      .css({ opacity : 0.0, display : "block" });
      
    fade.hover(function() {
      hover
        .stop()
        .animate({ opacity : 1.0 }, 250);
    }, function () {
      hover
        .stop()
        .animate({ opacity : 0.0 }, 500);
    });
  });

  $('ul#about_page_gallery').innerfade({
    speed: 3000,
    timeout: 6000,
    type: 'sequence',
    containerheight: '245px'
  });

  $('ul#index_page_gallery').innerfade({
    speed: 3000,
    timeout: 6000,
    type: 'sequence',
    containerheight: '288px'
  });

  $('div.navigation').css({'width' : '300px', 'float' : 'left'});
  $('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').opacityrollover({
    mouseOutOpacity:   onMouseOutOpacity,
    mouseOverOpacity:  1.0,
    fadeSpeed:         'medium',
    exemptionSelector: '.selected'
  });
  
  // Initialize Advanced Galleriffic Gallery
  $("#thumbs").each(function() {
    $(this).galleriffic({
      delay:                     2500,
      numThumbs:                 15,
      preloadAhead:              10,
      enableTopPager:            true,
      enableBottomPager:         true,
      maxPagesToShow:            7,
      imageContainerSel:         '#slideshow',
      controlsContainerSel:      '#controls',
      captionContainerSel:       '#caption',
      loadingContainerSel:       '#loading',
      renderSSControls:          true,
      renderNavControls:         true,
      playLinkText:              'Play Slideshow',
      pauseLinkText:             'Pause Slideshow',
      prevLinkText:              '&lsaquo; Previous Photo',
      nextLinkText:              'Next Photo &rsaquo;',
      nextPageLinkText:          'Next &rsaquo;',
      prevPageLinkText:          '&lsaquo; Prev',
      enableHistory:             false,
      autoStart:                 false,
      syncTransitions:           true,
      defaultTransitionDuration: 900,
      onSlideChange:             function(prevIndex, nextIndex) {
        // 'this' refers to the gallery, which is an extension of $('#thumbs')
        this.find('ul.thumbs').children()
          .eq(prevIndex).fadeTo('fast', onMouseOutOpacity).end()
          .eq(nextIndex).fadeTo('fast', 1.0);
      },
      onPageTransitionOut:       function(callback) {
        this.fadeTo('fast', 0.0, callback);
      },
      onPageTransitionIn:        function() {
        this.fadeTo('fast', 1.0);
      }
    });
  });
  
  // ajaxify the form. show dialog with results
  $("form#ajax_form").submit(function () {
    // post the form data
    $.post($(this).attr("action"), $(this).serialize(), function(data, status) {
      // remove old dialog
      $("#dialog").remove();
      // create new dialog
      $("body").append("<div id=\"dialog\"><img src=\"images/fileclose.png\" /><p>" + data + "</p></div>");
      // fade in to begin with
      $("#dialog").css("display", "none").fadeIn("slow");
      // fade out dialog on click
      $("#dialog").click(function(event) {
        $(this).fadeOut("slow", function() { $(this).remove(); });
      });
    });
    // return false so the page doesn't redirect
    return false;
  });
});
