/**
 * Parallax
 *
 * Translate3d
 * 1.0 | Muffin Group
 */

var mfnSetup = {
  translate: null
};

(function($) {

  /* globals jQuery */

  "use strict";

  /**
   * mfnSetup
   */

  // has3d

  var has3d = function() {

    if (!window.getComputedStyle) {
      return false;
    }

    var el = document.createElement('div'),
      has3d,
      transforms = {
        'webkitTransform': '-webkit-transform',
        'OTransform': '-o-transform',
        'msTransform': '-ms-transform',
        'MozTransform': '-moz-transform',
        'transform': 'transform'
      };

    document.body.insertBefore(el, null);

    for (var t in transforms) {
      if (el.style[t] !== undefined) {
        el.style[t] = "translate3d(1px,1px,1px)";
        has3d = window.getComputedStyle(el).getPropertyValue(transforms[t]);
      }
    }

    document.body.removeChild(el);

    return (has3d !== undefined && has3d !== null && has3d.length > 0 && has3d !== "none");
  };

  // browserPrefix

  var browserPrefix = function() {

    var el = document.createElement('div'),
      vendor = ["ms", "O", "Webkit", "Moz"],
      i, prefix;

    for (i in vendor) {
      if (el.style[vendor[i] + "Transition"] !== undefined) {
        prefix = vendor[i];
        break;
      }
    }
    return prefix;
  };

  // __construct

  var __construct = function() {

    if (has3d()) {

      mfnSetup.translate = function(el, x, y) {
        el.css('-' + browserPrefix() + '-transform', 'translate3d(' + x + ', ' + y + ', 0)');
      };

    } else {

      mfnSetup.translate = function(el, x, y) {
        el.css({
          "left": x,
          "top": y
        });
      };

    }
  };

  __construct();

})(jQuery);

(function($) {

  "use strict";

  /**
   * $.fn.mfnParallax
   */

  $.fn.mfnParallax = function() {

    var el = $(this),
      parent = el.parent(),
      speed = 500,
      element, parentPos, windowH;

    // imageSize

    var imageSize = function(img) {

      var w, h, l, t; // width, height, left, top

      var imageW = img.get(0).naturalWidth;
      var imageH = img.get(0).naturalHeight;

      var parentW = img.parent().outerWidth();
      var parentH = img.parent().outerHeight();

      var windowH = $(window).height();

      // fix for small sections
      if (windowH > parentH) {
        parentH = windowH;
      }

      var diff = imageW / parentW;

      if ((imageH / diff) < parentH) {

        w = imageW / (imageH / parentH);
        h = parentH;

        if (w > imageW) {

          w = imageW;
          h = imageH;

        }

      } else {

        w = parentW;
        h = imageH / diff;

      }

      l = (parentW - w) / 2;
      t = (parentH - h) / 2;

      return [w, h, l, t];
    };

    // parallax

    var parallax = function() {

      var scrollTop = $(window).scrollTop(),
        scrollDiff, ratio, translateTop;

      if (parentPos !== undefined) {

        if (scrollTop >= parentPos.min && scrollTop <= parentPos.max) {

          scrollDiff = scrollTop - parentPos.min;
          ratio = scrollDiff / parentPos.height;

          translateTop = windowH + (ratio * speed) - scrollDiff - (speed * (windowH / parentPos.height));

          mfnSetup.translate(el, element.left + "px", -Math.round(translateTop) + "px");
        }

      }
    };

    // init

    var init = function() {

      windowH = $(window).height();

      var initElement = function() {

        var size = imageSize(el);

        el.removeAttr('style').css({
          'width': size[0],
          'height': size[1]
        });

        mfnSetup.translate(el, size[2] + "px", size[3] + "px");

        return {
          'width': size[0],
          'height': size[1],
          'left': size[2],
          'top': size[3]
        };
      };

      element = initElement();

      var initParent = function() {

        var min = parent.offset().top - $(window).height();
        var max = parent.offset().top + $(parent).outerHeight();

        return {
          'min': min,
          'max': max,
          'height': max - min
        };
      };

      parentPos = initParent();
    };

    // reload

    var reload = function() {

      setTimeout(function() {
        init();
        parallax();
      }, 50);

    };

    // .bind()

    $(window).bind('load resize', reload);
    $(window).bind('scroll', parallax);

  };

  /**
   * $(document).ready
   * Specify a function to execute when the DOM is fully loaded.
   */

  $(document).ready(function() {

    if ($(".mfn-parallax").length) {

      $(".mfn-parallax").each(function() {
        $(this).mfnParallax();
      });

    }

  });

})(jQuery);