Index: misc/displace.js =================================================================== RCS file: misc/displace.js diff -N misc/displace.js --- misc/displace.js 14 May 2010 16:44:37 -0000 1.2 +++ /dev/null 1 Jan 1970 00:00:00 -0000 @@ -1,115 +0,0 @@ -// $Id: displace.js,v 1.2 2010/05/14 16:44:37 dries Exp $ -(function ($) { - -/** - * Provides a generic method to position elements fixed to the viewport. - * - * Fixed positioning (CSS declaration position:fixed) is done relative to the - * viewport. This makes it hard to position multiple fixed positioned element - * relative to each other (e.g. multiple toolbars should come after each other, - * not on top of each other). - * - * To position an element fixed at the top of the viewport add the class - * "displace-top" to that element, and to position it to the bottom of the view- - * port add the class "displace-bottom". - * - * When a browser doesn't support position:fixed (like IE6) the element gets - * positioned absolutely by default, but this can be overridden by using the - * "displace-unsupported" class. - */ - -/** - * Attaches the displace behavior. - */ -Drupal.behaviors.displace = { - attach: function (context, settings) { - // Test for position:fixed support. - if (!Drupal.positionFixedSupported()) { - $(document.documentElement).addClass('displace-unsupported'); - } - - $(document.body).once('displace', function () { - $(window).bind('resize.drupal-displace', function () { - Drupal.displace.clearCache(); - - $(document.body).css({ - paddingTop: Drupal.displace.getDisplacement('top'), - paddingBottom: Drupal.displace.getDisplacement('bottom') - }); - }); - }); - - Drupal.displace.clearCache(true); - $(window).triggerHandler('resize'); - } -}; - -/** - * The displace object. - */ -Drupal.displace = Drupal.displace || {}; - -Drupal.displace.elements = []; -Drupal.displace.displacement = []; - -/** - * Get all displaced elements of given region. - * - * @param region - * Region name. Either "top" or "bottom". - * - * @return - * jQuery object containing all displaced elements of given region. - */ -Drupal.displace.getDisplacedElements = function (region) { - if (!this.elements[region]) { - this.elements[region] = $('.displace-' + region); - } - return this.elements[region]; -}; - -/** - * Get the total displacement of given region. - * - * @param region - * Region name. Either "top" or "bottom". - * - * @return - * The total displacement of given region in pixels. - */ -Drupal.displace.getDisplacement = function (region) { - if (!this.displacement[region]) { - var offset = 0; - var height = 0; - this.getDisplacedElements(region).each(function () { - offset = offset + height; - height = $(this).css(region, offset).outerHeight(); - - // In IE, Shadow filter adds some extra height, so we need to remove it - // from the returned height. - if (this.filters && this.filters.length && this.filters.item('DXImageTransform.Microsoft.Shadow')) { - height -= this.filters.item('DXImageTransform.Microsoft.Shadow').strength; - } - }); - - // Use offset of latest displaced element as the total displacement. - this.displacement[region] = offset + height; - } - - return this.displacement[region]; -}; - -/** - * Clear cache. - * - * @param selectorCache - * Boolean whether to also clear the selector cache. - */ -Drupal.displace.clearCache = function (selectorCache) { - if (selectorCache) { - this.elements = []; - } - this.displacement = []; -}; - -})(jQuery); Index: misc/drupal.js =================================================================== RCS file: /cvs/drupal/drupal/misc/drupal.js,v retrieving revision 1.66 diff -u -p -r1.66 drupal.js --- misc/drupal.js 14 May 2010 16:44:37 -0000 1.66 +++ misc/drupal.js 18 May 2010 14:29:04 -0000 @@ -300,24 +300,6 @@ Drupal.getSelection = function (element) }; /** - * Checks if position:fixed is supported. - * - * @return - * Boolean indicating whether or not position:fixed is supported. - * - * @see http://yura.thinkweb2.com/cft/#IS_POSITION_FIXED_SUPPORTED - */ -Drupal.positionFixedSupported = function () { - if (this._positionFixedSupported === undefined) { - var el = $('
').appendTo(document.body); - this._positionFixedSupported = el[0].offsetTop === 10; - el.remove(); - } - - return this._positionFixedSupported; -}; - -/** * Build an error message from an AJAX response. */ Drupal.ajaxError = function (xmlhttp, uri) { Index: misc/tableheader.js =================================================================== RCS file: /cvs/drupal/drupal/misc/tableheader.js,v retrieving revision 1.30 diff -u -p -r1.30 tableheader.js --- misc/tableheader.js 14 May 2010 07:45:53 -0000 1.30 +++ misc/tableheader.js 18 May 2010 14:27:12 -0000 @@ -42,7 +42,7 @@ Drupal.behaviors.tableHeader = { // Track positioning and visibility. function tracker(e) { // Reset top position of sticky table headers to the current top offset. - var topOffset = Drupal.displace ? Drupal.displace.getDisplacement('top') : 0; + var topOffset = Drupal.settings.tableHeaderOffset ? eval(Drupal.settings.tableHeaderOffset + '()') : 0; $('.sticky-header').css('top', topOffset + 'px'); // Save positioning data. var viewHeight = document.documentElement.scrollHeight || document.body.scrollHeight; Index: modules/overlay/overlay-parent.js =================================================================== RCS file: /cvs/drupal/drupal/modules/overlay/overlay-parent.js,v retrieving revision 1.41 diff -u -p -r1.41 overlay-parent.js --- modules/overlay/overlay-parent.js 14 May 2010 07:45:54 -0000 1.41 +++ modules/overlay/overlay-parent.js 18 May 2010 14:27:15 -0000 @@ -650,9 +650,15 @@ Drupal.overlay.outerResize = function () return; } - var displaceTop = Drupal.displace ? Drupal.displace.getDisplacement('top') : 0; + // Consider any region that should be visible above the overlay (such as + // an admin toolbar). + var $displaceTop = $('.overlay-displace-top'); + var displaceTopHeight = 0; + $displaceTop.each(function () { + displaceTopHeight += $(this).height(); + }); - self.$wrapper.css('top', displaceTop); + self.$wrapper.css('top', displaceTopHeight); // When the overlay has no height yet, make it fit exactly in the window, // or the configured height when autoFit is disabled. @@ -660,7 +666,7 @@ Drupal.overlay.outerResize = function () var titleBarHeight = self.$dialogTitlebar.outerHeight(true); if (self.options.autoFit || self.options.height == undefined ||!isNan(self.options.height)) { - self.lastHeight = parseInt($(window).height() - displaceTop - titleBarHeight - 45); + self.lastHeight = parseInt($(window).height() - displaceTopHeight - titleBarHeight - 45); } else { self.lastHeight = self.options.height; @@ -697,11 +703,11 @@ Drupal.overlay.clickHandler = function ( var $target = $(event.target); - if (self.isOpen && $target.closest('.displace-top, .displace-bottom').length) { + if (self.isOpen && $target.closest('.overlay-displace-top, .overlay-displace-bottom').length) { // Click events in displaced regions could potentionally change the size of // that region (e.g. the toggle button of the toolbar module). Trigger the // resize event to force a recalculation of overlay's size/position. - $(window).triggerHandler('resize'); + $(window).triggerHandler('resize.overlay-event'); } // Only continue by left-click or right-click. @@ -923,7 +929,7 @@ Drupal.overlay.resetActiveClass = functi var self = this; var windowDomain = window.location.protocol + window.location.hostname; - $('.displace-top, .displace-bottom') + $('.overlay-displace-top, .overlay-displace-bottom') .find('a[href]') // Remove active class from all links in displaced regions. .removeClass('active') Index: modules/overlay/overlay.module =================================================================== RCS file: /cvs/drupal/drupal/modules/overlay/overlay.module,v retrieving revision 1.18 diff -u -p -r1.18 overlay.module --- modules/overlay/overlay.module 14 May 2010 07:45:54 -0000 1.18 +++ modules/overlay/overlay.module 18 May 2010 14:27:14 -0000 @@ -300,6 +300,16 @@ function overlay_preprocess_page(&$varia } /** + * Preprocess template variables for toolbar.tpl.php. + * + * Adding the 'overlay-displace-top' class to the toolbar pushes the overlay + * down, so it appears below the toolbar. + */ +function overlay_preprocess_toolbar(&$variables) { + $variables['classes_array'][] = "overlay-displace-top"; +} + +/** * Form after_build callback. * * After all hook_form_alter() implementations have been processed, we look at Index: modules/system/system.css =================================================================== RCS file: /cvs/drupal/drupal/modules/system/system.css,v retrieving revision 1.76 diff -u -p -r1.76 system.css --- modules/system/system.css 14 May 2010 07:45:54 -0000 1.76 +++ modules/system/system.css 18 May 2010 14:27:15 -0000 @@ -275,6 +275,26 @@ tr.selected td { } /* +** To be used with displace.js +*/ +.displace-top, +.displace-bottom { + position: relative; + width: 100%; +} +.displace-processed .displace-top, +.displace-processed .displace-bottom { + position: fixed; + width: auto; + left: 0; + right: 0; +} +.displace-unsupported .displace-top, +.displace-unsupported .displace-bottom { + position: absolute; +} + +/* ** Floating header for tableheader.js */ table.sticky-header { Index: modules/toolbar/toolbar.css =================================================================== RCS file: /cvs/drupal/drupal/modules/toolbar/toolbar.css,v retrieving revision 1.21 diff -u -p -r1.21 toolbar.css --- modules/toolbar/toolbar.css 14 May 2010 07:45:54 -0000 1.21 +++ modules/toolbar/toolbar.css 18 May 2010 14:27:07 -0000 @@ -1,6 +1,12 @@ /* $Id: toolbar.css,v 1.21 2010/05/14 07:45:54 dries Exp $ */ +body.toolbar { + padding-top: 2.2em; +} +body.toolbar-drawer { + padding-top: 5.3em; +} /** * Aggressive resets so we can achieve a consistent look in hostile CSS @@ -26,8 +32,10 @@ font: normal 0.9em "Lucida Grande", Verdana, sans-serif; background: #666; color: #ccc; -} -.displace-processed #toolbar { + position: fixed; + top: 0; + left: 0; + right: 0; margin: 0 -20px; padding: 0 20px; z-index: 600; @@ -37,14 +45,6 @@ filter: progid:DXImageTransform.Microsoft.Shadow(color=#000000, direction='180', strength='10'); -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(color=#000000, direction='180', strength='10')"; } -.displace-unsupported #toolbar { - margin: 0; - padding-right: 0; - left: -20px; - right: 0; - width: 100%; -} - #toolbar div.collapsed { display: none; @@ -132,3 +132,18 @@ position: relative; padding: 0 10px; } + +/** + * IE 6 Fix. + * + * IE 6 shows elements with position:fixed as position:static so we replace + * it with position:absolute; toolbar needs it's z-index to stay above overlay. + */ +* html #toolbar { + position: absolute; + margin: 0; + padding-right: 0; + left: -20px; + right: 0; + width: 100%; +} Index: modules/toolbar/toolbar.js =================================================================== RCS file: /cvs/drupal/drupal/modules/toolbar/toolbar.js,v retrieving revision 1.17 diff -u -p -r1.17 toolbar.js --- modules/toolbar/toolbar.js 14 May 2010 07:45:54 -0000 1.17 +++ modules/toolbar/toolbar.js 18 May 2010 14:27:05 -0000 @@ -15,8 +15,9 @@ Drupal.behaviors.toolbar = { // Toggling toolbar drawer. $('#toolbar a.toggle', context).once('toolbar-toggle').click(function(e) { Drupal.toolbar.toggle(); - // Allow resize event handlers to recalculate sizes/positions. - $(window).triggerHandler('resize'); + // As the toolbar is an overlay displaced region, overlay should be + // notified of it's height change to adapt its position. + $(window).triggerHandler('resize.overlay-event'); return false; }); } @@ -48,6 +49,7 @@ Drupal.toolbar.collapse = function() { .removeClass('toggle-active') .attr('title', toggle_text) .html(toggle_text); + $('body').removeClass('toolbar-drawer').css('paddingTop', Drupal.toolbar.height()); $.cookie( 'Drupal.toolbar.collapsed', 1, @@ -69,6 +71,7 @@ Drupal.toolbar.expand = function() { .addClass('toggle-active') .attr('title', toggle_text) .html(toggle_text); + $('body').addClass('toolbar-drawer').css('paddingTop', Drupal.toolbar.height()); $.cookie( 'Drupal.toolbar.collapsed', 0, @@ -92,4 +95,14 @@ Drupal.toolbar.toggle = function() { } }; +Drupal.toolbar.height = function() { + var height = $('#toolbar').outerHeight(); + // In IE, Shadow filter adds some extra height, so we need to remove it from + // the returned height. + if ($('#toolbar').css('filter').match(/DXImageTransform\.Microsoft\.Shadow/)) { + height -= $('#toolbar').get(0).filters.item("DXImageTransform.Microsoft.Shadow").strength; + } + return height; +}; + })(jQuery); Index: modules/toolbar/toolbar.module =================================================================== RCS file: /cvs/drupal/drupal/modules/toolbar/toolbar.module,v retrieving revision 1.39 diff -u -p -r1.39 toolbar.module --- modules/toolbar/toolbar.module 14 May 2010 16:52:27 -0000 1.39 +++ modules/toolbar/toolbar.module 18 May 2010 14:27:06 -0000 @@ -177,9 +177,12 @@ function toolbar_view() { '#theme' => 'toolbar', '#attached'=> array( 'js' => array( - array('data' => 'misc/displace.js', 'weight' => JS_LIBRARY - 1), - array('data' => 'misc/jquery.cookie.js', 'weight' => JS_LIBRARY + 2), $module_path . '/toolbar.js', + array('data' => 'misc/jquery.cookie.js', 'weight' => JS_LIBRARY + 2), + array( + 'data' => array('tableHeaderOffset' => 'Drupal.toolbar.height'), + 'type' => 'setting' + ), ), 'css' => array( $module_path . '/toolbar.css', Index: modules/toolbar/toolbar.tpl.php =================================================================== RCS file: /cvs/drupal/drupal/modules/toolbar/toolbar.tpl.php,v retrieving revision 1.10 diff -u -p -r1.10 toolbar.tpl.php --- modules/toolbar/toolbar.tpl.php 14 May 2010 07:45:54 -0000 1.10 +++ modules/toolbar/toolbar.tpl.php 18 May 2010 14:27:04 -0000 @@ -22,7 +22,7 @@ * @see template_preprocess_toolbar() */ ?> -