comparison core/modules/quickedit/js/views/ContextualLinkView.es6.js @ 0:c75dbcec494b

Initial commit from drush-created site

+/**
+ * @file
+ * A Backbone View that provides a dynamic contextual link.
+ */
+
+(function ($, Backbone, Drupal) {
+  Drupal.quickedit.ContextualLinkView = Backbone.View.extend(/** @lends Drupal.quickedit.ContextualLinkView# */{
+
+    /**
+     * Define all events to listen to.
+     *
+     * @return {object}
+     *   A map of events.
+     */
+    events() {
+      // Prevents delay and simulated mouse events.
+      function touchEndToClick(event) {
+        event.preventDefault();
+        event.target.click();
+      }
+
+      return {
+        'click a': function (event) {
+          event.preventDefault();
+          this.model.set('state', 'launching');
+        },
+        'touchEnd a': touchEndToClick,
+      };
+    },
+
+    /**
+     * Create a new contextual link view.
+     *
+     * @constructs
+     *
+     * @augments Backbone.View
+     *
+     * @param {object} options
+     *   An object with the following keys:
+     * @param {Drupal.quickedit.EntityModel} options.model
+     *   The associated entity's model.
+     * @param {Drupal.quickedit.AppModel} options.appModel
+     *   The application state model.
+     * @param {object} options.strings
+     *   The strings for the "Quick edit" link.
+     */
+    initialize(options) {
+      // Insert the text of the quick edit toggle.
+      this.$el.find('a').text(options.strings.quickEdit);
+      // Initial render.
+      this.render();
+      // Re-render whenever this entity's isActive attribute changes.
+      this.listenTo(this.model, 'change:isActive', this.render);
+    },
+
+    /**
+     * Render function for the contextual link view.
+     *
+     * @param {Drupal.quickedit.EntityModel} entityModel
+     *   The associated `EntityModel`.
+     * @param {bool} isActive
+     *   Whether the in-place editor is active or not.
+     *
+     * @return {Drupal.quickedit.ContextualLinkView}
+     *   The `ContextualLinkView` in question.
+     */
+    render(entityModel, isActive) {
+      this.$el.find('a').attr('aria-pressed', isActive);
+
+      // Hides the contextual links if an in-place editor is active.
+      this.$el.closest('.contextual').toggle(!isActive);
+
+      return this;
+    },
+
+  });
+}(jQuery, Backbone, Drupal));