forked from akanyan/STARTLINER
120 lines
4.0 KiB
Vue
120 lines
4.0 KiB
Vue
<script setup lang="ts">
|
|
import { computed } from 'vue';
|
|
import Fieldset from 'primevue/fieldset';
|
|
import InputNumber from 'primevue/inputnumber';
|
|
import InputText from 'primevue/inputtext';
|
|
import RadioButton from 'primevue/radiobutton';
|
|
import Toggle from 'primevue/toggleswitch';
|
|
import { usePkgStore } from '../stores';
|
|
|
|
const store = usePkgStore();
|
|
const _cfg = <T extends string | number | boolean>(key: string, dflt: T) =>
|
|
computed({
|
|
get() {
|
|
return (store.cfg(key) as T) ?? dflt;
|
|
},
|
|
async set(value) {
|
|
await store.set_cfg(key, value ?? dflt);
|
|
},
|
|
});
|
|
|
|
const cfgIntel = _cfg('intel', false);
|
|
const cfgRezW = _cfg('rez-w', 1080);
|
|
const cfgRezH = _cfg('rez-h', 1920);
|
|
const cfgDisplayMode = _cfg('display-mode', 'borderless');
|
|
const cfgAime = _cfg('aime', true);
|
|
const cfgAimeCode = _cfg('aime-code', '00001111222233334444');
|
|
</script>
|
|
|
|
<template>
|
|
<Fieldset legend="Launch options" :toggleable="true">
|
|
<div class="flex w-full flex-col gap-1">
|
|
<label for="switch" class="flex flex-row w-full p-2">
|
|
<div class="grow">
|
|
OpenSSL crash workaround for Intel ≥10th gen
|
|
</div>
|
|
<Toggle inputId="switch" v-model="cfgIntel" />
|
|
</label>
|
|
<label
|
|
id="resolution"
|
|
class="flex flex-row w-full p-2 gap-2 items-center"
|
|
>
|
|
<div class="grow">Resolution</div>
|
|
<InputNumber
|
|
class="shrink"
|
|
size="small"
|
|
:min="480"
|
|
:max="9999"
|
|
:use-grouping="false"
|
|
v-model="cfgRezW"
|
|
/>
|
|
x
|
|
<InputNumber
|
|
class="shrink"
|
|
size="small"
|
|
:min="640"
|
|
:max="9999"
|
|
:use-grouping="false"
|
|
v-model="cfgRezH"
|
|
/>
|
|
</label>
|
|
<label class="flex flex-row w-full p-2 gap-2">
|
|
<div class="grow">Display mode</div>
|
|
<div class="flex items-center gap-2">
|
|
<RadioButton
|
|
v-model="cfgDisplayMode"
|
|
inputId="ingredient1"
|
|
name="window"
|
|
value="window"
|
|
/>
|
|
<label for="ingredient1">window</label>
|
|
</div>
|
|
<div class="flex items-center gap-2">
|
|
<RadioButton
|
|
v-model="cfgDisplayMode"
|
|
inputId="ingredient2"
|
|
name="borderless"
|
|
value="borderless"
|
|
/>
|
|
<label for="ingredient2">borderless window</label>
|
|
</div>
|
|
<div class="flex items-center gap-2">
|
|
<RadioButton
|
|
v-model="cfgDisplayMode"
|
|
inputId="ingredient3"
|
|
name="fullscreen"
|
|
value="fullscreen"
|
|
/>
|
|
<label for="ingredient3">fullscreen</label>
|
|
</div>
|
|
</label>
|
|
<label for="switch" class="flex flex-row w-full p-2">
|
|
<div class="grow">Aime emulation</div>
|
|
<Toggle inputId="switch" v-model="cfgAime" />
|
|
</label>
|
|
<label class="flex flex-row w-full p-2 items-center">
|
|
<div class="grow">Aime code</div>
|
|
<InputText
|
|
class="shrink"
|
|
size="small"
|
|
:disabled="store.cfg('aime') === false"
|
|
:minlength="20"
|
|
:maxlength="20"
|
|
placeholder="00000000000000000000"
|
|
v-model="cfgAimeCode"
|
|
/>
|
|
</label>
|
|
</div>
|
|
</Fieldset>
|
|
</template>
|
|
|
|
<style>
|
|
#resolution .p-inputnumber-input {
|
|
width: 4rem;
|
|
}
|
|
|
|
.p-inputtext {
|
|
font-family: monospace;
|
|
}
|
|
</style>
|