Files
STARTLINER/src/components/OptionList.vue
2025-03-05 00:40:59 +01:00

282 lines
8.5 KiB
Vue

<script setup lang="ts">
import { Ref, computed, ref } from 'vue';
import InputNumber from 'primevue/inputnumber';
import InputText from 'primevue/inputtext';
import Select from 'primevue/select';
import SelectButton from 'primevue/selectbutton';
import ToggleSwitch from 'primevue/toggleswitch';
import { invoke as unproxied_invoke } from '@tauri-apps/api/core';
import FileEditor from './FileEditor.vue';
import FilePicker from './FilePicker.vue';
import OptionCategory from './OptionCategory.vue';
import OptionRow from './OptionRow.vue';
import { invoke } from '../invoke';
import { usePrfStore } from '../stores';
const prf = usePrfStore();
const aimeCode = ref('');
const capabilities: Ref<string[]> = ref([]);
const displayList: Ref<{ title: string; value: string }[]> = ref([
{
title: 'Primary',
value: 'default',
},
]);
const hookList: Ref<{ title: string; value: string }[]> = ref([
{
title: 'segatools-mu3hook',
value: 'segatools-mu3hook',
},
]);
unproxied_invoke('read_profile_data', {
path: 'aime.txt',
})
.then((v: unknown) => {
if (typeof v === 'string') {
aimeCode.value = v;
} else {
aimeCode.value = '';
}
})
.catch(() => {
aimeCode.value = '';
});
invoke('list_platform_capabilities')
.then(async (v: unknown) => {
if (Array.isArray(v)) {
capabilities.value.push(...v);
}
if (capabilities.value.includes('display')) {
for (const [devName, devString] of (await invoke(
'list_displays'
)) as Array<[string, string]>) {
displayList.value.push({
title: `${devName.replace('\\\\.\\', '')} (${devString})`,
value: devName,
});
}
}
})
.catch(() => {});
const aimeCodeModel = computed({
get() {
return aimeCode.value;
},
async set(value: string) {
aimeCode.value = value;
if (value.match(/^[0-9]{20}$/)) {
await invoke('write_profile_data', {
path: 'aime.txt',
content: aimeCode.value,
});
}
},
});
</script>
<template>
<OptionCategory title="General">
<!-- <OptionRow title="mu3.exe">
<FilePicker
field="game-dir"
default=""
:directory="false"
promptname="mu3.exe"
extension="exe"
></FilePicker>
</OptionRow> -->
<OptionRow title="mu3hook">
<Select
:model-value="prf.cfg('hook', 'segatools-mu3hook')"
:options="hookList"
option-label="title"
option-value="value"
></Select>
</OptionRow>
<OptionRow title="amfs">
<FilePicker
field="amfs"
default=""
placeholder="amfs"
:directory="true"
></FilePicker>
</OptionRow>
<OptionRow title="option">
<FilePicker
field="option"
default="option"
:directory="true"
></FilePicker>
</OptionRow>
<OptionRow title="appdata">
<FilePicker
field="appdata"
default="appdata"
:directory="true"
></FilePicker>
</OptionRow>
</OptionCategory>
<OptionCategory title="Display">
<OptionRow
v-if="capabilities.includes('display')"
title="Target display"
>
<Select
:model-value="prf.cfg('display', 'default')"
:options="displayList"
option-label="title"
option-value="value"
></Select>
</OptionRow>
<OptionRow id="resolution" title="Game resolution">
<InputNumber
class="shrink"
size="small"
:min="480"
:max="9999"
:use-grouping="false"
:model-value="
// prettier-ignore Because primevue fucked up
prf.cfg('rez-w', 1080) as any
"
/>
x
<InputNumber
class="shrink"
size="small"
:min="640"
:max="9999"
:use-grouping="false"
:model-value="
// prettier-ignore
prf.cfg('rez-h', 1920) as any
"
/>
</OptionRow>
<OptionRow title="Display mode">
<SelectButton
:model-value="prf.cfg('display-mode', 'borderless')"
:options="[
{ title: 'Window', value: 'window' },
{ title: 'Borderless window', value: 'borderless' },
{ title: 'Fullscreen', value: 'fullscreen' },
]"
option-label="title"
option-value="value"
/>
</OptionRow>
<OptionRow
title="Display rotation"
v-if="capabilities.includes('display')"
>
<SelectButton
:model-value="prf.cfg('display-rotation', 0)"
:options="[
{ title: 'Unchanged', value: 0 },
{ title: 'Portrait', value: 90 },
{ title: 'Portrait (flipped)', value: 270 },
]"
option-label="title"
option-value="value"
:disabled="prf.cfg('display', 'default').value === 'default'"
/>
</OptionRow>
<OptionRow
title="Match display resolution with the game"
v-if="capabilities.includes('display')"
>
<!-- @vue-expect-error -->
<ToggleSwitch
:disabled="
prf.cfg('display', 'default').value === 'default' ||
prf.cfg('display-mode', 'borderless').value != 'borderless'
"
:model-value="prf.cfg('borderless-fullscreen', false)"
/>
</OptionRow>
</OptionCategory>
<OptionCategory title="Network">
<OptionRow title="Server address">
<InputText
class="shrink"
size="small"
:maxlength="40"
placeholder="192.168.1.234"
:model-value="
// prettier-ignore
prf.cfg<string>('dns-default', '') as any
"
/> </OptionRow
><OptionRow title="Keychip">
<InputText
class="shrink"
size="small"
:maxlength="16"
placeholder="A123-01234567890"
:model-value="
// prettier-ignore
prf.cfg('keychip', '') as any
"
/> </OptionRow
><OptionRow title="Subnet">
<InputText
class="shrink"
size="small"
:maxlength="15"
placeholder="192.168.1.0"
:model-value="
// prettier-ignore
prf.cfg('subnet', '') as any
"
/>
</OptionRow>
</OptionCategory>
<OptionCategory title="Misc">
<OptionRow title="OpenSSL bug workaround for Intel 10th gen">
<!-- @vue-expect-error -->
<ToggleSwitch :model-value="prf.cfg('intel', false)" />
</OptionRow>
<OptionRow title="Aime emulation">
<!-- @vue-expect-error -->
<ToggleSwitch :model-value="prf.cfg('aime', false)" />
</OptionRow>
<OptionRow title="Aime code">
<InputText
class="shrink"
size="small"
:disabled="prf.cfg<boolean>('aime', false).value !== true"
:maxlength="20"
placeholder="00000000000000000000"
v-model="aimeCodeModel"
/>
</OptionRow>
<OptionRow title="More segatools options">
<FileEditor filename="segatools-base.ini" />
</OptionRow>
<OptionRow title="Inohara config">
<FileEditor
filename="inohara.cfg"
promptname="inohara config file"
extension="cfg"
/>
</OptionRow>
</OptionCategory>
</template>
<style>
#resolution .p-inputnumber-input {
width: 4rem;
}
.p-inputtext {
font-family: monospace;
}
</style>