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
|
/* 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/. */
const localization = new Localization(["toolkit/about/aboutWebrtc.ftl"], true);
/*
* A disclosure area that has localized tooltips for expanding and collapsing
* the area.
*/
class Disclosure {
constructor({
showMsg = "about-webrtc-fold-default-show-msg",
hideMsg = "about-webrtc-fold-default-hide-msg",
startsCollapsed = true,
} = {}) {
Object.assign(this, { showMsg, hideMsg, startsCollapsed });
this.target = document.createElement("div");
this.target.classList.add("fold-target");
this.trigger = document.createElement("div");
this.trigger.className = "fold-trigger";
this.trigger.classList.add(
"heading-medium",
"no-print",
this.showMsg,
this.hideMsg
);
this.message = document.createElement("span");
if (this.startsCollapsed) {
this.collapse();
} else {
this.expand();
}
this.trigger.onclick = () => {
if (this.target.classList.contains("fold-closed")) {
this.expand();
} else {
this.collapse();
}
};
}
/** @return {Element} */
control() {
return this.trigger;
}
/** @return {Element} */
view() {
return this.target;
}
expand() {
this.target.classList.remove("fold-closed");
this.control().textContent = String.fromCodePoint(0x25bc);
this.control().setAttribute(
"title",
localization.formatValueSync(this.hideMsg)
);
document.l10n.setAttributes(this.message, this.hideMsg);
}
collapse() {
this.target.classList.add("fold-closed");
this.trigger.textContent = String.fromCodePoint(0x25b6);
this.control().setAttribute(
"title",
localization.formatValueSync(this.showMsg)
);
document.l10n.setAttributes(this.message, this.showMsg);
}
static expandAll() {
for (const target of document.getElementsByClassName("fold-closed")) {
target.classList.remove("fold-closed");
}
for (const trigger of document.getElementsByClassName("fold-trigger")) {
const hideMsg = trigger.classList[2];
document.l10n.setAttributes(trigger, hideMsg);
}
}
static collapseAll() {
for (const target of document.getElementsByClassName("fold-target")) {
target.classList.add("fold-closed");
}
for (const trigger of document.getElementsByClassName("fold-trigger")) {
const showMsg = trigger.classList[1];
document.l10n.setAttributes(trigger, showMsg);
}
}
}
export { Disclosure };
|
