aleph1.co.uk Git - yaffs-website/blob - web/core/modules/quickedit/js/views/ContextualLinkView.js

   1 /**
   2  * @file
   3  * A Backbone View that provides a dynamic contextual link.
   4  */
   5
   6 (function ($, Backbone, Drupal) {
   7
   8   'use strict';
   9
  10   Drupal.quickedit.ContextualLinkView = Backbone.View.extend(/** @lends Drupal.quickedit.ContextualLinkView# */{
  11
  12     /**
  13      * Define all events to listen to.
  14      *
  15      * @return {object}
  16      *   A map of events.
  17      */
  18     events: function () {
  19       // Prevents delay and simulated mouse events.
  20       function touchEndToClick(event) {
  21         event.preventDefault();
  22         event.target.click();
  23       }
  24
  25       return {
  26         'click a': function (event) {
  27           event.preventDefault();
  28           this.model.set('state', 'launching');
  29         },
  30         'touchEnd a': touchEndToClick
  31       };
  32     },
  33
  34     /**
  35      * Create a new contextual link view.
  36      *
  37      * @constructs
  38      *
  39      * @augments Backbone.View
  40      *
  41      * @param {object} options
  42      *   An object with the following keys:
  43      * @param {Drupal.quickedit.EntityModel} options.model
  44      *   The associated entity's model.
  45      * @param {Drupal.quickedit.AppModel} options.appModel
  46      *   The application state model.
  47      * @param {object} options.strings
  48      *   The strings for the "Quick edit" link.
  49      */
  50     initialize: function (options) {
  51       // Insert the text of the quick edit toggle.
  52       this.$el.find('a').text(options.strings.quickEdit);
  53       // Initial render.
  54       this.render();
  55       // Re-render whenever this entity's isActive attribute changes.
  56       this.listenTo(this.model, 'change:isActive', this.render);
  57     },
  58
  59     /**
  60      * Render function for the contextual link view.
  61      *
  62      * @param {Drupal.quickedit.EntityModel} entityModel
  63      *   The associated `EntityModel`.
  64      * @param {bool} isActive
  65      *   Whether the in-place editor is active or not.
  66      *
  67      * @return {Drupal.quickedit.ContextualLinkView}
  68      *   The `ContextualLinkView` in question.
  69      */
  70     render: function (entityModel, isActive) {
  71       this.$el.find('a').attr('aria-pressed', isActive);
  72
  73       // Hides the contextual links if an in-place editor is active.
  74       this.$el.closest('.contextual').toggle(!isActive);
  75
  76       return this;
  77     }
  78
  79   });
  80
  81 })(jQuery, Backbone, Drupal);