Drupal
/
drupal
mirror of https://git.drupalcode.org/project/drupal.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

- Patch #787670 by casey, Kiphaas7: clean up tableheader.js.

merge-requests/26/head
Dries Buytaert 2010-07-28 01:38:28 +00:00
parent c7b77049c2
commit 926a26b6d5
2 changed files with 107 additions and 100 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
misc/drupal.js
View File

@ -331,7 +331,21 @@ $('html').addClass('js');
// 'js enabled' cookie. // 'js enabled' cookie.
document.cookie = 'has_js=1; path=/'; document.cookie = 'has_js=1; path=/';
// Attach all behaviors. /**
* Additions to jQuery.support.
*/
$(function () {
/**
* Boolean indicating whether or not position:fixed is supported.
*/
if (jQuery.support.positionFixed === undefined) {
var el = $('<div style="position:fixed; top:10px" />').appendTo(document.body);
jQuery.support.positionFixed = el[0].offsetTop === 10;
el.remove();
}
});
//Attach all behaviors.
$(function () { $(function () {
Drupal.attachBehaviors(document, Drupal.settings); Drupal.attachBehaviors(document, Drupal.settings);
}); });

191
misc/tableheader.js
View File

@ -1,118 +1,111 @@
// $Id$ // $Id$
(function ($) { (function ($) {
Drupal.tableHeaderDoScroll = function () { /**
if ($.isFunction(Drupal.tableHeaderOnScroll)) { * Attaches sticky table headers.
Drupal.tableHeaderOnScroll(); */
}
};
Drupal.behaviors.tableHeader = { Drupal.behaviors.tableHeader = {
attach: function (context, settings) { attach: function (context, settings) {
// This breaks in anything less than IE 7. Prevent it from running. if (!$.support.positionFixed) {
if ($.browser.msie && parseInt($.browser.version, 10) < 7) {
return; return;
} }
$('table.sticky-enabled thead', context).once('tableheader', function () { $('table.sticky-enabled', context).once('tableheader', function () {
// Clone the table header so it inherits original jQuery properties. Hide $(this).data("drupal-tableheader", new Drupal.tableHeader(this));
// the table to avoid a flash of the header clone upon page load.
var headerClone = $(this).clone(true).hide().insertBefore(this.parentNode).wrap('<table class="sticky-header"></table>').parent().css({
position: 'fixed',
top: '0px'
});
headerClone = $(headerClone)[0];
// Store parent table.
var table = $(this).parent('table')[0];
headerClone.table = table;
// Finish initializing header positioning.
tracker(headerClone);
// We hid the header to avoid it showing up erroneously on page load;
// we need to unhide it now so that it will show up when expected.
$(headerClone).children('thead').show();
$(table).addClass('sticky-table');
}); });
}
};
// Define the anchor holding var. /**
var prevAnchor = ''; * Constructor for the tableHeader object. Provides sticky table headers.
*
* @param table
* DOM object for the table to add a sticky header to.
*/
Drupal.tableHeader = function (table) {
var self = this;
// Track positioning and visibility. this.originalTable = $(table);
function tracker(e) { this.originalHeader = $(table).children('thead');
// Reset top position of sticky table headers to the current top offset. this.originalHeaderCells = this.originalHeader.find('> tr > th');
var topOffset = Drupal.settings.tableHeaderOffset ? eval(Drupal.settings.tableHeaderOffset + '()') : 0;
$('.sticky-header').css('top', topOffset + 'px'); // Clone the table header so it inherits original jQuery properties. Hide
// Save positioning data. // the table to avoid a flash of the header clone upon page load.
var viewHeight = document.documentElement.scrollHeight || document.body.scrollHeight; this.stickyTable = $('<table class="sticky-header"/>')
if (e.viewHeight != viewHeight) { .insertBefore(this.originalTable)
e.viewHeight = viewHeight; .css({ position: 'fixed', top: '0px' });
e.vPosition = $(e.table).offset().top - 4 - topOffset; this.stickyHeader = this.originalHeader.clone(true)
e.hPosition = $(e.table).offset().left; .hide()
e.vLength = e.table.clientHeight - 100; .appendTo(this.stickyTable);
// Resize header and its cell widths. this.stickyHeaderCells = this.stickyHeader.find('> tr > th');
var parentCell = $('th', e.table);
$('th', e).each(function (index) { this.originalTable.addClass('sticky-table');
var cellWidth = parentCell.eq(index).css('width'); $(window)
// Exception for IE7. .bind('scroll.drupal-tableheader', $.proxy(this, 'eventhandlerRecalculateStickyHeader'))
if (cellWidth == 'auto') { .bind('resize.drupal-tableheader', { calculateWidth: true }, $.proxy(this, 'eventhandlerRecalculateStickyHeader'))
cellWidth = parentCell.get(index).clientWidth + 'px'; // Make sure the anchor being scrolled into view is not hidden beneath the
} // sticky table header. Adjust the scrollTop if it does.
$(this).css('width', cellWidth); .bind('drupalDisplaceAnchor.drupal-tableheader', function () {
}); window.scrollBy(0, -self.stickyTable.outerHeight());
$(e).css('width', $(e.table).css('width')); })
// Make sure the element being focused is not hidden beneath the sticky
// table header. Adjust the scrollTop if it does.
.bind('drupalDisplaceFocus.drupal-tableheader', function (event) {
if (self.stickyVisible && event.clientY < (self.stickyOffsetTop + self.stickyTable.outerHeight()) && event.$target.closest('sticky-header').length === 0) {
window.scrollBy(0, -self.stickyTable.outerHeight());
} }
})
.triggerHandler('resize.drupal-tableheader');
// Track horizontal positioning relative to the viewport and set visibility. // We hid the header to avoid it showing up erroneously on page load;
var hScroll = document.documentElement.scrollLeft || document.body.scrollLeft; // we need to unhide it now so that it will show up when expected.
var vOffset = (document.documentElement.scrollTop || document.body.scrollTop) - e.vPosition; this.stickyHeader.show();
var visState = (vOffset > 0 && vOffset < e.vLength) ? 'visible' : 'hidden'; };
$(e).css({ left: -hScroll + e.hPosition + 'px', visibility: visState });
// Check the previous anchor to see if we need to scroll to make room for the header. /**
// Get the height of the header table and scroll up that amount. * Event handler: recalculates position of the sticky table header.
if (prevAnchor != location.hash) { *
if (location.hash != '') { * @param event
var scrollLocation = $('td' + location.hash).offset().top - $(e).height(); * Event being triggered.
$('body, html').scrollTop(scrollLocation); */
} Drupal.tableHeader.prototype.eventhandlerRecalculateStickyHeader = function (event) {
prevAnchor = location.hash; var self = this;
var calculateWidth = event.data && event.data.calculateWidth;
// Reset top position of sticky table headers to the current top offset.
this.stickyOffsetTop = Drupal.settings.tableHeaderOffset ? eval(Drupal.settings.tableHeaderOffset + '()') : 0;
this.stickyTable.css('top', this.stickyOffsetTop + 'px');
// Save positioning data.
var viewHeight = document.documentElement.scrollHeight || document.body.scrollHeight;
if (calculateWidth || this.viewHeight !== viewHeight) {
this.viewHeight = viewHeight;
this.vPosition = this.originalTable.offset().top - 4 - this.stickyOffsetTop;
this.hPosition = this.originalTable.offset().left;
this.vLength = this.originalTable[0].clientHeight - 100;
calculateWidth = true;
}
// Track horizontal positioning relative to the viewport and set visibility.
var hScroll = document.documentElement.scrollLeft || document.body.scrollLeft;
var vOffset = (document.documentElement.scrollTop || document.body.scrollTop) - this.vPosition;
this.stickyVisible = vOffset > 0 && vOffset < this.vLength;
this.stickyTable.css({ left: (-hScroll + this.hPosition) + 'px', visibility: this.stickyVisible ? 'visible' : 'hidden' });
// Only perform expensive calculations if the sticky header is actually
// visible or when forced.
if (this.stickyVisible && (calculateWidth || !this.widthCalculated)) {
this.widthCalculated = true;
// Resize header and its cell widths.
this.stickyHeaderCells.each(function (index) {
var cellWidth = self.originalHeaderCells.eq(index).css('width');
// Exception for IE7.
if (cellWidth == 'auto') {
cellWidth = self.originalHeaderCells.get(index).clientWidth + 'px';
} }
} $(this).css('width', cellWidth);
// Only attach to scrollbars once, even if Drupal.attachBehaviors is called
// multiple times.
$('body').once(function () {
$(window).scroll(Drupal.tableHeaderDoScroll);
$(document.documentElement).scroll(Drupal.tableHeaderDoScroll);
}); });
this.stickyTable.css('width', this.originalTable.css('width'));
// Track scrolling.
Drupal.tableHeaderOnScroll = function () {
$('table.sticky-header').each(function () {
tracker(this);
});
};
// Track resizing.
var time = null;
var resize = function () {
// Ensure minimum time between adjustments.
if (time) {
return;
}
time = setTimeout(function () {
$('table.sticky-header').each(function () {
// Force cell width calculation.
this.viewHeight = 0;
tracker(this);
});
// Reset timer.
time = null;
}, 250);
};
$(window).resize(resize);
} }
}; };