Chris@0: /**
Chris@0:  * @file
Chris@0:  * A Backbone View that provides the aural view of a contextual link.
Chris@0:  */
Chris@0: 
Chris@17: (function(Drupal, Backbone) {
Chris@17:   Drupal.contextual.AuralView = Backbone.View.extend(
Chris@17:     /** @lends Drupal.contextual.AuralView# */ {
Chris@17:       /**
Chris@17:        * Renders the aural view of a contextual link (i.e. screen reader support).
Chris@17:        *
Chris@17:        * @constructs
Chris@17:        *
Chris@17:        * @augments Backbone.View
Chris@17:        *
Chris@17:        * @param {object} options
Chris@17:        *   Options for the view.
Chris@17:        */
Chris@17:       initialize(options) {
Chris@17:         this.options = options;
Chris@0: 
Chris@17:         this.listenTo(this.model, 'change', this.render);
Chris@0: 
Chris@17:         // Use aria-role form so that the number of items in the list is spoken.
Chris@17:         this.$el.attr('role', 'form');
Chris@0: 
Chris@17:         // Initial render.
Chris@17:         this.render();
Chris@17:       },
Chris@0: 
Chris@17:       /**
Chris@17:        * @inheritdoc
Chris@17:        */
Chris@17:       render() {
Chris@17:         const isOpen = this.model.get('isOpen');
Chris@17: 
Chris@17:         // Set the hidden property of the links.
Chris@17:         this.$el.find('.contextual-links').prop('hidden', !isOpen);
Chris@17: 
Chris@17:         // Update the view of the trigger.
Chris@17:         this.$el
Chris@17:           .find('.trigger')
Chris@17:           .text(
Chris@17:             Drupal.t('@action @title configuration options', {
Chris@17:               '@action': !isOpen
Chris@17:                 ? this.options.strings.open
Chris@17:                 : this.options.strings.close,
Chris@17:               '@title': this.model.get('title'),
Chris@17:             }),
Chris@17:           )
Chris@17:           .attr('aria-pressed', isOpen);
Chris@17:       },
Chris@0:     },
Chris@17:   );
Chris@17: })(Drupal, Backbone);