(function (global, factory) {

typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
typeof define === 'function' && define.amd ? define(factory) :
(global.StickySidebar = factory());

}(this, (function () { 'use strict';

var commonjsGlobal = typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};

function unwrapExports (x) {

return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;

}

function createCommonjsModule(fn, module) {

return module = { exports: {} }, fn(module, module.exports), module.exports;

}

var stickySidebar = createCommonjsModule(function (module, exports) { (function (global, factory) {

if (typeof undefined === "function" && undefined.amd) {
  undefined(['exports'], factory);
} else {
  factory(exports);
}

})(commonjsGlobal, function (exports) {

Object.defineProperty(exports, "__esModule", {
  value: true
});

function _classCallCheck(instance, Constructor) {
  if (!(instance instanceof Constructor)) {
    throw new TypeError("Cannot call a class as a function");
  }
}

var _createClass = function () {
  function defineProperties(target, props) {
    for (var i = 0; i < props.length; i++) {
      var descriptor = props[i];
      descriptor.enumerable = descriptor.enumerable || false;
      descriptor.configurable = true;
      if ("value" in descriptor) descriptor.writable = true;
      Object.defineProperty(target, descriptor.key, descriptor);
    }
  }

  return function (Constructor, protoProps, staticProps) {
    if (protoProps) defineProperties(Constructor.prototype, protoProps);
    if (staticProps) defineProperties(Constructor, staticProps);
    return Constructor;
  };
}();

/**
 * Sticky Sidebar JavaScript Plugin.
 * @version 3.3.4
 * @author Ahmed Bouhuolia <a.bouhuolia@gmail.com>
 * @license The MIT License (MIT)
 */
var StickySidebar = function () {

  // ---------------------------------
  // # Define Constants
  // ---------------------------------
  //
  var EVENT_KEY = '.stickySidebar';
  var DEFAULTS = {
    /**
     * Additional top spacing of the element when it becomes sticky.
     * @type {Numeric|Function}
     */
    topSpacing: 0,

    /**
     * Additional bottom spacing of the element when it becomes sticky.
     * @type {Numeric|Function}
     */
    bottomSpacing: 0,

    /**
     * Container sidebar selector to know what the beginning and end of sticky element.
     * @type {String|False}
     */
    containerSelector: false,

    /**
     * Inner wrapper selector.
     * @type {String}
     */
    innerWrapperSelector: '.inner-wrapper-sticky',

    /**
     * The name of CSS class to apply to elements when they have become stuck.
     * @type {String|False}
     */
    stickyClass: 'is-affixed',

    /**
     * Detect when sidebar and its container change height so re-calculate their dimensions.
     * @type {Boolean}
     */
    resizeSensor: true,

    /**
     * The sidebar returns to its normal position if its width below this value.
     * @type {Numeric}
     */
    minWidth: false
  };

  // ---------------------------------
  // # Class Definition
  // ---------------------------------
  //
  /**
   * Sticky Sidebar Class.
   * @public
   */

  var StickySidebar = function () {

    /**
     * Sticky Sidebar Constructor.
     * @constructor
     * @param {HTMLElement|String} sidebar - The sidebar element or sidebar selector.
     * @param {Object} options - The options of sticky sidebar.
     */
    function StickySidebar(sidebar) {
      var _this = this;

      var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};

      _classCallCheck(this, StickySidebar);

      this.options = StickySidebar.extend(DEFAULTS, options);

      // Sidebar element query if there's no one, throw error.
      this.sidebar = 'string' === typeof sidebar ? document.querySelector(sidebar) : sidebar;
      if ('undefined' === typeof this.sidebar) throw new Error("There is no specific sidebar element.");

      this.sidebarInner = false;
      this.container = this.sidebar.parentElement;

      // Current Affix Type of sidebar element.
      this.affixedType = 'STATIC';
      this.direction = 'down';
      this.support = {
        transform: false,
        transform3d: false
      };

      this._initialized = false;
      this._reStyle = false;
      this._breakpoint = false;

      // Dimensions of sidebar, container and screen viewport.
      this.dimensions = {
        translateY: 0,
        maxTranslateY: 0,
        topSpacing: 0,
        lastTopSpacing: 0,
        bottomSpacing: 0,
        lastBottomSpacing: 0,
        sidebarHeight: 0,
        sidebarWidth: 0,
        containerTop: 0,
        containerHeight: 0,
        viewportHeight: 0,
        viewportTop: 0,
        lastViewportTop: 0
      };

      // Bind event handlers for referencability.
      ['handleEvent'].forEach(function (method) {
        _this[method] = _this[method].bind(_this);
      });

      // Initialize sticky sidebar for first time.
      this.initialize();
    }

    /**
     * Initializes the sticky sidebar by adding inner wrapper, define its container, 
     * min-width breakpoint, calculating dimensions, adding helper classes and inline style.
     * @private
     */

    _createClass(StickySidebar, [{
      key: 'initialize',
      value: function initialize() {
        var _this2 = this;

        this._setSupportFeatures();

        // Get sticky sidebar inner wrapper, if not found, will create one.
        if (this.options.innerWrapperSelector) {
          this.sidebarInner = this.sidebar.querySelector(this.options.innerWrapperSelector);

          if (null === this.sidebarInner) this.sidebarInner = false;
        }

        if (!this.sidebarInner) {
          var wrapper = document.createElement('div');
          wrapper.setAttribute('class', 'inner-wrapper-sticky');
          this.sidebar.appendChild(wrapper);

          while (this.sidebar.firstChild != wrapper) {
            wrapper.appendChild(this.sidebar.firstChild);
          }this.sidebarInner = this.sidebar.querySelector('.inner-wrapper-sticky');
        }

        // Container wrapper of the sidebar.
        if (this.options.containerSelector) {
          var containers = document.querySelectorAll(this.options.containerSelector);
          containers = Array.prototype.slice.call(containers);

          containers.forEach(function (container, item) {
            if (!container.contains(_this2.sidebar)) return;
            _this2.container = container;
          });

          if (!containers.length) throw new Error("The container does not contains on the sidebar.");
        }

        // If top/bottom spacing is not function parse value to integer.
        if ('function' !== typeof this.options.topSpacing) this.options.topSpacing = parseInt(this.options.topSpacing) || 0;

        if ('function' !== typeof this.options.bottomSpacing) this.options.bottomSpacing = parseInt(this.options.bottomSpacing) || 0;

        // Breakdown sticky sidebar if screen width below `options.minWidth`.
        this._widthBreakpoint();

        // Calculate dimensions of sidebar, container and viewport.
        this.calcDimensions();

        // Affix sidebar in proper position.
        this.stickyPosition();

        // Bind all events.
        this.bindEvents();

        // Inform other properties the sticky sidebar is initialized.
        this._initialized = true;
      }
    }, {
      key: 'bindEvents',
      value: function bindEvents() {
        window.addEventListener('resize', this, { passive: true, capture: false });
        window.addEventListener('scroll', this, { passive: true, capture: false });

        this.sidebar.addEventListener('update' + EVENT_KEY, this);

        if (this.options.resizeSensor && 'undefined' !== typeof ResizeSensor) {
          new ResizeSensor(this.sidebarInner, this.handleEvent);
          new ResizeSensor(this.container, this.handleEvent);
        }
      }
    }, {
      key: 'handleEvent',
      value: function handleEvent(event) {
        this.updateSticky(event);
      }
    }, {
      key: 'calcDimensions',
      value: function calcDimensions() {
        if (this._breakpoint) return;
        var dims = this.dimensions;

        // Container of sticky sidebar dimensions.
        dims.containerTop = StickySidebar.offsetRelative(this.container).top;
        dims.containerHeight = this.container.clientHeight;
        dims.containerBottom = dims.containerTop + dims.containerHeight;

        // Sidebar dimensions.
        dims.sidebarHeight = this.sidebarInner.offsetHeight;
        dims.sidebarWidth = this.sidebarInner.offsetWidth;

        // Screen viewport dimensions.
        dims.viewportHeight = window.innerHeight;

        // Maximum sidebar translate Y.
        dims.maxTranslateY = dims.containerHeight - dims.sidebarHeight;

        this._calcDimensionsWithScroll();
      }
    }, {
      key: '_calcDimensionsWithScroll',
      value: function _calcDimensionsWithScroll() {
        var dims = this.dimensions;

        dims.sidebarLeft = StickySidebar.offsetRelative(this.sidebar).left;

        dims.viewportTop = document.documentElement.scrollTop || document.body.scrollTop;
        dims.viewportBottom = dims.viewportTop + dims.viewportHeight;
        dims.viewportLeft = document.documentElement.scrollLeft || document.body.scrollLeft;

        dims.topSpacing = this.options.topSpacing;
        dims.bottomSpacing = this.options.bottomSpacing;

        if ('function' === typeof dims.topSpacing) dims.topSpacing = parseInt(dims.topSpacing(this.sidebar)) || 0;

        if ('function' === typeof dims.bottomSpacing) dims.bottomSpacing = parseInt(dims.bottomSpacing(this.sidebar)) || 0;

        if ('VIEWPORT-TOP' === this.affixedType) {
          // Adjust translate Y in the case decrease top spacing value.
          if (dims.topSpacing < dims.lastTopSpacing) {
            dims.translateY += dims.lastTopSpacing - dims.topSpacing;
            this._reStyle = true;
          }
        } else if ('VIEWPORT-BOTTOM' === this.affixedType) {
          // Adjust translate Y in the case decrease bottom spacing value.
          if (dims.bottomSpacing < dims.lastBottomSpacing) {
            dims.translateY += dims.lastBottomSpacing - dims.bottomSpacing;
            this._reStyle = true;
          }
        }

        dims.lastTopSpacing = dims.topSpacing;
        dims.lastBottomSpacing = dims.bottomSpacing;
      }
    }, {
      key: 'isSidebarFitsViewport',
      value: function isSidebarFitsViewport() {
        var dims = this.dimensions;
        var offset = this.scrollDirection === 'down' ? dims.lastBottomSpacing : dims.lastTopSpacing;
        return this.dimensions.sidebarHeight + offset < this.dimensions.viewportHeight;
      }
    }, {
      key: 'observeScrollDir',
      value: function observeScrollDir() {
        var dims = this.dimensions;
        if (dims.lastViewportTop === dims.viewportTop) return;

        var furthest = 'down' === this.direction ? Math.min : Math.max;

        // If the browser is scrolling not in the same direction.
        if (dims.viewportTop === furthest(dims.viewportTop, dims.lastViewportTop)) this.direction = 'down' === this.direction ? 'up' : 'down';
      }
    }, {
      key: 'getAffixType',
      value: function getAffixType() {
        this._calcDimensionsWithScroll();
        var dims = this.dimensions;
        var colliderTop = dims.viewportTop + dims.topSpacing;
        var affixType = this.affixedType;

        if (colliderTop <= dims.containerTop || dims.containerHeight <= dims.sidebarHeight) {
          dims.translateY = 0;
          affixType = 'STATIC';
        } else {
          affixType = 'up' === this.direction ? this._getAffixTypeScrollingUp() : this._getAffixTypeScrollingDown();
        }

        // Make sure the translate Y is not bigger than container height.
        dims.translateY = Math.max(0, dims.translateY);
        dims.translateY = Math.min(dims.containerHeight, dims.translateY);
        dims.translateY = Math.round(dims.translateY);

        dims.lastViewportTop = dims.viewportTop;
        return affixType;
      }
    }, {
      key: '_getAffixTypeScrollingDown',
      value: function _getAffixTypeScrollingDown() {
        var dims = this.dimensions;
        var sidebarBottom = dims.sidebarHeight + dims.containerTop;
        var colliderTop = dims.viewportTop + dims.topSpacing;
        var colliderBottom = dims.viewportBottom - dims.bottomSpacing;
        var affixType = this.affixedType;

        if (this.isSidebarFitsViewport()) {
          if (dims.sidebarHeight + colliderTop >= dims.containerBottom) {
            dims.translateY = dims.containerBottom - sidebarBottom;
            affixType = 'CONTAINER-BOTTOM';
          } else if (colliderTop >= dims.containerTop) {
            dims.translateY = colliderTop - dims.containerTop;
            affixType = 'VIEWPORT-TOP';
          }
        } else {
          if (dims.containerBottom <= colliderBottom) {
            dims.translateY = dims.containerBottom - sidebarBottom;
            affixType = 'CONTAINER-BOTTOM';
          } else if (sidebarBottom + dims.translateY <= colliderBottom) {
            dims.translateY = colliderBottom - sidebarBottom;
            affixType = 'VIEWPORT-BOTTOM';
          } else if (dims.containerTop + dims.translateY <= colliderTop && 0 !== dims.translateY && dims.maxTranslateY !== dims.translateY) {
            affixType = 'VIEWPORT-UNBOTTOM';
          }
        }

        return affixType;
      }
    }, {
      key: '_getAffixTypeScrollingUp',
      value: function _getAffixTypeScrollingUp() {
        var dims = this.dimensions;
        var sidebarBottom = dims.sidebarHeight + dims.containerTop;
        var colliderTop = dims.viewportTop + dims.topSpacing;
        var colliderBottom = dims.viewportBottom - dims.bottomSpacing;
        var affixType = this.affixedType;

        if (colliderTop <= dims.translateY + dims.containerTop) {
          dims.translateY = colliderTop - dims.containerTop;
          affixType = 'VIEWPORT-TOP';
        } else if (dims.containerBottom <= colliderBottom) {
          dims.translateY = dims.containerBottom - sidebarBottom;
          affixType = 'CONTAINER-BOTTOM';
        } else if (!this.isSidebarFitsViewport()) {

          if (dims.containerTop <= colliderTop && 0 !== dims.translateY && dims.maxTranslateY !== dims.translateY) {
            affixType = 'VIEWPORT-UNBOTTOM';
          }
        }

        return affixType;
      }
    }, {
      key: '_getStyle',
      value: function _getStyle(affixType) {
        if ('undefined' === typeof affixType) return;

        var style = { inner: {}, outer: {} };
        var dims = this.dimensions;

        switch (affixType) {
          case 'VIEWPORT-TOP':
            style.inner = { position: 'fixed', top: dims.topSpacing,
              left: dims.sidebarLeft - dims.viewportLeft, width: dims.sidebarWidth };
            break;
          case 'VIEWPORT-BOTTOM':
            style.inner = { position: 'fixed', top: 'auto', left: dims.sidebarLeft,
              bottom: dims.bottomSpacing, width: dims.sidebarWidth };
            break;
          case 'CONTAINER-BOTTOM':
          case 'VIEWPORT-UNBOTTOM':
            var translate = this._getTranslate(0, dims.translateY + 'px');

            if (translate) style.inner = { transform: translate };else style.inner = { position: 'absolute', top: dims.translateY, width: dims.sidebarWidth };
            break;
        }

        switch (affixType) {
          case 'VIEWPORT-TOP':
          case 'VIEWPORT-BOTTOM':
          case 'VIEWPORT-UNBOTTOM':
          case 'CONTAINER-BOTTOM':
            style.outer = { height: dims.sidebarHeight, position: 'relative' };
            break;
        }

        style.outer = StickySidebar.extend({ height: '', position: '' }, style.outer);
        style.inner = StickySidebar.extend({ position: 'relative', top: '', left: '',
          bottom: '', width: '', transform: '' }, style.inner);

        return style;
      }
    }, {
      key: 'stickyPosition',
      value: function stickyPosition(force) {
        if (this._breakpoint) return;

        force = this._reStyle || force || false;

        var offsetTop = this.options.topSpacing;
        var offsetBottom = this.options.bottomSpacing;

        var affixType = this.getAffixType();
        var style = this._getStyle(affixType);

        if ((this.affixedType != affixType || force) && affixType) {
          var affixEvent = 'affix.' + affixType.toLowerCase().replace('viewport-', '') + EVENT_KEY;
          StickySidebar.eventTrigger(this.sidebar, affixEvent);

          if ('STATIC' === affixType) StickySidebar.removeClass(this.sidebar, this.options.stickyClass);else StickySidebar.addClass(this.sidebar, this.options.stickyClass);

          for (var key in style.outer) {
            var unit = 'number' === typeof style.outer[key] ? 'px' : '';
            this.sidebar.style[key] = style.outer[key] + unit;
          }

          for (var _key in style.inner) {
            var _unit = 'number' === typeof style.inner[_key] ? 'px' : '';
            this.sidebarInner.style[_key] = style.inner[_key] + _unit;
          }

          var affixedEvent = 'affixed.' + affixType.toLowerCase().replace('viewport-', '') + EVENT_KEY;
          StickySidebar.eventTrigger(this.sidebar, affixedEvent);
        } else {
          if (this._initialized) this.sidebarInner.style.left = style.inner.left;
        }

        this.affixedType = affixType;
      }
    }, {
      key: '_widthBreakpoint',
      value: function _widthBreakpoint() {

        if (window.innerWidth <= this.options.minWidth) {
          this._breakpoint = true;
          this.affixedType = 'STATIC';

          this.sidebar.removeAttribute('style');
          StickySidebar.removeClass(this.sidebar, this.options.stickyClass);
          this.sidebarInner.removeAttribute('style');
        } else {
          this._breakpoint = false;
        }
      }
    }, {
      key: 'updateSticky',
      value: function updateSticky() {
        var _this3 = this;

        var event = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};

        if (this._running) return;
        this._running = true;

        (function (eventType) {
          requestAnimationFrame(function () {
            switch (eventType) {
              // When browser is scrolling and re-calculate just dimensions
              // within scroll. 
              case 'scroll':
                _this3._calcDimensionsWithScroll();
                _this3.observeScrollDir();
                _this3.stickyPosition();
                break;

              // When browser is resizing or there's no event, observe width
              // breakpoint and re-calculate dimensions.
              case 'resize':
              default:
                _this3._widthBreakpoint();
                _this3.calcDimensions();
                _this3.stickyPosition(true);
                break;
            }
            _this3._running = false;
          });
        })(event.type);
      }
    }, {
      key: '_setSupportFeatures',
      value: function _setSupportFeatures() {
        var support = this.support;

        support.transform = StickySidebar.supportTransform();
        support.transform3d = StickySidebar.supportTransform(true);
      }
    }, {
      key: '_getTranslate',
      value: function _getTranslate() {
        var y = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
        var x = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
        var z = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;

        if (this.support.transform3d) return 'translate3d(' + y + ', ' + x + ', ' + z + ')';else if (this.support.translate) return 'translate(' + y + ', ' + x + ')';else return false;
      }
    }, {
      key: 'destroy',
      value: function destroy() {
        window.removeEventListener('resize', this, { capture: false });
        window.removeEventListener('scroll', this, { capture: false });

        this.sidebar.classList.remove(this.options.stickyClass);
        this.sidebar.style.minHeight = '';

        this.sidebar.removeEventListener('update' + EVENT_KEY, this);

        var styleReset = { inner: {}, outer: {} };

        styleReset.inner = { position: '', top: '', left: '', bottom: '', width: '', transform: '' };
        styleReset.outer = { height: '', position: '' };

        for (var key in styleReset.outer) {
          this.sidebar.style[key] = styleReset.outer[key];
        }for (var _key2 in styleReset.inner) {
          this.sidebarInner.style[_key2] = styleReset.inner[_key2];
        }if (this.options.resizeSensor && 'undefined' !== typeof ResizeSensor) {
          ResizeSensor.detach(this.sidebarInner, this.handleEvent);
          ResizeSensor.detach(this.container, this.handleEvent);
        }
      }
    }], [{
      key: 'supportTransform',
      value: function supportTransform(transform3d) {
        var result = false,
            property = transform3d ? 'perspective' : 'transform',
            upper = property.charAt(0).toUpperCase() + property.slice(1),
            prefixes = ['Webkit', 'Moz', 'O', 'ms'],
            support = document.createElement('support'),
            style = support.style;

        (property + ' ' + prefixes.join(upper + ' ') + upper).split(' ').forEach(function (property, i) {
          if (style[property] !== undefined) {
            result = property;
            return false;
          }
        });
        return result;
      }
    }, {
      key: 'eventTrigger',
      value: function eventTrigger(element, eventName, data) {
        try {
          var event = new CustomEvent(eventName, { detail: data });
        } catch (e) {
          var event = document.createEvent('CustomEvent');
          event.initCustomEvent(eventName, true, true, data);
        }
        element.dispatchEvent(event);
      }
    }, {
      key: 'extend',
      value: function extend(defaults, options) {
        var results = {};
        for (var key in defaults) {
          if ('undefined' !== typeof options[key]) results[key] = options[key];else results[key] = defaults[key];
        }
        return results;
      }
    }, {
      key: 'offsetRelative',
      value: function offsetRelative(element) {
        var result = { left: 0, top: 0 };

        do {
          var offsetTop = element.offsetTop;
          var offsetLeft = element.offsetLeft;

          if (!isNaN(offsetTop)) result.top += offsetTop;

          if (!isNaN(offsetLeft)) result.left += offsetLeft;

          element = 'BODY' === element.tagName ? element.parentElement : element.offsetParent;
        } while (element);
        return result;
      }
    }, {
      key: 'addClass',
      value: function addClass(element, className) {
        if (!StickySidebar.hasClass(element, className)) {
          if (element.classList) element.classList.add(className);else element.className += ' ' + className;
        }
      }
    }, {
      key: 'removeClass',
      value: function removeClass(element, className) {
        if (StickySidebar.hasClass(element, className)) {
          if (element.classList) element.classList.remove(className);else element.className = element.className.replace(new RegExp('(^|\\b)' + className.split(' ').join('|') + '(\\b|$)', 'gi'), ' ');
        }
      }
    }, {
      key: 'hasClass',
      value: function hasClass(element, className) {
        if (element.classList) return element.classList.contains(className);else return new RegExp('(^| )' + className + '( |$)', 'gi').test(element.className);
      }
    }, {
      key: 'defaults',
      get: function () {
        return DEFAULTS;
      }
    }]);

    return StickySidebar;
  }();

  return StickySidebar;
}();

exports.default = StickySidebar;

// Global
// -------------------------
window.StickySidebar = StickySidebar;

}); });

unwrapExports(stickySidebar);

var jquery_stickySidebar = createCommonjsModule(function (module, exports) { (function (global, factory) {

if (typeof undefined === "function" && undefined.amd) {
  undefined(['./sticky-sidebar'], factory);
} else {
  factory(stickySidebar);
}

})(commonjsGlobal, function (_stickySidebar) {

var _stickySidebar2 = _interopRequireDefault(_stickySidebar);

function _interopRequireDefault(obj) {
  return obj && obj.__esModule ? obj : {
    default: obj
  };
}

(function () {
  if ('undefined' === typeof window) return;

  var plugin = window.$ || window.jQuery || window.Zepto;
  var DATA_NAMESPACE = 'stickySidebar';

  // Make sure the site has jquery or zepto plugin.
  if (plugin) {
    var _jQueryPlugin = function (config) {
      return this.each(function () {
        var $this = plugin(this),
            data = plugin(this).data(DATA_NAMESPACE);

        if (!data) {
          data = new _stickySidebar2.default(this, typeof config == 'object' && config);
          $this.data(DATA_NAMESPACE, data);
        }

        if ('string' === typeof config) {
          if (data[config] === undefined && ['destroy', 'updateSticky'].indexOf(config) === -1) throw new Error('No method named "' + config + '"');

          data[config]();
        }
      });
    };

    plugin.fn.stickySidebar = _jQueryPlugin;
    plugin.fn.stickySidebar.Constructor = _stickySidebar2.default;

    var old = plugin.fn.stickySidebar;

    /**
     * Sticky Sidebar No Conflict.
     */
    plugin.fn.stickySidebar.noConflict = function () {
      plugin.fn.stickySidebar = old;
      return this;
    };
  }
})();

}); });

var jquery_stickySidebar$1 = unwrapExports(jquery_stickySidebar);

return jquery_stickySidebar$1;

})));