Feat: navigation par slides horizontaux
All checks were successful
Deploy / Deploy to Production (push) Successful in 14s
All checks were successful
Deploy / Deploy to Production (push) Successful in 14s
- Nouveau store slides.svelte.js : gestion de l'état des slides (activeIndex, pendingPath, chargement progressif) - Réécriture du router : remplace navaid par une logique custom avec chargement de la slide initiale puis des autres en arrière-plan - App.svelte : layout slides-wrapper avec translateX, transition 1000ms - Header.svelte : menu 100% dynamique depuis slides.all (ordre et titres multilingues depuis Kirby) - site/controllers/site.php : navigation exposée via site->pages()->listed() avec titres par langue, home prependue Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
parent
614098baf6
commit
8e01cbe611
5 changed files with 241 additions and 174 deletions
76
src/state/slides.svelte.js
Normal file
76
src/state/slides.svelte.js
Normal file
|
|
@ -0,0 +1,76 @@
|
|||
let slidesData = $state([])
|
||||
let activeIndex = $state(0)
|
||||
let pendingPath = $state(null)
|
||||
|
||||
function getIndexByPath(path) {
|
||||
return slidesData.findIndex(s => s.path === path)
|
||||
}
|
||||
|
||||
export const slides = {
|
||||
get all() { return slidesData },
|
||||
get activeIndex() { return activeIndex },
|
||||
get active() { return slidesData[activeIndex] ?? null },
|
||||
get pendingPath() { return pendingPath },
|
||||
|
||||
init(siteNavigation) {
|
||||
slidesData = siteNavigation.map(nav => ({
|
||||
id: nav.id,
|
||||
path: nav.url,
|
||||
title: nav.title,
|
||||
titles: nav.titles || { fr: nav.title },
|
||||
template: nav.id,
|
||||
data: null,
|
||||
loaded: false,
|
||||
loading: false
|
||||
}))
|
||||
},
|
||||
|
||||
setData(path, data) {
|
||||
const idx = getIndexByPath(path)
|
||||
if (idx === -1) return
|
||||
slidesData[idx] = {
|
||||
...slidesData[idx],
|
||||
template: data.template || slidesData[idx].id,
|
||||
data,
|
||||
loaded: true,
|
||||
loading: false
|
||||
}
|
||||
if (pendingPath === path) {
|
||||
slides.resolvePending()
|
||||
}
|
||||
},
|
||||
|
||||
setLoading(path, bool) {
|
||||
const idx = getIndexByPath(path)
|
||||
if (idx === -1) return
|
||||
slidesData[idx] = { ...slidesData[idx], loading: bool }
|
||||
},
|
||||
|
||||
slideTo(path) {
|
||||
const idx = getIndexByPath(path)
|
||||
if (idx === -1) return
|
||||
if (slidesData[idx].loaded) {
|
||||
activeIndex = idx
|
||||
pendingPath = null
|
||||
} else {
|
||||
pendingPath = path
|
||||
}
|
||||
},
|
||||
|
||||
setActiveIndex(idx) {
|
||||
activeIndex = idx
|
||||
},
|
||||
|
||||
resolvePending() {
|
||||
if (!pendingPath) return
|
||||
const idx = getIndexByPath(pendingPath)
|
||||
if (idx !== -1 && slidesData[idx].loaded) {
|
||||
activeIndex = idx
|
||||
pendingPath = null
|
||||
}
|
||||
},
|
||||
|
||||
getIndexByPath(path) {
|
||||
return getIndexByPath(path)
|
||||
}
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue