/* Author:
 Matthieu Aussaguel
 */

$(function() {
  var galleries = [];
  if ($('.gallery').length) {
    $('.gallery').each(function() {
      var _$gallery = $(this);
      galleries.push(new Gallery(_$gallery, _$gallery.siblings('.slides-wrapper:first')));
    });
  }

});

// Gallery 'Class'
function Gallery($gallery, $sliderWrapper) {
  // Public properties
  this.$gallery = $gallery;
  this.$sliderWrapper = $sliderWrapper;
  this.$sliderWrapperClone;

  // Private properties
  // Slider state  _state = 'hidden'; // always hidden on load
  state = 'hidden';
  currentSlide = 1;
  currentSliderId = '';

  // Public methods
  //  Init the slider
  this.initSlider = function() {
    var that = this,
        $slider = this.$sliderWrapperClone.find('.slides-holder:first'),
        $sliderBack = this.$sliderWrapperClone.find('.back:first'),
        $sliderNav = this.$sliderWrapperClone.find('.slides-nav:first'),
        $slideTitle = $sliderNav.find('.slides-title:first'),
        $slidePagination = $sliderNav.find('.slides-pagination span:first'),
        $sliderEnlarge = this.$sliderWrapperClone.find('.enlarge:first');

    // update the pagination
    $slidePagination.text(that.getCurrentSlide());

    // update the caption
    var data = this.$gallery.find('li').eq(this.getCurrentSlide() - 1).children('a:first').data(),
        imageData = new ImageData(data);
    $slideTitle.text(imageData.getFullImageDetails());

    // Activate the enlarge button
    $sliderEnlarge.fancybox({'href': 'uploads/' + imageData.getEnlargeImageHref(),
                             'titleShow' : false,
                             'title' : imageData.getFullImageDetails()});

    // Activate the slider
    $slider.slides({
      container: 'slides',
      generateNextPrev: true,
      start: this.getCurrentSlide(),
      generatePagination: false,
      slideSpeed: 700,
      slideEasing: 'easeOutExpo',
      animationComplete: function(current) {
        // Update the current Slide number
        that.setCurrentSlide(current);
        //update the pagination
        $slidePagination.text(that.getCurrentSlide());
        // update the caption
        data = that.$gallery.find('li').eq(that.getCurrentSlide() - 1).children('a:first').data();
        imageData = new ImageData(data);
        $slideTitle.text(imageData.getFullImageDetails());

        // Activate the enlarge button
        $sliderEnlarge.fancybox({'href': 'uploads/' + imageData.getEnlargeImageHref(), 'titleShow' : false});
      }
    });

    $sliderBack.bind('click', function() {
      that.hideSlider();
      return false;
    });

  };

  // Init the Gallery
  this.initGallery = function(e) {


    var that = this;
    this.$gallery.delegate('a', 'click', function() {
      // Scroll to the top
      $.scrollTo({top:'0', left:'0'}, 1000, {easing:'easeOutExpo'});
      that.setCurrentSlide(($(this).parent().index() + 1));


      if (typeof that.$sliderWrapperClone !== 'undefined') that.$sliderWrapperClone.remove();

      // Generate a unique id
      currentSliderId = _.uniqueId('slider_');

      // clone slider
      that.$sliderWrapper.clone()
          .attr('id', currentSliderId)
          .insertAfter(that.$gallery);

      // Update the clone selector
      that.$sliderWrapperClone = $('#' + currentSliderId);

      // Init the Slider
      that.initSlider();

      // show the slider
      that.showSlider();


      // prevent default action
      return false;
    });

  };

  this.showSlider = function() {
    var that = this;

    // Make sure the slider is hidden
    if (this.getState() === 'hidden') {
      this.setState('showing');

      // First we hide the gallery
      this.$gallery.animate({'opacity':0}, 400, 'easeInQuad', function() {
            that.$gallery.hide();
            // Then we show the show the slider
            that.$sliderWrapperClone.css({'opacity':0}).show().animate({'opacity':1}, 400, 'easeOutQuad', function() {
                  that.setState('visible');
                });
          });
    }
  };


  this.hideSlider = function() {
    var that = this;
    // Make sure the slider is hidden
    if (this.getState() === 'visible') {
      this.setState('hiding');

      // First we hide the gallery
      this.$sliderWrapperClone.animate({'opacity':0}, 400, 'easeInQuad', function() {
            that.$sliderWrapperClone.hide();
            // Then we show the show the slider
            that.$gallery.css({'opacity':0}).show().animate({'opacity':1}, 400, 'easeOutQuad', function() {
                  that.setState('hidden');
                });
          });
    }

  };


  this.getState = function() {
    return state;
  };

  this.getCurrentSlide = function() {
    return currentSlide;
  };

  this.setState = function(_state) {
    state = _state;
  };

  this.setCurrentSlide = function(_currentSlide) {
    currentSlide = _currentSlide;
  };

  // Init the Gallery
  this.initGallery();
}


// used by the slider
function ImageData(data) {
  this.title = data.title;
  this.medium = data.medium;
  this.yearCompleted = data.yearCompleted;
  this.enlargeImageHref = data.enlargeImageHref;

  this.getTitle = function() {
    return this.title;
  };

  this.getMedium = function() {
    return this.medium;
  };

  this.getYearCompleted = function() {
    return this.yearCompleted;
  };

  this.getEnlargeImageHref = function() {
    return this.enlargeImageHref;
  };

  this.getFullImageDetails = function() {
    return this.title + ', ' + this.medium + ' ' + this.yearCompleted;
  };
}