/** * DO NOT EDIT THIS FILE. * See the following change record for more information, * https://www.drupal.org/node/2815083 * @preserve **/ (function ($, Drupal, displace) { function TableHeader(table) { var $table = $(table); this.$originalTable = $table; this.$originalHeader = $table.children('thead'); this.$originalHeaderCells = this.$originalHeader.find('> tr > th'); this.displayWeight = null; this.$originalTable.addClass('sticky-table'); this.tableHeight = $table[0].clientHeight; this.tableOffset = this.$originalTable.offset(); this.$originalTable.on('columnschange', { tableHeader: this }, function (e, display) { var tableHeader = e.data.tableHeader; if (tableHeader.displayWeight === null || tableHeader.displayWeight !== display) { tableHeader.recalculateSticky(); } tableHeader.displayWeight = display; }); this.createSticky(); } function forTables(method, arg) { var tables = TableHeader.tables; var il = tables.length; for (var i = 0; i < il; i++) { tables[i][method](arg); } } function tableHeaderInitHandler(e) { once('tableheader', $(e.data.context).find('table.sticky-enabled')).forEach(function (table) { TableHeader.tables.push(new TableHeader(table)); }); forTables('onScroll'); } Drupal.behaviors.tableHeader = { attach: function attach(context) { $(window).one('scroll.TableHeaderInit', { context: context }, tableHeaderInitHandler); } }; function scrollValue(position) { return document.documentElement[position] || document.body[position]; } function tableHeaderResizeHandler(e) { forTables('recalculateSticky'); } function tableHeaderOnScrollHandler(e) { forTables('onScroll'); } function tableHeaderOffsetChangeHandler(e, offsets) { forTables('stickyPosition', offsets.top); } $(window).on({ 'resize.TableHeader': tableHeaderResizeHandler, 'scroll.TableHeader': tableHeaderOnScrollHandler }); $(document).on({ 'columnschange.TableHeader drupalToolbarTrayChange': tableHeaderResizeHandler, 'drupalViewportOffsetChange.TableHeader': tableHeaderOffsetChangeHandler }); $.extend(TableHeader, { tables: [] }); $.extend(TableHeader.prototype, { minHeight: 100, tableOffset: null, tableHeight: null, stickyVisible: false, createSticky: function createSticky() { this.$html = $('html'); var $stickyHeader = this.$originalHeader.clone(true); this.$stickyTable = $('').css({ visibility: 'hidden', position: 'fixed', top: '0px' }).append($stickyHeader).insertBefore(this.$originalTable); this.$stickyHeaderCells = $stickyHeader.find('> tr > th'); this.recalculateSticky(); }, stickyPosition: function stickyPosition(offsetTop, offsetLeft) { var css = {}; if (typeof offsetTop === 'number') { css.top = "".concat(offsetTop, "px"); } if (typeof offsetLeft === 'number') { css.left = "".concat(this.tableOffset.left - offsetLeft, "px"); } this.$html.css('scroll-padding-top', displace.offsets.top + (this.stickyVisible ? this.$stickyTable.height() : 0)); return this.$stickyTable.css(css); }, checkStickyVisible: function checkStickyVisible() { var scrollTop = scrollValue('scrollTop'); var tableTop = this.tableOffset.top - displace.offsets.top; var tableBottom = tableTop + this.tableHeight; var visible = false; if (tableTop < scrollTop && scrollTop < tableBottom - this.minHeight) { visible = true; } this.stickyVisible = visible; return visible; }, onScroll: function onScroll(e) { this.checkStickyVisible(); this.stickyPosition(null, scrollValue('scrollLeft')); this.$stickyTable.css('visibility', this.stickyVisible ? 'visible' : 'hidden'); }, recalculateSticky: function recalculateSticky(event) { this.tableHeight = this.$originalTable[0].clientHeight; displace.offsets.top = displace.calculateOffset('top'); this.tableOffset = this.$originalTable.offset(); this.stickyPosition(displace.offsets.top, scrollValue('scrollLeft')); var $that = null; var $stickyCell = null; var display = null; var il = this.$originalHeaderCells.length; for (var i = 0; i < il; i++) { $that = $(this.$originalHeaderCells[i]); $stickyCell = this.$stickyHeaderCells.eq($that.index()); display = $that.css('display'); if (display !== 'none') { $stickyCell.css({ width: $that.css('width'), display: display }); } else { $stickyCell.css('display', 'none'); } } this.$stickyTable.css('width', this.$originalTable.outerWidth()); } }); Drupal.TableHeader = TableHeader; })(jQuery, Drupal, window.Drupal.displace);