/*
jQuery.filmstrip

A simple jQuery plugin to create a sliding film strip carousel
Released by Greg Leuch <http://gleuch.com>, originally for Magma <http://mag.ma>.

*/
(function($) {
  $.filmstrip = {};

  $.fn.filmstrip = function(settings) {
    this.each(function() {
      var s = $.extend($.evalJSON($.toJSON($.filmstrip.defaultSettings)), (settings && typeof(settings) == 'object' ? settings : {}));
      s.strip = $(this);
      $.filmstrip.create(s);
    });
  };


	$.extend($.filmstrip, {
    defaultSettings: {
/*
      Movement can be:
        'slide'   Moves directionally in increments, Triggered by hover effect
        'page'    Moves each strip in pagination (moves set motion). Triggered by click event.
*/
      movement : 'slide', strip: false, offsetMin : 0, offsetMax : 0, viewWidth: 0, leftOffset : false, continueOn: false, timeout : false, speed : 250, pageBy : '.row', pageIndex : 0, keyframes : false
    },
    
    create : function($s) {
      var strip = $s.strip, items = strip.html(), arrowLeft, arrowRight, area, viewWidth, itemsWidth;
      if (strip.hasClass('filmstrip')) return;

      strip.addClass('filmstrip').addClass('invisible').html('<div class="filmstrip_area c"><div class="arrow left invisible disabled"><span></span></div><div class="invisible items" /><div class="arrow right invisible disabled"><span></span></div></div>');
      if ($s.movement == 'page' && typeof($s.keyframes) == 'object' && $s.keyframes.length > 0) {
        strip.prepend('<div class="keyframes c"></div>');
        var keyframes = strip.find('.keyframes');
        $.each($s.keyframes, function(i) {
          keyframes.append('<a href="#" class="keyframe keyframe_'+i+'">'+ this +'</a>');
          strip.find('.keyframe_'+i).click(function() {$.filmstrip.pageTo($s, i); return false;});
        });
        $.filmstrip.keyframeAdjust($s);
      }

      arrowLeft = strip.find('.arrow.left');
      arrowRight = strip.find('.arrow.right');
      area = strip.find('.items');
      area.html(items);

      $.filmstrip.offsets($s);

      itemsWidth = area.width();
      area.css({'left':($s.leftOffset && $s.leftOffset > 0 ? $s.leftOffset : arrowLeft.width())+'px'});

      if (area.width() > $s.viewWidth || $s.continueOn) {
        if ($s.movement == 'page') {
          arrowLeft.removeClass('invisible').hover(function() {$(this).addClass('hover');}, function() {$(this).removeClass('hover');}).click(function() {$.filmstrip.pageLeft($s);});
          arrowRight.removeClass('invisible').removeClass('disabled').hover(function() {$(this).addClass('hover');}, function() {$(this).removeClass('hover');}).click(function() {$.filmstrip.pageRight($s);});
        } else {
          arrowLeft.removeClass('invisible').hover(function() {$(this).addClass('hover'); $.filmstrip.moveLeft($s);}, function() {$(this).removeClass('hover'); $.filmstrip.clearMove($s)});
          arrowRight.removeClass('invisible').removeClass('disabled').hover(function() {$(this).addClass('hover'); $.filmstrip.moveRight($s);}, function() {$(this).removeClass('hover'); $.filmstrip.clearMove($s)});
        }
      }

      strip.find('.filmstrip_area').css({'width':strip.width()+'px', 'height':area.height()+'px'});
      $(window).resize(function() {$.filmstrip.offsets($s);});
      area.removeClass('invisible');
      strip.removeClass('invisible');
    },

    offsets : function($s) {
      var strip = $s.strip, arrowLeft = strip.find('.arrow.left'), arrowRight = strip.find('.arrow.right'), area = strip.find('.items'), viewWidth = (strip.width()-arrowLeft.width()-arrowRight.width()), a=0, w=0;

      if ($s.movement == 'page') {
        area.find($s.pageBy).each(function() {
          a += viewWidth;
          w = 0;
          $(this).css({'width' : viewWidth+'px'});/*.children().each(function() {w += $(this).width();})
          $(this).css({'marginLeft' : ((viewWidth-w)/2)+'px'});*/
        });
        area.css({'minWidth' : a+'px'});
      }

      $s.offsetMin = arrowLeft.width();
      $s.offsetMax = (area.width()-(strip.width()-arrowRight.width())) * -1;
      $s.viewWidth = viewWidth;
    },

    keyframeAdjust : function($s) {
      $s.strip.find('.keyframe').removeClass('current');
      $s.strip.find('.keyframe_'+$s.pageIndex).addClass('current');
    },
    pageTo : function($s, i) {
      if (i > $s.pageIndex) {
        $.filmstrip.pageRight($s, (i-$s.pageIndex));
      } else if (i < $s.pageIndex) {
        $.filmstrip.pageLeft($s, ($s.pageIndex-i));
      }
    },
    pageLeft : function($s, i) {
      if (!i || i == '' || i < 1) i = 1;
      var strip = $s.strip,
        area = strip.find('.items'),
        curpos = parseInt(area.css('left')),
        newpos = curpos + ($s.viewWidth*i);
      
      if (curpos < $s.offsetMin && strip.find('.items:animated').size() < 1) {
        $s.pageIndex -= i;
        $.filmstrip.keyframeAdjust($s);

        strip.find('.arrow.right').removeClass('disabled');
        area.animate({'left' : newpos+'px'}, $s.speed);
        if (newpos >= $s.offsetMin) strip.find('.arrow.left').addClass('disabled');
      }
    },
    pageRight : function($s, i) {
      if (!i || i == '' || i < 1) i = 1;
      var strip = $s.strip,
        area = strip.find('.items'),
        curpos = parseInt(area.css('left')),
        newpos = curpos - ($s.viewWidth*i);
      
      if (curpos > $s.offsetMax && strip.find('.items:animated').size() < 1) {
        $s.pageIndex += i;
        $.filmstrip.keyframeAdjust($s);

        strip.find('.arrow.left').removeClass('disabled');
        area.animate({'left' : newpos+'px'}, $s.speed);
        if (newpos <= $s.offsetMax && !$s.continueOn) strip.find('.arrow.right').addClass('disabled');
      } else if ($s.continueOn && $s.continueOn != '') {
        location.href = $s.continueOn;
      }
    },

    moveLeft : function($s) {
      var strip = $s.strip,
        area = strip.find('.items'),
        curpos = parseInt(area.css('left')),
        newpos = (curpos + ($s.speed/100));

      if (curpos < $s.offsetMin) {
        strip.find('.arrow.right').removeClass('disabled');

        area.css({'left' : (newpos < $s.offsetMin ? newpos : $s.offsetMin)+'px'});
        $s.timeout = setTimeout(function() {$.filmstrip.moveLeft($s);}, 10);
      } else {
        strip.find('.arrow.left').addClass('disabled');
      }
    },    
    moveRight : function($s) {
      var strip = $s.strip,
        area = strip.find('.items'),
        curpos = parseInt(area.css('left')),
        newpos = (curpos - ($s.speed/100));

      if (curpos > $s.offsetMax) {
        strip.find('.arrow.left').removeClass('disabled');

        area.css({'left' : (newpos > $s.offsetMax ? newpos : $s.offsetMax)+'px'});
        $s.timeout = setTimeout(function() {$.filmstrip.moveRight($s);}, 10);
      } else {
        strip.find('.arrow.right').addClass('disabled');
      }
    },
    clearMove : function($s) {clearTimeout($s.timeout);}
  });

})(jQuery);