Show indicator for current preset

This commit is contained in:
redphx 2024-12-09 19:59:30 +07:00
parent 3230b99a05
commit d0a8b894b9
7 changed files with 26 additions and 25 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -92,7 +92,7 @@
} }
.bx-default-preset-note { .bx-default-preset-note {
font-size: 0.8rem; font-size: 12px;
font-style: italic; font-style: italic;
text-align: center; text-align: center;
margin-bottom: 10px; margin-bottom: 10px;

View File

@ -42,11 +42,7 @@ export abstract class BaseProfileManagerDialog<T extends PresetRecord> extends N
private async renderPresetsList() { private async renderPresetsList() {
this.allPresets = await this.presetsDb.getPresets(); this.allPresets = await this.presetsDb.getPresets();
if (!this.currentPresetId) { renderPresetsList<T>(this.$presets, this.allPresets, this.currentPresetId, { selectedIndicator: true });
this.currentPresetId = this.allPresets.default[0];
}
renderPresetsList<T>(this.$presets, this.allPresets, this.currentPresetId);
} }
private promptNewName(action: string,value='') { private promptNewName(action: string,value='') {

View File

@ -136,7 +136,7 @@ export class ControllerExtraSettings extends HTMLElement {
// Render shortcut presets // Render shortcut presets
const allShortcutPresets = await ControllerShortcutsTable.getInstance().getPresets(); const allShortcutPresets = await ControllerShortcutsTable.getInstance().getPresets();
renderPresetsList(this.$selectShortcuts, allShortcutPresets, null, true); renderPresetsList(this.$selectShortcuts, allShortcutPresets, null, { addOffValue: true });
for (const name of this.controllerIds) { for (const name of this.controllerIds) {
const $option = CE<HTMLOptionElement>('option', { value: name }, name); const $option = CE<HTMLOptionElement>('option', { value: name }, name);

View File

@ -108,11 +108,11 @@ export class MkbExtraSettings extends HTMLElement {
private static async updateLayout(this: MkbExtraSettings) { private static async updateLayout(this: MkbExtraSettings) {
// Render shortcut presets // Render shortcut presets
const mappingPresets = await MkbMappingPresetsTable.getInstance().getPresets(); const mappingPresets = await MkbMappingPresetsTable.getInstance().getPresets();
renderPresetsList(this.$mappingPresets, mappingPresets, getPref<MkbPresetId>(PrefKey.MKB_P1_MAPPING_PRESET_ID), false); renderPresetsList(this.$mappingPresets, mappingPresets, getPref<MkbPresetId>(PrefKey.MKB_P1_MAPPING_PRESET_ID));
// Render shortcut presets // Render shortcut presets
const shortcutsPresets = await KeyboardShortcutsTable.getInstance().getPresets(); const shortcutsPresets = await KeyboardShortcutsTable.getInstance().getPresets();
renderPresetsList(this.$shortcutsPresets, shortcutsPresets, getPref<MkbPresetId>(PrefKey.KEYBOARD_SHORTCUTS_IN_GAME_PRESET_ID), true); renderPresetsList(this.$shortcutsPresets, shortcutsPresets, getPref<MkbPresetId>(PrefKey.KEYBOARD_SHORTCUTS_IN_GAME_PRESET_ID), { addOffValue: true });
} }
private static async saveMkbSettings(this: MkbExtraSettings) { private static async saveMkbSettings(this: MkbExtraSettings) {

View File

@ -263,10 +263,10 @@ export function clearDataSet($elm: HTMLElement) {
}); });
} }
export function renderPresetsList<T extends PresetRecord>($select: HTMLSelectElement, allPresets: AllPresets<T>, selectedValue: number | null, addOffValue=false) { export function renderPresetsList<T extends PresetRecord>($select: HTMLSelectElement, allPresets: AllPresets<T>, selectedValue: number | null, options: { addOffValue?: boolean, selectedIndicator?: boolean }={}) {
removeChildElements($select); removeChildElements($select);
if (addOffValue) { if (options.addOffValue) {
const $option = CE<HTMLOptionElement>('option', { value: 0 }, t('off')); const $option = CE<HTMLOptionElement>('option', { value: 0 }, t('off'));
$option.selected = selectedValue === 0; $option.selected = selectedValue === 0;
@ -284,8 +284,13 @@ export function renderPresetsList<T extends PresetRecord>($select: HTMLSelectEle
const $optGroup = CE('optgroup', { label: groups[key] }); const $optGroup = CE('optgroup', { label: groups[key] });
for (const id of allPresets[key]) { for (const id of allPresets[key]) {
const record = allPresets.data[id]; const record = allPresets.data[id];
const $option = CE<HTMLOptionElement>('option', { value: record.id }, record.name); const selected = selectedValue === record.id;
$option.selected = selectedValue === record.id; const name = options.selectedIndicator && selected ? '✅ ' + record.name : record.name;
const $option = CE<HTMLOptionElement>('option', { value: record.id }, name);
if (selected) {
$option.selected = true;
}
$optGroup.appendChild($option); $optGroup.appendChild($option);
} }