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