fix(ui): login video/background continuity — video until first login, rotation after #89
@ -426,6 +426,8 @@ async function handleSetup() {
|
|||||||
playLoginSuccessWhoosh()
|
playLoginSuccessWhoosh()
|
||||||
loginTransition.setJustCompletedOnboarding(true)
|
loginTransition.setJustCompletedOnboarding(true)
|
||||||
loginTransition.setJustLoggedIn(true)
|
loginTransition.setJustLoggedIn(true)
|
||||||
|
// First password setup counts as the first login (video → static rotation).
|
||||||
|
try { localStorage.setItem('neode_first_login_done', '1') } catch { /* ignore */ }
|
||||||
await new Promise(r => setTimeout(r, 520))
|
await new Promise(r => setTimeout(r, 520))
|
||||||
await router.replace(loginRedirectTo.value).catch(() => {
|
await router.replace(loginRedirectTo.value).catch(() => {
|
||||||
window.location.href = loginRedirectTo.value
|
window.location.href = loginRedirectTo.value
|
||||||
@ -538,13 +540,17 @@ async function handleTotpVerify() {
|
|||||||
/** A login right after the onboarding wizard (flag set by OnboardingDone)
|
/** A login right after the onboarding wizard (flag set by OnboardingDone)
|
||||||
* gets the FULL dashboard entrance — zoom + oomph — even though it's a
|
* gets the FULL dashboard entrance — zoom + oomph — even though it's a
|
||||||
* regular password login (e.g. the demo). Subsequent logins stay
|
* regular password login (e.g. the demo). Subsequent logins stay
|
||||||
* deliberately low-key (justLoggedIn only). */
|
* deliberately low-key (justLoggedIn only).
|
||||||
|
* Also stamps neode_first_login_done: the login page keeps the intro VIDEO
|
||||||
|
* background until someone has logged in once (OnboardingWrapper reads it
|
||||||
|
* to pick video vs the rotating static backgrounds). */
|
||||||
function consumeOnboardingFinale() {
|
function consumeOnboardingFinale() {
|
||||||
try {
|
try {
|
||||||
if (sessionStorage.getItem('archy_onboarding_finale') === '1') {
|
if (sessionStorage.getItem('archy_onboarding_finale') === '1') {
|
||||||
sessionStorage.removeItem('archy_onboarding_finale')
|
sessionStorage.removeItem('archy_onboarding_finale')
|
||||||
loginTransition.setJustCompletedOnboarding(true)
|
loginTransition.setJustCompletedOnboarding(true)
|
||||||
}
|
}
|
||||||
|
localStorage.setItem('neode_first_login_done', '1')
|
||||||
} catch { /* ignore */ }
|
} catch { /* ignore */ }
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -86,22 +86,22 @@ const videoBackgroundRoutes = ['/onboarding/intro', '/login']
|
|||||||
// Login uses video when coming from splash, or static + glitch when direct
|
// Login uses video when coming from splash, or static + glitch when direct
|
||||||
const isLoginRoute = computed(() => route.path === '/login')
|
const isLoginRoute = computed(() => route.path === '/login')
|
||||||
|
|
||||||
// True once onboarding is complete. Used to skip the intro video on
|
|
||||||
// the /login route so that returning (logged-out) users go straight
|
// Check if current route should use video background.
|
||||||
// to the screensaver-style static + glitch background instead of
|
// The FIRST login (nobody has logged in / set a password yet) keeps the VIDEO
|
||||||
// replaying the full intro every time.
|
// running so the splash → login handoff is one continuous shot; only after a
|
||||||
const onboardingDone = computed(() => {
|
// successful login does /login switch to the rotating static backgrounds.
|
||||||
|
// Login.vue sets neode_first_login_done on every successful login.
|
||||||
|
const hasLoggedInBefore = () => {
|
||||||
try {
|
try {
|
||||||
return localStorage.getItem('neode_onboarding_complete') === '1'
|
return localStorage.getItem('neode_first_login_done') === '1'
|
||||||
} catch {
|
} catch {
|
||||||
return false
|
return false
|
||||||
}
|
}
|
||||||
})
|
}
|
||||||
|
|
||||||
// Check if current route should use video background
|
|
||||||
const useVideoBackground = computed(() => {
|
const useVideoBackground = computed(() => {
|
||||||
if (!videoBackgroundRoutes.includes(route.path)) return false
|
if (!videoBackgroundRoutes.includes(route.path)) return false
|
||||||
if (route.path === '/login' && onboardingDone.value) return false
|
if (route.path === '/login' && hasLoggedInBefore()) return false
|
||||||
return true
|
return true
|
||||||
})
|
})
|
||||||
|
|
||||||
@ -122,9 +122,12 @@ const routeBackgrounds: Record<string, string> = {
|
|||||||
'/login': 'bg-intro.jpg' // Video loops from splash (same as intro)
|
'/login': 'bg-intro.jpg' // Video loops from splash (same as intro)
|
||||||
}
|
}
|
||||||
|
|
||||||
// Rotate the login background so the lock screen doesn't look
|
// Until the user has logged in (or set their password) once, the login
|
||||||
// identical on every logout. Cycles through bg-intro-1..6 using a
|
// background stays PINNED to the same still the intro video ends on — the
|
||||||
// counter persisted to localStorage so subsequent visits advance.
|
// video → login handoff only reads as one continuous shot when both show the
|
||||||
|
// identical frame. From the second login onward the lock screen rotates
|
||||||
|
// through bg-intro-1..6 for variety (counter persisted in localStorage).
|
||||||
|
// Login.vue sets neode_first_login_done on every successful login.
|
||||||
const LOGIN_BACKGROUNDS = [
|
const LOGIN_BACKGROUNDS = [
|
||||||
'bg-intro-1.webp',
|
'bg-intro-1.webp',
|
||||||
'bg-intro-2.jpg',
|
'bg-intro-2.jpg',
|
||||||
@ -135,13 +138,14 @@ const LOGIN_BACKGROUNDS = [
|
|||||||
]
|
]
|
||||||
function pickNextLoginBackground(): string {
|
function pickNextLoginBackground(): string {
|
||||||
try {
|
try {
|
||||||
|
if (localStorage.getItem('neode_first_login_done') !== '1') return 'bg-intro.jpg'
|
||||||
const raw = localStorage.getItem('neode_login_bg_idx')
|
const raw = localStorage.getItem('neode_login_bg_idx')
|
||||||
const prev = raw !== null ? parseInt(raw, 10) : -1
|
const prev = raw !== null ? parseInt(raw, 10) : -1
|
||||||
const next = (Number.isFinite(prev) ? prev + 1 : 0) % LOGIN_BACKGROUNDS.length
|
const next = (Number.isFinite(prev) ? prev + 1 : 0) % LOGIN_BACKGROUNDS.length
|
||||||
localStorage.setItem('neode_login_bg_idx', String(next))
|
localStorage.setItem('neode_login_bg_idx', String(next))
|
||||||
return LOGIN_BACKGROUNDS[next]!
|
return LOGIN_BACKGROUNDS[next]!
|
||||||
} catch {
|
} catch {
|
||||||
return LOGIN_BACKGROUNDS[Math.floor(Math.random() * LOGIN_BACKGROUNDS.length)]!
|
return 'bg-intro.jpg'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
const loginBackground = ref(pickNextLoginBackground())
|
const loginBackground = ref(pickNextLoginBackground())
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user