aboutsummaryrefslogtreecommitdiff
path: root/ext/bg
diff options
context:
space:
mode:
authortoasted-nutbread <toasted-nutbread@users.noreply.github.com>2020-12-31 13:38:51 -0500
committerGitHub <noreply@github.com>2020-12-31 13:38:51 -0500
commit1b4ba1fb006a6e6dda7f19c797b204c43900df4a (patch)
treecd1529f5c2b448ef2d2f9673b20435c94b91f44a /ext/bg
parent1ac4e979e49cf65fbda1ad8f9a92b22b5b22bccf (diff)
Simplify glossary layout setting (#1188)
* Add conditionalConvert transform * Convert glossaryLayoutMode option to a toggle
Diffstat (limited to 'ext/bg')
-rw-r--r--ext/bg/js/settings/generic-setting-controller.js18
-rw-r--r--ext/bg/settings2.html32
2 files changed, 42 insertions, 8 deletions
diff --git a/ext/bg/js/settings/generic-setting-controller.js b/ext/bg/js/settings/generic-setting-controller.js
index 04cad67d..b669cab9 100644
--- a/ext/bg/js/settings/generic-setting-controller.js
+++ b/ext/bg/js/settings/generic-setting-controller.js
@@ -36,7 +36,8 @@ class GenericSettingController {
['splitTags', this._splitTags.bind(this)],
['joinTags', this._joinTags.bind(this)],
['toNumber', this._toNumber.bind(this)],
- ['toString', this._toString.bind(this)]
+ ['toString', this._toString.bind(this)],
+ ['conditionalConvert', this._conditionalConvert.bind(this)]
]);
}
@@ -208,4 +209,19 @@ class GenericSettingController {
_toString(value) {
return `${value}`;
}
+
+ _conditionalConvert(value, data) {
+ const {cases} = data;
+ if (Array.isArray(cases)) {
+ for (const {op, value: value2, default: isDefault, result} of cases) {
+ if (isDefault === true) {
+ value = result;
+ } else if (this._evaluateSimpleOperation(op, value, value2)) {
+ value = result;
+ break;
+ }
+ }
+ }
+ return value;
+ }
}
diff --git a/ext/bg/settings2.html b/ext/bg/settings2.html
index be6e01e1..07bcb6ca 100644
--- a/ext/bg/settings2.html
+++ b/ext/bg/settings2.html
@@ -611,16 +611,34 @@
</div>
</div>
</div>
- <div class="settings-item"><div class="settings-item-inner settings-item-inner-wrappable">
+ <div class="settings-item"><div class="settings-item-inner">
<div class="settings-item-left">
- <div class="settings-item-label">Glossary layout</div>
- <div class="settings-item-description">Configure how term glossaries are displayed.</div>
+ <div class="settings-item-label">Compact glossaries</div>
+ <div class="settings-item-description">Display term glossaries using a more compact layout.</div>
</div>
<div class="settings-item-right">
- <select data-setting="general.glossaryLayoutMode">
- <option value="default">Default</option>
- <option value="compact">Compact</option>
- </select>
+ <label class="toggle"><input type="checkbox" data-setting="general.glossaryLayoutMode"
+ data-transform='[
+ {
+ "step": "pre",
+ "type": "conditionalConvert",
+ "cases": [
+ {"op": "===", "value": false, "result": "default"},
+ {"op": "===", "value": true, "result": "compact"},
+ {"default": true, "result": "default"}
+ ]
+ },
+ {
+ "step": "post",
+ "type": "conditionalConvert",
+ "cases": [
+ {"op": "===", "value": "default", "result": false},
+ {"op": "===", "value": "compact", "result": true},
+ {"default": true, "result": false}
+ ]
+ }
+ ]'
+ ><span class="toggle-body"><span class="toggle-track"></span><span class="toggle-knob"></span></span></label>
</div>
</div></div>
<div class="settings-item"><div class="settings-item-inner">