feat: implement osu! installation path input in Launch.svelte, and enhance loading animation cleanup
This commit is contained in:
parent
afbb4df906
commit
7df448eea8
@ -4,7 +4,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>Tauri + SvelteKit + Typescript App</title>
|
||||
<title>EZPPLauncher</title>
|
||||
%sveltekit.head%
|
||||
</head>
|
||||
|
||||
|
||||
7
src/lib/userAuthentication.ts
Normal file
7
src/lib/userAuthentication.ts
Normal file
@ -0,0 +1,7 @@
|
||||
import { writable } from 'svelte/store';
|
||||
import { Config } from './config';
|
||||
|
||||
export const userAuth = writable<Config>(new Config(true));
|
||||
|
||||
export const username = writable<string>("");
|
||||
export const password = writable<string>("")
|
||||
@ -25,10 +25,45 @@
|
||||
import { fade, fly, scale } from 'svelte/transition';
|
||||
import { Checkbox } from '@/components/ui/checkbox';
|
||||
import Label from '@/components/ui/label/label.svelte';
|
||||
import { cursorSmoothening, customCursor, reduceAnimations, userSettings } from '@/userSettings';
|
||||
import {
|
||||
cursorSmoothening,
|
||||
customCursor,
|
||||
osuInstallationPath,
|
||||
reduceAnimations,
|
||||
userSettings,
|
||||
} from '@/userSettings';
|
||||
import Input from '@/components/ui/input/input.svelte';
|
||||
import { open } from '@tauri-apps/plugin-dialog';
|
||||
import { invoke } from '@tauri-apps/api/core';
|
||||
import { toast } from 'svelte-sonner';
|
||||
|
||||
let selectedTab = $state('home');
|
||||
let launching = $state(false);
|
||||
|
||||
const browse_osu_installation = async () => {
|
||||
const selectedPath = await open({
|
||||
directory: true,
|
||||
multiple: false,
|
||||
title: 'Select osu! Installation Folder',
|
||||
});
|
||||
|
||||
if (typeof selectedPath === 'string') {
|
||||
/* if (selectedPath === $osuInstallationPath) {
|
||||
return;
|
||||
} */
|
||||
const validFolder: boolean = await invoke('valid_osu_folder', { folder: selectedPath });
|
||||
if (!validFolder) {
|
||||
toast.error(
|
||||
'The selected folder is not a valid osu! installation folder. Please select the correct folder.'
|
||||
);
|
||||
return;
|
||||
}
|
||||
osuInstallationPath.set(selectedPath);
|
||||
$userSettings.value('osu_installation_path').set(selectedPath);
|
||||
$userSettings.save();
|
||||
toast.success('osu! installation path set successfully.');
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<AlertDialog.Root bind:open={launching}>
|
||||
@ -370,62 +405,26 @@
|
||||
<Settings2 /> EZPPLauncher Settings
|
||||
</div>
|
||||
<div
|
||||
class="grid grid-cols-[1fr_auto] gap-y-5 items-center border-t border-theme-800 py-3 px-6"
|
||||
class="grid grid-cols-[0.7fr_auto] gap-y-5 items-center border-t border-theme-800 py-3 px-6"
|
||||
>
|
||||
<div class="flex flex-col">
|
||||
<Label class="text-sm" for="setting-custom-cursor">Lazer-Style Cursor</Label>
|
||||
<div class="text-muted-foreground text-xs">
|
||||
Enable a custom cursor in the Launcher like in the lazer build of osu!
|
||||
</div>
|
||||
<Label class="text-sm" for="setting-custom-cursor">osu! installation path</Label>
|
||||
<div class="text-muted-foreground text-xs">The path to your osu! installation.</div>
|
||||
</div>
|
||||
<Checkbox
|
||||
id="setting-custom-cursor"
|
||||
checked={$customCursor}
|
||||
onCheckedChange={async (e) => {
|
||||
if (!e) {
|
||||
cursorSmoothening.set(false);
|
||||
}
|
||||
customCursor.set(e);
|
||||
|
||||
$userSettings.save();
|
||||
}}
|
||||
class="flex items-center justify-center w-5 h-5"
|
||||
></Checkbox>
|
||||
|
||||
<div class="flex flex-col">
|
||||
<Label class="text-sm" for="setting-cursor-smoothening">Cursor Smoothening</Label>
|
||||
<div class="text-muted-foreground text-xs">
|
||||
Makes the custom cursor movement smoother.
|
||||
</div>
|
||||
<div class="flex flex-row w-full">
|
||||
<Input
|
||||
class="mt-4 w-full bg-theme-950 border-theme-800 border-r-0 rounded-r-none"
|
||||
type="text"
|
||||
value={$osuInstallationPath}
|
||||
placeholder="Path to osu! installation"
|
||||
readonly
|
||||
/>
|
||||
<Button
|
||||
class="mt-4 bg-theme-950 border-theme-800 rounded-l-none"
|
||||
variant="outline"
|
||||
onclick={browse_osu_installation}>Browse</Button
|
||||
>
|
||||
</div>
|
||||
<Checkbox
|
||||
id="setting-cursor-smoothening"
|
||||
checked={$cursorSmoothening}
|
||||
onCheckedChange={async (e) => {
|
||||
if (!$customCursor) return;
|
||||
cursorSmoothening.set(e);
|
||||
$userSettings.save();
|
||||
}}
|
||||
disabled={!$customCursor}
|
||||
class="flex items-center justify-center w-5 h-5"
|
||||
></Checkbox>
|
||||
|
||||
<div class="flex flex-col">
|
||||
<Label class="text-sm" for="setting-cursor-smoothening">Reduce Animations</Label>
|
||||
<div class="text-muted-foreground text-xs">
|
||||
Disables some animations in the Launcher to improve performance on low-end devices.
|
||||
</div>
|
||||
</div>
|
||||
<Checkbox
|
||||
id="setting-cursor-smoothening"
|
||||
checked={$reduceAnimations}
|
||||
onCheckedChange={async (e) => {
|
||||
reduceAnimations.set(e);
|
||||
$userSettings.save();
|
||||
}}
|
||||
disabled={!$customCursor}
|
||||
class="flex items-center justify-center w-5 h-5"
|
||||
></Checkbox>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
@ -10,11 +10,13 @@
|
||||
|
||||
let ezppLogo: HTMLImageElement;
|
||||
let spinnerCircle: SVGCircleElement;
|
||||
let animateInterval: number | undefined;
|
||||
|
||||
//TODO: use this to check for updates upon launch
|
||||
|
||||
const doBPMAnimation = () => {
|
||||
setInterval(async () => {
|
||||
if (animateInterval) return;
|
||||
animateInterval = window.setInterval(async () => {
|
||||
animate(ezppLogo, {
|
||||
scale: 1.1,
|
||||
duration: 900,
|
||||
@ -83,7 +85,7 @@
|
||||
prepare();
|
||||
|
||||
return () => {
|
||||
utils.remove(ezppLogo);
|
||||
window.clearInterval(animateInterval);
|
||||
utils.remove(spinnerCircle);
|
||||
};
|
||||
});
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user