Simplify glossary layout setting (#1188)

* Add conditionalConvert transform

* Convert glossaryLayoutMode option to a toggle
This commit is contained in:
toasted-nutbread 2020-12-31 13:38:51 -05:00 committed by GitHub
parent 1ac4e979e4
commit 1b4ba1fb00
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 42 additions and 8 deletions

View File

@ -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;
}
}

View File

@ -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">