3 * A Backbone View that provides the aural view of the edit mode toggle.
6 (function ($, Drupal, Backbone, _) {
7 Drupal.contextualToolbar.AuralView = Backbone.View.extend(/** @lends Drupal.contextualToolbar.AuralView# */{
10 * Tracks whether the tabbing constraint announcement has been read once.
17 * Renders the aural view of the edit mode toggle (screen reader support).
21 * @augments Backbone.View
23 * @param {object} options
24 * Options for the view.
27 this.options = options;
29 this.listenTo(this.model, 'change', this.render);
30 this.listenTo(this.model, 'change:isViewing', this.manageTabbing);
32 $(document).on('keyup', _.bind(this.onKeypress, this));
39 * @return {Drupal.contextualToolbar.AuralView}
40 * The current contextual toolbar aural view.
44 this.$el.find('button').attr('aria-pressed', !this.model.get('isViewing'));
50 * Limits tabbing to the contextual links and edit mode toolbar tab.
53 let tabbingContext = this.model.get('tabbingContext');
54 // Always release an existing tabbing context.
56 // Only announce release when the context was active.
57 if (tabbingContext.active) {
58 Drupal.announce(this.options.strings.tabbingReleased);
60 tabbingContext.release();
62 // Create a new tabbing context when edit mode is enabled.
63 if (!this.model.get('isViewing')) {
64 tabbingContext = Drupal.tabbingManager.constrain($('.contextual-toolbar-tab, .contextual'));
65 this.model.set('tabbingContext', tabbingContext);
66 this.announceTabbingConstraint();
67 this.announcedOnce = true;
72 * Announces the current tabbing constraint.
74 announceTabbingConstraint() {
75 const strings = this.options.strings;
76 Drupal.announce(Drupal.formatString(strings.tabbingConstrained, {
77 '@contextualsCount': Drupal.formatPlural(Drupal.contextual.collection.length, '@count contextual link', '@count contextual links'),
79 Drupal.announce(strings.pressEsc);
83 * Responds to esc and tab key press events.
85 * @param {jQuery.Event} event
89 // The first tab key press is tracked so that an annoucement about tabbing
90 // constraints can be raised if edit mode is enabled when the page is
92 if (!this.announcedOnce && event.keyCode === 9 && !this.model.get('isViewing')) {
93 this.announceTabbingConstraint();
94 // Set announce to true so that this conditional block won't run again.
95 this.announcedOnce = true;
97 // Respond to the ESC key. Exit out of edit mode.
98 if (event.keyCode === 27) {
99 this.model.set('isViewing', true);
104 }(jQuery, Drupal, Backbone, _));