mirror of
https://github.com/moku-project/Moku.git
synced 2026-06-13 09:19:56 -05:00
Fix: Splashscreen Appears on Boot
This commit is contained in:
@@ -27,8 +27,8 @@
|
|||||||
onDismiss,
|
onDismiss,
|
||||||
}: Props = $props()
|
}: Props = $props()
|
||||||
|
|
||||||
const EXIT_MS = 320
|
const EXIT_MS = 320
|
||||||
const RING_R = 70
|
const RING_R = 70
|
||||||
const RING_PAD = 12
|
const RING_PAD = 12
|
||||||
const { size: ringSize, c: ringC, circ: ringCirc } = ringGeometry(RING_R, RING_PAD)
|
const { size: ringSize, c: ringC, circ: ringCirc } = ringGeometry(RING_R, RING_PAD)
|
||||||
|
|
||||||
@@ -80,6 +80,7 @@
|
|||||||
exiting = false
|
exiting = false
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
if (failed || notConfigured) return
|
||||||
triggerExit(onReady)
|
triggerExit(onReady)
|
||||||
})
|
})
|
||||||
|
|
||||||
@@ -204,7 +205,7 @@
|
|||||||
.ring { transition:opacity 0.5s ease; }
|
.ring { transition:opacity 0.5s ease; }
|
||||||
.ring-hide { opacity:0; }
|
.ring-hide { opacity:0; }
|
||||||
|
|
||||||
.bottom-area { display:flex; align-items:center; justify-content:center; min-height:48px; position:relative; }
|
.bottom-area { display:flex; align-items:center; justify-content:center; min-height:48px; position:relative; }
|
||||||
.status-slot { display:flex; align-items:center; justify-content:center; transition:opacity 0.35s ease; position:absolute; }
|
.status-slot { display:flex; align-items:center; justify-content:center; transition:opacity 0.35s ease; position:absolute; }
|
||||||
.status-slot-hide { opacity:0; pointer-events:none; }
|
.status-slot-hide { opacity:0; pointer-events:none; }
|
||||||
.status-text { font-family:var(--font-ui); font-size:10px; color:var(--text-faint); letter-spacing:0.12em; margin:0; min-width:160px; text-align:center; }
|
.status-text { font-family:var(--font-ui); font-size:10px; color:var(--text-faint); letter-spacing:0.12em; margin:0; min-width:160px; text-align:center; }
|
||||||
|
|||||||
@@ -10,25 +10,35 @@
|
|||||||
|
|
||||||
let { children } = $props()
|
let { children } = $props()
|
||||||
|
|
||||||
const isTauri = typeof window !== 'undefined' && '__TAURI_INTERNALS__' in window
|
const isTauri = typeof window !== 'undefined' && '__TAURI_INTERNALS__' in window
|
||||||
const ringFull = $derived(appState.status !== 'booting')
|
const ringFull = $derived(appState.status !== 'booting')
|
||||||
const splashDone = $derived(
|
|
||||||
|
let splashVisible = $state(true)
|
||||||
|
let bypassed = $state(false)
|
||||||
|
|
||||||
|
const showApp = $derived(
|
||||||
appState.status === 'ready' ||
|
appState.status === 'ready' ||
|
||||||
appState.status === 'auth' ||
|
appState.status === 'auth' ||
|
||||||
appState.status === 'error'
|
bypassed
|
||||||
)
|
)
|
||||||
|
|
||||||
let bypassed = $state(false)
|
function onSplashReady() {
|
||||||
const showApp = $derived(splashDone && (appState.status === 'ready' || appState.status === 'auth' || bypassed))
|
splashVisible = false
|
||||||
|
}
|
||||||
|
|
||||||
|
function onSplashBypass() {
|
||||||
|
bypassed = true
|
||||||
|
splashVisible = false
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
{#if !showApp}
|
{#if splashVisible}
|
||||||
<SplashScreen
|
<SplashScreen
|
||||||
mode="loading"
|
mode="loading"
|
||||||
{ringFull}
|
{ringFull}
|
||||||
failed={appState.status === 'error'}
|
failed={appState.status === 'error'}
|
||||||
onReady={() => {}}
|
onReady={onSplashReady}
|
||||||
onBypass={() => (bypassed = true)}
|
onBypass={onSplashBypass}
|
||||||
onRetry={() => window.location.reload()}
|
onRetry={() => window.location.reload()}
|
||||||
/>
|
/>
|
||||||
{/if}
|
{/if}
|
||||||
|
|||||||
@@ -1,2 +1,3 @@
|
|||||||
<h1>Welcome to SvelteKit</h1>
|
<script lang="ts">
|
||||||
<p>Visit <a href="https://svelte.dev/docs/kit">svelte.dev/docs/kit</a> to read the documentation</p>
|
|
||||||
|
</script>
|
||||||
Reference in New Issue
Block a user