comparison core/modules/ckeditor/js/views/AuralView.js @ 0:c75dbcec494b

Initial commit from drush-created site
author Chris Cannam
date Thu, 05 Jul 2018 14:24:15 +0000
parents
children
comparison
equal deleted inserted replaced
-1:000000000000 0:c75dbcec494b
1 /**
2 * DO NOT EDIT THIS FILE.
3 * See the following change record for more information,
4 * https://www.drupal.org/node/2815083
5 * @preserve
6 **/
7
8 (function (Drupal, Backbone, $) {
9 Drupal.ckeditor.AuralView = Backbone.View.extend({
10 events: {
11 'click .ckeditor-buttons a': 'announceButtonHelp',
12 'click .ckeditor-multiple-buttons a': 'announceSeparatorHelp',
13 'focus .ckeditor-button a': 'onFocus',
14 'focus .ckeditor-button-separator a': 'onFocus',
15 'focus .ckeditor-toolbar-group': 'onFocus'
16 },
17
18 initialize: function initialize() {
19 this.listenTo(this.model, 'change:isDirty', this.announceMove);
20 },
21 announceMove: function announceMove(model, isDirty) {
22 if (!isDirty) {
23 var item = document.activeElement || null;
24 if (item) {
25 var $item = $(item);
26 if ($item.hasClass('ckeditor-toolbar-group')) {
27 this.announceButtonGroupPosition($item);
28 } else if ($item.parent().hasClass('ckeditor-button')) {
29 this.announceButtonPosition($item.parent());
30 }
31 }
32 }
33 },
34 onFocus: function onFocus(event) {
35 event.stopPropagation();
36
37 var $originalTarget = $(event.target);
38 var $currentTarget = $(event.currentTarget);
39 var $parent = $currentTarget.parent();
40 if ($parent.hasClass('ckeditor-button') || $parent.hasClass('ckeditor-button-separator')) {
41 this.announceButtonPosition($currentTarget.parent());
42 } else if ($originalTarget.attr('role') !== 'button' && $currentTarget.hasClass('ckeditor-toolbar-group')) {
43 this.announceButtonGroupPosition($currentTarget);
44 }
45 },
46 announceButtonGroupPosition: function announceButtonGroupPosition($group) {
47 var $groups = $group.parent().children();
48 var $row = $group.closest('.ckeditor-row');
49 var $rows = $row.parent().children();
50 var position = $groups.index($group) + 1;
51 var positionCount = $groups.not('.placeholder').length;
52 var row = $rows.index($row) + 1;
53 var rowCount = $rows.not('.placeholder').length;
54 var text = Drupal.t('@groupName button group in position @position of @positionCount in row @row of @rowCount.', {
55 '@groupName': $group.attr('data-drupal-ckeditor-toolbar-group-name'),
56 '@position': position,
57 '@positionCount': positionCount,
58 '@row': row,
59 '@rowCount': rowCount
60 });
61
62 if (position === 1 && row === rowCount) {
63 text += '\n';
64 text += Drupal.t('Press the down arrow key to create a new row.');
65 }
66 Drupal.announce(text, 'assertive');
67 },
68 announceButtonPosition: function announceButtonPosition($button) {
69 var $row = $button.closest('.ckeditor-row');
70 var $rows = $row.parent().children();
71 var $buttons = $button.closest('.ckeditor-buttons').children();
72 var $group = $button.closest('.ckeditor-toolbar-group');
73 var $groups = $group.parent().children();
74 var groupPosition = $groups.index($group) + 1;
75 var groupPositionCount = $groups.not('.placeholder').length;
76 var position = $buttons.index($button) + 1;
77 var positionCount = $buttons.length;
78 var row = $rows.index($row) + 1;
79 var rowCount = $rows.not('.placeholder').length;
80
81 var type = $button.attr('data-drupal-ckeditor-type') === 'separator' ? '' : Drupal.t('button');
82 var text = void 0;
83
84 if ($button.closest('.ckeditor-toolbar-disabled').length > 0) {
85 text = Drupal.t('@name @type.', {
86 '@name': $button.children().attr('aria-label'),
87 '@type': type
88 });
89 text += '\n' + Drupal.t('Press the down arrow key to activate.');
90
91 Drupal.announce(text, 'assertive');
92 } else if ($group.not('.placeholder').length === 1) {
93 text = Drupal.t('@name @type in position @position of @positionCount in @groupName button group in row @row of @rowCount.', {
94 '@name': $button.children().attr('aria-label'),
95 '@type': type,
96 '@position': position,
97 '@positionCount': positionCount,
98 '@groupName': $group.attr('data-drupal-ckeditor-toolbar-group-name'),
99 '@row': row,
100 '@rowCount': rowCount
101 });
102
103 if (groupPosition === 1 && position === 1 && row === rowCount) {
104 text += '\n';
105 text += Drupal.t('Press the down arrow key to create a new button group in a new row.');
106 }
107
108 if (groupPosition === groupPositionCount && position === positionCount) {
109 text += '\n';
110 text += Drupal.t('This is the last group. Move the button forward to create a new group.');
111 }
112 Drupal.announce(text, 'assertive');
113 }
114 },
115 announceButtonHelp: function announceButtonHelp(event) {
116 var $link = $(event.currentTarget);
117 var $button = $link.parent();
118 var enabled = $button.closest('.ckeditor-toolbar-active').length > 0;
119 var message = void 0;
120
121 if (enabled) {
122 message = Drupal.t('The "@name" button is currently enabled.', {
123 '@name': $link.attr('aria-label')
124 });
125 message += '\n' + Drupal.t('Use the keyboard arrow keys to change the position of this button.');
126 message += '\n' + Drupal.t('Press the up arrow key on the top row to disable the button.');
127 } else {
128 message = Drupal.t('The "@name" button is currently disabled.', {
129 '@name': $link.attr('aria-label')
130 });
131 message += '\n' + Drupal.t('Use the down arrow key to move this button into the active toolbar.');
132 }
133 Drupal.announce(message);
134 event.preventDefault();
135 },
136 announceSeparatorHelp: function announceSeparatorHelp(event) {
137 var $link = $(event.currentTarget);
138 var $button = $link.parent();
139 var enabled = $button.closest('.ckeditor-toolbar-active').length > 0;
140 var message = void 0;
141
142 if (enabled) {
143 message = Drupal.t('This @name is currently enabled.', {
144 '@name': $link.attr('aria-label')
145 });
146 message += '\n' + Drupal.t('Use the keyboard arrow keys to change the position of this separator.');
147 } else {
148 message = Drupal.t('Separators are used to visually split individual buttons.');
149 message += '\n' + Drupal.t('This @name is currently disabled.', {
150 '@name': $link.attr('aria-label')
151 });
152 message += '\n' + Drupal.t('Use the down arrow key to move this separator into the active toolbar.');
153 message += '\n' + Drupal.t('You may add multiple separators to each button group.');
154 }
155 Drupal.announce(message);
156 event.preventDefault();
157 }
158 });
159 })(Drupal, Backbone, jQuery);