stucky.min.js

(function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){"use strict";Object.defineProperty(exports,"__esModule",{value:true});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}}();var _raf=require("raf");var _raf2=_interopRequireDefault(_raf);var _objectAssign=require("object-assign");var _objectAssign2=_interopRequireDefault(_objectAssign);function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{"default":obj}}function _toConsumableArray(arr){if(Array.isArray(arr)){for(var i=0,arr2=Array(arr.length);i<arr.length;i++){arr2[i]=arr[i]}return arr2}else{return Array.from(arr)}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a function")}}var Stucky=function(){function Stucky($el,opts){_classCallCheck(this,Stucky);var defaults={offsetHeight:0,allowance:100,wrapperClasses:""};this.$el=$el;this.$head=this.$el.querySelector("thead");this.$bodyHeaders=[].concat(_toConsumableArray(this.$el.querySelectorAll("tbody th")));this.$caption=this.$el.querySelector("caption");if(!this.$head&&!this.$bodyHeaders.length){return}this.opts=(0,_objectAssign2.default)({},defaults,opts);this._initWrap();if(this.$head){this.$stickyHead=this._initStickyHead();this.$stickyIntersectTable=this._initStickyIntersect();var id=null;window.addEventListener("scroll",this._throttle(this._repositionStickyHead.bind(this),id));this._repositionStickyHead()}if(this.$bodyHeaders.length){this.$stickyBodyTable=this._initStickyBody();var _id=null;this.$el.parentNode.addEventListener("scroll",this._throttle(this._repositionStickyCols.bind(this),_id));this._repositionStickyCols()}}_createClass(Stucky,[{key:"_throttle",value:function _throttle(callback,id){return function(){if(id)_raf2.default.cancel(id);(0,_raf2.default)(callback)}}},{key:"_initWrap",value:function _initWrap(){var $wrap=document.createElement("div");$wrap.classList.add("sticky-wrap");this.opts.wrapperClasses.split(" ").filter(function(s){return s&&s.length}).forEach(function(className){return $wrap.classList.add(className)});this.$el.parentNode.insertBefore($wrap,this.$el);$wrap.appendChild(this.$el)}},{key:"_initStickyHead",value:function _initStickyHead(){if(!this.$head){return}var $stickyTHead=this.$head.cloneNode(true);$stickyTHead.classList.add("sticky-thead");var $stickyTable=document.createElement("table");$stickyTable.classList.add("sticky-head");this.$el.parentNode.insertBefore($stickyTable,this.$el.nextElementSibling);$stickyTable.appendChild($stickyTHead);return $stickyTable}},{key:"_initStickyBody",value:function _initStickyBody(){if(!this.$bodyHeaders){return}var $clonedTable=this.$el.cloneNode(true);[].concat(_toConsumableArray($clonedTable.querySelectorAll("thead th:not(:first-of-type), tbody td, caption"))).forEach(function($deletable){return $deletable.parentNode.removeChild($deletable)});var $stickyCol=document.createElement("table");$stickyCol.classList.add("sticky-col");this.$el.parentNode.insertBefore($stickyCol,this.$el.nextElementSibling);[].concat(_toConsumableArray($clonedTable.children)).forEach(function($child){return $stickyCol.appendChild($child)});return $stickyCol}},{key:"_initStickyIntersect",value:function _initStickyIntersect(){if(!this.$bodyHeaders){return}var $clonedTable=this.$el.cloneNode(true);[].concat(_toConsumableArray($clonedTable.querySelectorAll("thead th:not(:first-of-type), tbody, caption"))).forEach(function($deletable){return $deletable.parentNode.removeChild($deletable)});var $stickyIntersect=document.createElement("table");$stickyIntersect.classList.add("sticky-intersect");this.$el.parentNode.insertBefore($stickyIntersect,this.$el.nextElementSibling);[].concat(_toConsumableArray($clonedTable.children)).forEach(function($child){return $stickyIntersect.appendChild($child)});return $stickyIntersect}},{key:"_calculateStickyHeadDimensions",value:function _calculateStickyHeadDimensions(){var $originalTableHeaders=[].concat(_toConsumableArray(this.$el.querySelectorAll("thead th")));var $fakeTableHeaders=[].concat(_toConsumableArray(this.$stickyHead.querySelectorAll("thead th")));$originalTableHeaders.forEach(function($th,i){$fakeTableHeaders[i].style.width=$th.getBoundingClientRect().width+"px"});this.$stickyHead.style.width=this.$el.getBoundingClientRect().width+"px";var $originalIntersect=this.$el.querySelector("thead th");if($originalIntersect){var $fakeIntersect=this.$stickyIntersectTable.querySelector("thead th");$fakeIntersect.style.width=$originalIntersect.getBoundingClientRect().width+"px"}}},{key:"_calculateStickyBodyDimensions",value:function _calculateStickyBodyDimensions(){var $originalTableHeaders=[].concat(_toConsumableArray(this.$el.querySelectorAll("tbody th")));var $fakeTableHeaders=[].concat(_toConsumableArray(this.$stickyBodyTable.querySelectorAll("tbody th")));$originalTableHeaders.forEach(function($th,i){$fakeTableHeaders[i].style.width=$th.getBoundingClientRect().width+"px";$fakeTableHeaders[i].style.height=$th.getBoundingClientRect().height+"px"});var $originalIntersect=this.$el.querySelector("thead th");if($originalIntersect){var $fakeIntersect=this.$stickyIntersectTable.querySelector("thead th");$fakeIntersect.style.width=$originalIntersect.getBoundingClientRect().width+"px"}}},{key:"_repositionStickyHead",value:function _repositionStickyHead(){this._calculateStickyHeadDimensions();var elRect=this.$el.getBoundingClientRect();var captionHeight=this.$caption?this.$caption.offsetHeight:0;if(elRect.top+captionHeight<this.opts.offsetHeight&&elRect.bottom>this.opts.allowance){this.$stickyHead.style.top=-elRect.top+this.opts.offsetHeight+"px";this.$stickyHead.classList.add("is-active");if(this.$stickyIntersectTable){this.$stickyIntersectTable.style.top=-elRect.top+this.opts.offsetHeight+"px";this.$stickyIntersectTable.classList.add("is-active");this.$stickyIntersectTable.style.transform=null}}else{this.$stickyHead.style.top=null;this.$stickyHead.classList.remove("is-active");if(this.$stickyIntersectTable){this.$stickyIntersectTable.style.transform="translateY("+captionHeight+"px)";this.$stickyIntersectTable.style.top=null;this.$stickyIntersectTable.classList.remove("is-active")}}}},{key:"_repositionStickyCols",value:function _repositionStickyCols(){this._calculateStickyBodyDimensions();var scrollLeft=this.$el.parentNode.scrollLeft;var captionHeight=this.$caption?this.$caption.offsetHeight:0;if(scrollLeft>0){this.$stickyBodyTable.style.transform="translateY("+captionHeight+"px)";this.$stickyBodyTable.style.left=scrollLeft+"px";this.$stickyBodyTable.classList.add("is-active");if(this.$stickyIntersectTable){this.$stickyIntersectTable.style.left=scrollLeft+"px";this.$stickyIntersectTable.classList.add("is-active")}}else{this.$stickyBodyTable.style.top=null;this.$stickyBodyTable.style.transform=null;this.$stickyBodyTable.style.left=null;this.$stickyBodyTable.classList.remove("is-active");if(this.$stickyIntersectTable){this.$stickyIntersectTable.style.left=null;this.$stickyIntersectTable.classList.remove("is-active")}}}}]);return Stucky}();exports.default=Stucky;if(module.exports){exports.default=Stucky}else{window.Stucky=Stucky}},{"object-assign":2,raf:5}],2:[function(require,module,exports){"use strict";var hasOwnProperty=Object.prototype.hasOwnProperty;var propIsEnumerable=Object.prototype.propertyIsEnumerable;function toObject(val){if(val===null||val===undefined){throw new TypeError("Object.assign cannot be called with null or undefined")}return Object(val)}module.exports=Object.assign||function(target,source){var from;var to=toObject(target);var symbols;for(var s=1;s<arguments.length;s++){from=Object(arguments[s]);for(var key in from){if(hasOwnProperty.call(from,key)){to[key]=from[key]}}if(Object.getOwnPropertySymbols){symbols=Object.getOwnPropertySymbols(from);for(var i=0;i<symbols.length;i++){if(propIsEnumerable.call(from,symbols[i])){to[symbols[i]]=from[symbols[i]]}}}}return to}},{}],3:[function(require,module,exports){(function(process){(function(){var getNanoSeconds,hrtime,loadTime;if(typeof performance!=="undefined"&&performance!==null&&performance.now){module.exports=function(){return performance.now()}}else if(typeof process!=="undefined"&&process!==null&&process.hrtime){module.exports=function(){return(getNanoSeconds()-loadTime)/1e6};hrtime=process.hrtime;getNanoSeconds=function(){var hr;hr=hrtime();return hr[0]*1e9+hr[1]};loadTime=getNanoSeconds()}else if(Date.now){module.exports=function(){return Date.now()-loadTime};loadTime=Date.now()}else{module.exports=function(){return(new Date).getTime()-loadTime};loadTime=(new Date).getTime()}}).call(this)}).call(this,require("_process"))},{_process:4}],4:[function(require,module,exports){var process=module.exports={};var queue=[];var draining=false;var currentQueue;var queueIndex=-1;function cleanUpNextTick(){draining=false;if(currentQueue.length){queue=currentQueue.concat(queue)}else{queueIndex=-1}if(queue.length){drainQueue()}}function drainQueue(){if(draining){return}var timeout=setTimeout(cleanUpNextTick);draining=true;var len=queue.length;while(len){currentQueue=queue;queue=[];while(++queueIndex<len){if(currentQueue){currentQueue[queueIndex].run()}}queueIndex=-1;len=queue.length}currentQueue=null;draining=false;clearTimeout(timeout)}process.nextTick=function(fun){var args=new Array(arguments.length-1);if(arguments.length>1){for(var i=1;i<arguments.length;i++){args[i-1]=arguments[i]}}queue.push(new Item(fun,args));if(queue.length===1&&!draining){setTimeout(drainQueue,0)}};function Item(fun,array){this.fun=fun;this.array=array}Item.prototype.run=function(){this.fun.apply(null,this.array)};process.title="browser";process.browser=true;process.env={};process.argv=[];process.version="";process.versions={};function noop(){}process.on=noop;process.addListener=noop;process.once=noop;process.off=noop;process.removeListener=noop;process.removeAllListeners=noop;process.emit=noop;process.binding=function(name){throw new Error("process.binding is not supported")};process.cwd=function(){return"/"};process.chdir=function(dir){throw new Error("process.chdir is not supported")};process.umask=function(){return 0}},{}],5:[function(require,module,exports){(function(global){var now=require("performance-now"),root=typeof window==="undefined"?global:window,vendors=["moz","webkit"],suffix="AnimationFrame",raf=root["request"+suffix],caf=root["cancel"+suffix]||root["cancelRequest"+suffix];for(var i=0;!raf&&i<vendors.length;i++){raf=root[vendors[i]+"Request"+suffix];caf=root[vendors[i]+"Cancel"+suffix]||root[vendors[i]+"CancelRequest"+suffix]}if(!raf||!caf){var last=0,id=0,queue=[],frameDuration=1e3/60;raf=function(callback){if(queue.length===0){var _now=now(),next=Math.max(0,frameDuration-(_now-last));last=next+_now;setTimeout(function(){var cp=queue.slice(0);queue.length=0;for(var i=0;i<cp.length;i++){if(!cp[i].cancelled){try{cp[i].callback(last)}catch(e){setTimeout(function(){throw e},0)}}}},Math.round(next))}queue.push({handle:++id,callback:callback,cancelled:false});return id};caf=function(handle){for(var i=0;i<queue.length;i++){if(queue[i].handle===handle){queue[i].cancelled=true}}}}module.exports=function(fn){return raf.call(root,fn)};module.exports.cancel=function(){caf.apply(root,arguments)};module.exports.polyfill=function(){root.requestAnimationFrame=raf;root.cancelAnimationFrame=caf}}).call(this,typeof global!=="undefined"?global:typeof self!=="undefined"?self:typeof window!=="undefined"?window:{})},{"performance-now":3}]},{},[1]);