42 lines
1.3 KiB
JavaScript
42 lines
1.3 KiB
JavaScript
/**
|
|
* @file
|
|
* A Backbone view for the body element.
|
|
*/
|
|
|
|
(function ($, Drupal, Backbone) {
|
|
|
|
'use strict';
|
|
|
|
Drupal.toolbar.BodyVisualView = Backbone.View.extend(/** @lends Drupal.toolbar.BodyVisualView# */{
|
|
/**
|
|
* Adjusts the body element with the toolbar position and dimension changes.
|
|
*
|
|
* @constructs
|
|
*
|
|
* @augments Backbone.View
|
|
*/
|
|
initialize: function () {
|
|
this.listenTo(this.model, 'change:activeTray ', this.render);
|
|
this.listenTo(this.model, 'change:isFixed change:isViewportOverflowConstrained', this.isToolbarFixed);
|
|
},
|
|
|
|
isToolbarFixed: function () {
|
|
// When the toolbar is fixed, it will not scroll with page scrolling.
|
|
var isViewportOverflowConstrained = this.model.get('isViewportOverflowConstrained');
|
|
$('body').toggleClass('toolbar-fixed', (isViewportOverflowConstrained || this.model.get('isFixed')));
|
|
},
|
|
|
|
/**
|
|
* @inheritdoc
|
|
*/
|
|
render: function () {
|
|
$('body')
|
|
// Toggle the toolbar-tray-open class on the body element. The class is
|
|
// applied when a toolbar tray is active. Padding might be applied to
|
|
// the body element to prevent the tray from overlapping content.
|
|
.toggleClass('toolbar-tray-open', !!this.model.get('activeTray'));
|
|
}
|
|
});
|
|
|
|
}(jQuery, Drupal, Backbone));
|