diff core/modules/toolbar/js/views/BodyVisualView.es6.js @ 0:4c8ae668cc8c

Initial import (non-working)
author Chris Cannam
date Wed, 29 Nov 2017 16:09:58 +0000
parents
children 129ea1e6d783
line wrap: on
line diff
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/core/modules/toolbar/js/views/BodyVisualView.es6.js	Wed Nov 29 16:09:58 2017 +0000
@@ -0,0 +1,37 @@
+/**
+ * @file
+ * A Backbone view for the body element.
+ */
+
+(function ($, Drupal, Backbone) {
+  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() {
+      this.listenTo(this.model, 'change:activeTray ', this.render);
+      this.listenTo(this.model, 'change:isFixed change:isViewportOverflowConstrained', this.isToolbarFixed);
+    },
+
+    isToolbarFixed() {
+      // When the toolbar is fixed, it will not scroll with page scrolling.
+      const isViewportOverflowConstrained = this.model.get('isViewportOverflowConstrained');
+      $('body').toggleClass('toolbar-fixed', (isViewportOverflowConstrained || this.model.get('isFixed')));
+    },
+
+    /**
+     * @inheritdoc
+     */
+    render() {
+      $('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));