aboutsummaryrefslogtreecommitdiff
path: root/ext/js/display/element-overflow-controller.js
diff options
context:
space:
mode:
authortoasted-nutbread <toasted-nutbread@users.noreply.github.com>2022-05-30 13:34:37 -0400
committerGitHub <noreply@github.com>2022-05-30 13:34:37 -0400
commitaa5e13b441da693441a27113169c2bf87f676d06 (patch)
tree1ba9d2aadc04182850e87e3450b29f551f8d84f7 /ext/js/display/element-overflow-controller.js
parent19bba07a8bccb51a9db85c13fd921d825defe753 (diff)
Collapsible dictionary updates (#2170)
* Add "force collapsed" and "force expanded" options * Simplify "any" check * Update style * Add help modal for collapsible dictionaries * Disable wrapping
Diffstat (limited to 'ext/js/display/element-overflow-controller.js')
-rw-r--r--ext/js/display/element-overflow-controller.js28
1 files changed, 19 insertions, 9 deletions
diff --git a/ext/js/display/element-overflow-controller.js b/ext/js/display/element-overflow-controller.js
index 0c6b3a71..04f26438 100644
--- a/ext/js/display/element-overflow-controller.js
+++ b/ext/js/display/element-overflow-controller.js
@@ -32,6 +32,7 @@ class ElementOverflowController {
for (const {name, definitionsCollapsible} of options.dictionaries) {
let collapsible = false;
let collapsed = false;
+ let force = false;
switch (definitionsCollapsible) {
case 'expanded':
collapsible = true;
@@ -40,9 +41,18 @@ class ElementOverflowController {
collapsible = true;
collapsed = true;
break;
+ case 'force-expanded':
+ collapsible = true;
+ force = true;
+ break;
+ case 'force-collapsed':
+ collapsible = true;
+ collapsed = true;
+ force = true;
+ break;
}
if (!collapsible) { continue; }
- this._dictionaries.set(name, {collapsed});
+ this._dictionaries.set(name, {collapsed, force});
}
}
@@ -50,14 +60,17 @@ class ElementOverflowController {
if (this._dictionaries.size === 0) { return; }
const elements = entry.querySelectorAll('.definition-item-inner');
- let any = false;
for (const element of elements) {
const {dictionary} = element.parentNode.dataset;
const dictionaryInfo = this._dictionaries.get(dictionary);
if (typeof dictionaryInfo === 'undefined') { continue; }
- this._updateElement(element);
- this._elements.push(element);
+ if (dictionaryInfo.force) {
+ element.classList.add('collapsible', 'collapsible-forced');
+ } else {
+ this._updateElement(element);
+ this._elements.push(element);
+ }
if (dictionaryInfo.collapsed) {
element.classList.add('collapsed');
@@ -67,18 +80,15 @@ class ElementOverflowController {
if (button !== null) {
this._eventListeners.addEventListener(button, 'click', this._onToggleButtonClickBind, false);
}
-
- any = true;
}
- if (any && this._windowEventListeners.size === 0) {
+ if (this._elements.length > 0 && this._windowEventListeners.size === 0) {
this._windowEventListeners.addEventListener(window, 'resize', this._onWindowResizeBind, false);
}
}
clearElements() {
- if (this._elements.length === 0) { return; }
- this._elements = [];
+ this._elements.length = 0;
this._windowEventListeners.removeAllEventListeners();
}