(function($){
  
  $.fn.epicGalleryify = function(opt) {
    return this.each(function(){
      
      var options = $.extend({scrollAmount: null}, opt);
      var wrapper = $(this);
      wrapper.addClass('galleryfied');
      var list = wrapper.children("ul:first");
      var items = list.children("li");
      var images = list.find("img");
      
      // Get total wrapper width
      var wrapper_width = 0;
      items.each(function(){
        wrapper_width += $(this).width() + 22; // image width + padding + border
      });
      
      // Get highest item height
      var wrapper_height = 0;
      items.each(function(){
        var item = $(this);
        if(item.height() > wrapper_height) {
          wrapper_height = item.height();
        }
      });
      
      // Set wrapper width
      list.width(wrapper_width);
      wrapper.height(wrapper_height);
      
      // Create faders
      var rightFade = $('<div class="right fade">').prependTo(wrapper);
      var leftFade = $('<div class="left fade">').prependTo(wrapper);
      
      // Create the bottom slider
      var slider_count = Math.round(wrapper_width / 960);
      var top_slider = $('<ul class="top_slider slider">');
      // Create our slider bullets
      for(var i = 1; i <= slider_count; i++) {
        var slider_item = $('<li>');
        var slider_link = $('<a>').text(i).attr({href: '#'});
        if(i == 1) slider_link.addClass('activeSlider');
        slider_item.append(slider_link);
        top_slider.append(slider_item);
      }
      var bottom_slider = $('<ul class="bottom_slider slider">');
      // Create our slider bullets
      for(var i = 1; i <= slider_count; i++) {
        var slider_item = $('<li>');
        var slider_link = $('<a>').text(i).attr({href: '#'});
        if(i == 1) slider_link.addClass('activeSlider');
        slider_item.append(slider_link);
        bottom_slider.append(slider_item);
        /*
        if(i == 1) {
          var slider_item = $('<li>')
          var slider_link = $('<a class="activeSlider">').text(i).attr({href: '#'});
          slider_item.append(slider_link);
          bottom_slider.append(slider_item);
        } else {
          var slider_item = $('<li>')
          var slider_link = $('<a>').text(i).attr({href: '#'});
          slider_item.append(slider_link);
          bottom_slider.append(slider_item);
        }
        */
      }
      // Create the bottom status text box
      var bottom_status = $('<div class="bottom_status status"></div>');
      bottom_status.html("Page <span class=\"current\">1</span> of <span class=\"total\">"+slider_count+"</span>");
      // Create the top status text box
      var top_status = $('<div class="top_status status"></div>');
      top_status.html("Page <span class=\"current\">1</span> of <span class=\"total\">"+slider_count+"</span>");
      // Position bottom slider correctly to center
      top_slider.css('margin-left',(((slider_count * 20) / 2) * -1)+'px');
      bottom_slider.css('margin-left',(((slider_count * 20) / 2) * -1)+'px');
      // Insert slider
      top_slider.appendTo(wrapper);
      bottom_slider.appendTo(wrapper);
      // Insert status
      top_status.appendTo(wrapper);
      bottom_status.appendTo(wrapper);
      // Set our step width
      var step_amount = wrapper_width / slider_count;
      // Assign actions
      top_slider.find("a").each(function(i){
        $(this).bind('click',{options: options, list: list, index:i,step_amount: step_amount, wrapper: wrapper,slider_count: slider_count},scrollGallery);
        $(this).bind('click',{slider:top_slider},setActive);
      });
      bottom_slider.find("a").each(function(i){
        $(this).bind('click',{options: options, list: list, index:i,step_amount: step_amount, wrapper: wrapper,slider_count: slider_count},scrollGallery);
        $(this).bind('click',{slider:bottom_slider},setActive);
      });
      // Check fade straight off the bat
      checkFade(list,step_amount,wrapper,slider_count);
    });
  };
  
  setActive = function(event) {
    var activeSliderIndex = $(event.data.slider.find("a")).index(this);
    var sliders = $(this).parents(".wrap:first").find(".slider");
    sliders.find("a.activeSlider").removeClass("activeSlider");
    sliders.each(function(){
      $(this).find("a:eq("+activeSliderIndex+")").addClass('activeSlider');
    });
  };
  
  scrollGallery = function(event) {
    var sa = null; 
    if(event.data.options.scrollAmount == null) {
      sa = Math.round(event.data.step_amount);
    } else {
      sa = event.data.options.scrollAmount;
    }
    var l = event.data.list;
    var w = event.data.wrapper;
    var sc = event.data.slider_count;
    var ns = (sa * event.data.index) * -1;
    l.animate({left:ns},'slow',function(){
      checkFade(l,sa,w,sc);
    });
    setStatus(event.data.index,$(this).parents(".wrap:first"));
    return false;
  };
  
  setStatus = function(index,wrap) {
    wrap.find(".status span.current").text(index+1);
  };
  
  checkFade = function(list,scrollAmount,wrapper,sliderCount) {
    var l = list.css('left').split('p')[0];
    if(l == 0) {
      wrapper.find(".left").fadeOut('fast');
    } else {
      wrapper.find(".left").fadeIn('fast');
    }
    if(l == ((scrollAmount*(sliderCount-1)) * -1)) {
      wrapper.find(".right").fadeOut('fast');
    } else {
      wrapper.find(".right").fadeIn('fast');
    }
  }

})(jQuery);
