jquery-sticky-table-header - npm Package Compare versions

Comparing version 0.2.0 to 0.2.1

build/jquery.stickyTableHeader.js

@@ -8,186 +8,324 @@ /*!
  */
-!function(root, factory) {
-    if ("object" == typeof exports && "object" == typeof module) module.exports = factory(require("jquery")); else if ("function" == typeof define && define.amd) define([ "jquery" ], factory); else {
-        var a = factory("object" == typeof exports ? require("jquery") : root.jQuery);
-        for (var i in a) ("object" == typeof exports ? exports : root)[i] = a[i];
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory(require("jquery"));
+	else if(typeof define === 'function' && define.amd)
+		define(["jquery"], factory);
+	else {
+		var a = typeof exports === 'object' ? factory(require("jquery")) : factory(root["jQuery"]);
+		for(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];
+	}
+})(this, function(__WEBPACK_EXTERNAL_MODULE_1__) {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 0);
+/******/ })
+/************************************************************************/
+/******/ ([
+/* 0 */
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+
+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; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+var $ = __webpack_require__(1); // eslint-disable-line import/no-unresolved
+var throttle = __webpack_require__(2);
+
+var PLUGIN_NAME = 'stickyTableHeader';
+
+var StickyTableHeader = function () {
+  _createClass(StickyTableHeader, null, [{
+    key: 'getTableSizes',
+    value: function getTableSizes($table) {
+      var offset = $table.offset();
+      var height = $table.outerHeight();
+      return {
+        bottomPos: offset.top + height,
+        height: height,
+        topPos: offset.top,
+        width: $table.outerWidth()
+      };
     }
-}(this, function(__WEBPACK_EXTERNAL_MODULE_1__) {
-    return function(modules) {
-        function __webpack_require__(moduleId) {
-            if (installedModules[moduleId]) return installedModules[moduleId].exports;
-            var module = installedModules[moduleId] = {
-                i: moduleId,
-                l: !1,
-                exports: {}
-            };
-            return modules[moduleId].call(module.exports, module, module.exports, __webpack_require__), 
-            module.l = !0, module.exports;
+  }, {
+    key: 'constructHeader',
+    value: function constructHeader($tableChildren, origTableClassName, _ref, _ref2) {
+      var width = _ref.width;
+      var header = _ref2.css.header,
+          zIndex = _ref2.zIndex;
+
+      var $clone = $tableChildren.clone(true);
+      return $('<table/>', {
+        'aria-hidden': true,
+        class: header
+      }).addClass(origTableClassName).css({
+        position: 'absolute',
+        boxSizing: 'border-box',
+        zIndex: zIndex,
+        width: width
+      }).append($clone);
+    }
+  }, {
+    key: 'logError',
+    value: function logError(message) {
+      console.error(PLUGIN_NAME + ': ' + message); // eslint-disable-line no-console
+    }
+  }, {
+    key: 'getOriginalCellWidths',
+    value: function getOriginalCellWidths($thead) {
+      return $thead.find('tr').map(function () {
+        return $(this).find('td, th').map(function () {
+          return this.getBoundingClientRect().width;
+        });
+      });
+    }
+  }, {
+    key: 'setCloneCellWidths',
+    value: function setCloneCellWidths($header, widths) {
+      $header.find('tr').each(function (trIndex) {
+        $(this).find('th, td').each(function (cellIndex) {
+          var width = widths[trIndex][cellIndex];
+          $(this).css({
+            boxSizing: 'border-box',
+            width: width
+          });
+        });
+      });
+    }
+  }]);
+
+  function StickyTableHeader($container, options) {
+    _classCallCheck(this, StickyTableHeader);
+
+    this.$container = $container;
+    this.options = $.extend(true, {}, $.fn.stickyTableHeader.defaults, options);
+
+    this.$table = this.$container.find('> table');
+
+    if (!this.$table.length) {
+      StickyTableHeader.logError('No table element found within container element');
+      return;
+    }
+
+    this.$win = $(window);
+    this.tableSizes = StickyTableHeader.getTableSizes(this.$table);
+
+    if (this.options.outsideViewportOnly && this.tableSizes.height < this.$win.height()) {
+      return;
+    }
+
+    this.$tableChildren = this.$table.children(':not(tbody)');
+    var $thead = this.$tableChildren.filter('thead');
+
+    this.$header = StickyTableHeader.constructHeader(this.$tableChildren, this.$table.attr('class'), this.tableSizes, this.options);
+
+    var cellWidths = StickyTableHeader.getOriginalCellWidths($thead);
+    StickyTableHeader.setCloneCellWidths(this.$header, cellWidths);
+
+    this.$header.prependTo(this.$container);
+    this.$container.css('position', 'relative');
+    this.$table.addClass(this.options.css.active);
+    this.attachScrollEvent();
+  }
+
+  _createClass(StickyTableHeader, [{
+    key: 'attachScrollEvent',
+    value: function attachScrollEvent() {
+      var $win = this.$win,
+          $header = this.$header,
+          _options = this.options,
+          scrollingClass = _options.css.scrolling,
+          scrollThrottle = _options.scrollThrottle;
+
+      var headerHeight = $header.outerHeight();
+      var _tableSizes = this.tableSizes,
+          tableTopPos = _tableSizes.topPos,
+          tableBottomPos = _tableSizes.bottomPos,
+          width = _tableSizes.width;
+
+      var isScrollingTable = true;
+
+      var handler = function handler() {
+        var scrollPos = $win.scrollTop();
+        var scrollInsideTable = scrollPos > tableTopPos && scrollPos < tableBottomPos - headerHeight;
+        var scrollAboveTable = scrollPos < tableTopPos;
+        var scrollBelowTable = scrollPos > tableBottomPos - headerHeight;
+
+        if (scrollInsideTable && isScrollingTable) {
+          $header.css({
+            position: 'fixed',
+            top: 0,
+            width: width
+          });
+          $header.addClass(scrollingClass);
+          isScrollingTable = false;
         }
-        var installedModules = {};
-        return __webpack_require__.m = modules, __webpack_require__.c = installedModules, 
-        __webpack_require__.d = function(exports, name, getter) {
-            __webpack_require__.o(exports, name) || Object.defineProperty(exports, name, {
-                configurable: !1,
-                enumerable: !0,
-                get: getter
-            });
-        }, __webpack_require__.n = function(module) {
-            var getter = module && module.__esModule ? function() {
-                return module.default;
-            } : function() {
-                return module;
-            };
-            return __webpack_require__.d(getter, "a", getter), getter;
-        }, __webpack_require__.o = function(object, property) {
-            return Object.prototype.hasOwnProperty.call(object, property);
-        }, __webpack_require__.p = "", __webpack_require__(__webpack_require__.s = 0);
-    }([ function(module, exports, __webpack_require__) {
-        "use strict";
-        function _classCallCheck(instance, Constructor) {
-            if (!(instance instanceof Constructor)) throw new TypeError("Cannot call a class as a function");
+        if (scrollAboveTable && !isScrollingTable) {
+          $header.css({
+            position: 'absolute',
+            top: 0,
+            bottom: 0,
+            width: width
+          });
+          $header.removeClass(scrollingClass);
+          isScrollingTable = true;
         }
-        var _createClass = function() {
-            function defineProperties(target, props) {
-                for (var i = 0; i < props.length; i++) {
-                    var descriptor = props[i];
-                    descriptor.enumerable = descriptor.enumerable || !1, descriptor.configurable = !0, 
-                    "value" in descriptor && (descriptor.writable = !0), Object.defineProperty(target, descriptor.key, descriptor);
-                }
-            }
-            return function(Constructor, protoProps, staticProps) {
-                return protoProps && defineProperties(Constructor.prototype, protoProps), staticProps && defineProperties(Constructor, staticProps), 
-                Constructor;
-            };
-        }(), $ = __webpack_require__(1), throttle = __webpack_require__(2), StickyTableHeader = function() {
-            function StickyTableHeader($container, options) {
-                if (_classCallCheck(this, StickyTableHeader), this.$container = $container, this.options = $.extend(!0, {}, $.fn.stickyTableHeader.defaults, options), 
-                this.$table = this.$container.find("> table"), !this.$table.length) return void StickyTableHeader.logError("No table element found within container element");
-                if (this.$win = $(window), this.tableSizes = StickyTableHeader.getTableSizes(this.$table), 
-                !(this.options.outsideViewportOnly && this.tableSizes.height < this.$win.height())) {
-                    this.$tableChildren = this.$table.children(":not(tbody)");
-                    var $thead = this.$tableChildren.filter("thead");
-                    this.$header = StickyTableHeader.constructHeader(this.$tableChildren, this.$table.attr("class"), this.tableSizes, this.options);
-                    var cellWidths = StickyTableHeader.getOriginalCellWidths($thead);
-                    StickyTableHeader.setCloneCellWidths(this.$header, cellWidths), this.$header.prependTo(this.$container), 
-                    this.$container.css("position", "relative"), this.$table.addClass(this.options.css.active), 
-                    this.attachScrollEvent();
-                }
-            }
-            return _createClass(StickyTableHeader, null, [ {
-                key: "getTableSizes",
-                value: function($table) {
-                    var offset = $table.offset(), height = $table.outerHeight();
-                    return {
-                        bottomPos: offset.top + height,
-                        height: height,
-                        topPos: offset.top,
-                        width: $table.outerWidth()
-                    };
-                }
-            }, {
-                key: "constructHeader",
-                value: function($tableChildren, origTableClassName, _ref, _ref2) {
-                    var width = _ref.width, header = _ref2.css.header, zIndex = _ref2.zIndex, $clone = $tableChildren.clone(!0);
-                    return $("<table/>", {
-                        "aria-hidden": !0,
-                        class: header
-                    }).addClass(origTableClassName).css({
-                        position: "absolute",
-                        boxSizing: "border-box",
-                        zIndex: zIndex,
-                        width: width
-                    }).append($clone);
-                }
-            }, {
-                key: "logError",
-                value: function(message) {
-                    console.error("StickyTableHeader: " + message);
-                }
-            }, {
-                key: "getOriginalCellWidths",
-                value: function($thead) {
-                    return $thead.find("tr").map(function() {
-                        return $(this).find("td, th").map(function() {
-                            return this.getBoundingClientRect().width;
-                        });
-                    });
-                }
-            }, {
-                key: "setCloneCellWidths",
-                value: function($header, widths) {
-                    $header.find("tr").each(function(trIndex) {
-                        $(this).find("th, td").each(function(cellIndex) {
-                            var width = widths[trIndex][cellIndex];
-                            $(this).css({
-                                boxSizing: "border-box",
-                                width: width
-                            });
-                        });
-                    });
-                }
-            } ]), _createClass(StickyTableHeader, [ {
-                key: "attachScrollEvent",
-                value: function() {
-                    var $win = this.$win, $header = this.$header, _options = this.options, scrollingClass = _options.css.scrolling, scrollThrottle = _options.scrollThrottle, headerHeight = $header.outerHeight(), _tableSizes = this.tableSizes, tableTopPos = _tableSizes.topPos, tableBottomPos = _tableSizes.bottomPos, width = _tableSizes.width, isScrollingTable = !0, handler = function() {
-                        var scrollPos = $win.scrollTop(), scrollInsideTable = scrollPos > tableTopPos && scrollPos < tableBottomPos - headerHeight, scrollAboveTable = scrollPos < tableTopPos, scrollBelowTable = scrollPos > tableBottomPos - headerHeight;
-                        scrollInsideTable && isScrollingTable && ($header.css({
-                            position: "fixed",
-                            top: 0,
-                            width: width
-                        }), $header.addClass(scrollingClass), isScrollingTable = !1), scrollAboveTable && !isScrollingTable && ($header.css({
-                            position: "absolute",
-                            top: 0,
-                            bottom: 0,
-                            width: width
-                        }), $header.removeClass(scrollingClass), isScrollingTable = !0), scrollBelowTable && !isScrollingTable && ($header.css({
-                            position: "absolute",
-                            top: "auto",
-                            bottom: 0,
-                            width: width
-                        }), $header.removeClass(scrollingClass), isScrollingTable = !0);
-                    };
-                    $win.on("scroll.StickyTableHeader", throttle(handler, scrollThrottle));
-                }
-            }, {
-                key: "detachScrollEvent",
-                value: function() {
-                    this.$win.off("scroll.StickyTableHeader");
-                }
-            }, {
-                key: "destroy",
-                value: function() {
-                    this.$header.remove(), this.$tableChildren.css("visibility", "visible"), this.detachScrollEvent();
-                }
-            } ]), StickyTableHeader;
-        }();
-        $.fn.stickyTableHeader = function(options) {
-            return this.each(function() {
-                var $this = $(this);
-                $this.data("stickyTableHeader") || $this.data("stickyTableHeader", new StickyTableHeader($this, options));
-            });
-        }, $.fn.stickyTableHeader.StickyTableHeader = StickyTableHeader, $.fn.stickyTableHeader.defaults = {
-            outsideViewportOnly: !0,
-            scrollThrottle: 50,
-            css: {
-                header: "StickyTableHeader",
-                scrolling: "is-scrolling",
-                active: "is-stickyTableHeaderActive"
-            },
-            zIndex: 2
-        };
-    }, function(module, exports) {
-        module.exports = __WEBPACK_EXTERNAL_MODULE_1__;
-    }, function(module, exports, __webpack_require__) {
-        "use strict";
-        function throttle(callback, wait) {
-            var context = arguments.length > 2 && void 0 !== arguments[2] ? arguments[2] : this, timeout = null, callbackArgs = null, later = function() {
-                callback.apply(context, callbackArgs), timeout = null;
-            };
-            return function() {
-                for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) args[_key] = arguments[_key];
-                timeout || (callbackArgs = args, timeout = setTimeout(later, wait));
-            };
+        if (scrollBelowTable && !isScrollingTable) {
+          $header.css({
+            position: 'absolute',
+            top: 'auto',
+            bottom: 0,
+            width: width
+          });
+          $header.removeClass(scrollingClass);
+          isScrollingTable = true;
         }
-        module.exports = throttle;
-    } ]);
-});
+      };
+
+      $win.on('scroll.' + PLUGIN_NAME, throttle(handler, scrollThrottle));
+    }
+  }, {
+    key: 'detachScrollEvent',
+    value: function detachScrollEvent() {
+      this.$win.off('scroll.' + PLUGIN_NAME);
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.$header.remove();
+      this.$tableChildren.css('visibility', 'visible');
+      this.detachScrollEvent();
+      this.$container.removeData(PLUGIN_NAME);
+    }
+  }]);
+
+  return StickyTableHeader;
+}();
+
+$.fn.stickyTableHeader = function (options) {
+  return this.each(function () {
+    var $this = $(this);
+    if (!$this.data(PLUGIN_NAME)) {
+      $this.data(PLUGIN_NAME, new StickyTableHeader($this, options));
+    }
+  });
+};
+
+$.fn.stickyTableHeader.StickyTableHeader = StickyTableHeader;
+$.fn.stickyTableHeader.defaults = {
+  outsideViewportOnly: true,
+  scrollThrottle: 50,
+  css: {
+    header: 'StickyTableHeader',
+    scrolling: 'is-scrolling',
+    active: 'is-stickyTableHeaderActive'
+  },
+  zIndex: 2
+};
+
+/***/ }),
+/* 1 */
+/***/ (function(module, exports) {
+
+module.exports = __WEBPACK_EXTERNAL_MODULE_1__;
+
+/***/ }),
+/* 2 */
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+
+module.exports = throttle;
+
+// https://git.io/v5ZxQ
+function throttle(callback, wait) {
+  var context = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : this;
+
+  var timeout = null;
+  var callbackArgs = null;
+
+  var later = function later() {
+    callback.apply(context, callbackArgs);
+    timeout = null;
+  };
+
+  return function () {
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    if (!timeout) {
+      callbackArgs = args;
+      timeout = setTimeout(later, wait);
+    }
+  };
+}
+
+/***/ })
+/******/ ]);
+});
+//# sourceMappingURL=jquery.stickyTableHeader.js.map

package.json

 {
   "name": "jquery-sticky-table-header",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "main": "build/jquery.stickyTableHeader.js",
@@ -5,0 +5,0 @@ "author": "Simon Smith",

README.md

@@ -90,2 +90,16 @@ # jquery.stickyTableHeader [![Build Status](https://travis-ci.org/simonsmith/jquery.stickyTableHeader.svg?branch=master)](https://travis-ci.org/simonsmith/jquery.stickyTableHeader)
 
+## Methods
+
+You can get at the instance by accessing it from the elements `.data` method
+
+```js
+$('.table-container').stickyTableHeader();
+const instance = $('.table-container').data('stickyTableHeader');
+instance.destroy();
+```
+
+### destroy
+
+Removes the sticky header element and scroll listener
+
 ## Development
@@ -92,0 +106,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

327481

increased by0.19%

Lines of code

296

increased by50.25%

Number of lines in readme file

111

increased by14.43%

Worsened metrics

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes