www.aleph1.co.uk Git - yaffs-website/blob - web/core/modules/toolbar/js/views/BodyVisualView.es6.js

   1 /**
   2  * @file
   3  * A Backbone view for the body element.
   4  */
   5
   6 (function($, Drupal, Backbone) {
   7   Drupal.toolbar.BodyVisualView = Backbone.View.extend(
   8     /** @lends Drupal.toolbar.BodyVisualView# */ {
   9       /**
  10        * Adjusts the body element with the toolbar position and dimension changes.
  11        *
  12        * @constructs
  13        *
  14        * @augments Backbone.View
  15        */
  16       initialize() {
  17         this.listenTo(this.model, 'change:activeTray ', this.render);
  18         this.listenTo(
  19           this.model,
  20           'change:isFixed change:isViewportOverflowConstrained',
  21           this.isToolbarFixed,
  22         );
  23       },
  24
  25       isToolbarFixed() {
  26         // When the toolbar is fixed, it will not scroll with page scrolling.
  27         const isViewportOverflowConstrained = this.model.get(
  28           'isViewportOverflowConstrained',
  29         );
  30         $('body').toggleClass(
  31           'toolbar-fixed',
  32           isViewportOverflowConstrained || this.model.get('isFixed'),
  33         );
  34       },
  35
  36       /**
  37        * @inheritdoc
  38        */
  39       render() {
  40         $('body')
  41           // Toggle the toolbar-tray-open class on the body element. The class is
  42           // applied when a toolbar tray is active. Padding might be applied to
  43           // the body element to prevent the tray from overlapping content.
  44           .toggleClass('toolbar-tray-open', !!this.model.get('activeTray'));
  45       },
  46     },
  47   );
  48 })(jQuery, Drupal, Backbone);