1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
|
/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
"use strict";
const {
AUDIT,
ENABLE,
RESET,
SELECT,
HIGHLIGHT,
UNHIGHLIGHT,
UPDATE_CAN_BE_DISABLED,
UPDATE_CAN_BE_ENABLED,
UPDATE_PREF,
UPDATE_DETAILS,
PREF_KEYS,
PREFS,
UPDATE_DISPLAY_TABBING_ORDER,
} = require("resource://devtools/client/accessibility/constants.js");
const TreeView = require("resource://devtools/client/shared/components/tree/TreeView.js");
/**
* Initial state definition
*/
function getInitialState() {
return {
enabled: false,
canBeDisabled: true,
canBeEnabled: true,
selected: null,
highlighted: null,
expanded: new Set(),
[PREFS.SCROLL_INTO_VIEW]: Services.prefs.getBoolPref(
PREF_KEYS[PREFS.SCROLL_INTO_VIEW],
false
),
tabbingOrderDisplayed: false,
supports: {},
};
}
/**
* Maintain ui components of the accessibility panel.
*/
function ui(state = getInitialState(), action) {
switch (action.type) {
case ENABLE:
return onToggle(state, action, true);
case UPDATE_CAN_BE_DISABLED:
return onCanBeDisabledChange(state, action);
case UPDATE_CAN_BE_ENABLED:
return onCanBeEnabledChange(state, action);
case UPDATE_PREF:
return onPrefChange(state, action);
case UPDATE_DETAILS:
return onUpdateDetails(state, action);
case HIGHLIGHT:
return onHighlight(state, action);
case AUDIT:
return onAudit(state, action);
case UNHIGHLIGHT:
return onUnhighlight(state, action);
case SELECT:
return onSelect(state, action);
case RESET:
return onReset(state, action);
case UPDATE_DISPLAY_TABBING_ORDER:
return onUpdateDisplayTabbingOrder(state, action);
default:
return state;
}
}
function onUpdateDetails(state) {
if (!state.selected) {
return state;
}
// Clear selected state that should only be set when select action is
// performed.
return Object.assign({}, state, { selected: null });
}
function onUnhighlight(state) {
return Object.assign({}, state, { highlighted: null });
}
function updateExpandedNodes(expanded, ancestry) {
expanded = new Set(expanded);
const path = ancestry.reduceRight((accPath, { accessible }) => {
accPath = TreeView.subPath(accPath, accessible.actorID);
expanded.add(accPath);
return accPath;
}, "");
return { path, expanded };
}
function onAudit(state, { response: ancestries, error }) {
if (error) {
console.warn("Error running audit", error);
return state;
}
let expanded = new Set(state.expanded);
for (const ancestry of ancestries) {
({ expanded } = updateExpandedNodes(expanded, ancestry));
}
return {
...state,
expanded,
};
}
function onHighlight(state, { accessible, response: ancestry, error }) {
if (error) {
console.warn("Error fetching ancestry", error);
return state;
}
const { expanded } = updateExpandedNodes(state.expanded, ancestry);
return Object.assign({}, state, { expanded, highlighted: accessible });
}
function onSelect(state, { accessible, response: ancestry, error }) {
if (error) {
console.warn("Error fetching ancestry", error);
return state;
}
const { path, expanded } = updateExpandedNodes(state.expanded, ancestry);
const selected = TreeView.subPath(path, accessible.actorID);
return Object.assign({}, state, { expanded, selected });
}
/**
* Handle "canBeDisabled" flag update for accessibility service
* @param {Object} state Current ui state
* @param {Object} action Redux action object
* @return {Object} updated state
*/
function onCanBeDisabledChange(state, { canBeDisabled }) {
return Object.assign({}, state, { canBeDisabled });
}
/**
* Handle "canBeEnabled" flag update for accessibility service
* @param {Object} state Current ui state.
* @param {Object} action Redux action object
* @return {Object} updated state
*/
function onCanBeEnabledChange(state, { canBeEnabled }) {
return Object.assign({}, state, { canBeEnabled });
}
/**
* Handle pref update for accessibility panel.
* @param {Object} state Current ui state.
* @param {Object} action Redux action object
* @return {Object} updated state
*/
function onPrefChange(state, { name, value }) {
return {
...state,
[name]: value,
};
}
/**
* Handle reset action for the accessibility panel UI.
* @param {Object} state Current ui state.
* @param {Object} action Redux action object
* @return {Object} updated state
*/
function onReset(state, { enabled, canBeDisabled, canBeEnabled, supports }) {
const newState = {
...getInitialState(),
enabled,
canBeDisabled,
canBeEnabled,
supports,
};
return newState;
}
/**
* Handle accessibilty service enabling/disabling.
* @param {Object} state Current accessibility services enabled state.
* @param {Object} action Redux action object
* @param {Boolean} enabled New enabled state.
* @return {Object} updated state
*/
function onToggle(state, { error }, enabled) {
if (error) {
console.warn("Error enabling accessibility service: ", error);
return state;
}
return Object.assign({}, state, { enabled });
}
function onUpdateDisplayTabbingOrder(state, { error, tabbingOrderDisplayed }) {
if (error) {
console.warn("Error updating displaying tabbing order: ", error);
return state;
}
return Object.assign({}, state, { tabbingOrderDisplayed });
}
exports.ui = ui;
|
