95 lines
2.6 KiB
JavaScript
95 lines
2.6 KiB
JavaScript
/* 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 };
|