state machine: push updates, added runtime page control
This commit is contained in:
@@ -43,22 +43,25 @@
|
|||||||
import { ArrowLeft, Check } from 'phosphor-svelte';
|
import { ArrowLeft, Check } from 'phosphor-svelte';
|
||||||
import type { IconDef } from './util';
|
import type { IconDef } from './util';
|
||||||
|
|
||||||
let {
|
interface Props {
|
||||||
pages,
|
|
||||||
success,
|
|
||||||
failure,
|
|
||||||
index = $bindable(0),
|
|
||||||
action
|
|
||||||
}: {
|
|
||||||
pages: StateMachinePage[];
|
pages: StateMachinePage[];
|
||||||
success: StateMachinePage;
|
success: StateMachinePage;
|
||||||
failure: StateMachinePage;
|
failure: StateMachinePage;
|
||||||
index?: number;
|
index?: number;
|
||||||
action?: string;
|
action?: string;
|
||||||
} = $props();
|
}
|
||||||
|
|
||||||
pages.push(success, failure); // add success and failure pages to the end of the pages array
|
let {
|
||||||
// let progressVisible = $state(false);
|
/** The initial pages to display, should NOT be modified after initialization. */
|
||||||
|
pages: initialPages,
|
||||||
|
success,
|
||||||
|
failure,
|
||||||
|
index = $bindable(0),
|
||||||
|
action
|
||||||
|
}: Props = $props();
|
||||||
|
|
||||||
|
// add success and failure pages to the end of the pages array
|
||||||
|
let pages = $state([...initialPages, success, failure]);
|
||||||
|
|
||||||
let lastIndex = $state(index);
|
let lastIndex = $state(index);
|
||||||
let page = $derived(pages[index]);
|
let page = $derived(pages[index]);
|
||||||
@@ -102,6 +105,40 @@
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
export const updateHeight = async () => {
|
||||||
|
await tick();
|
||||||
|
if (!pageContainer) return;
|
||||||
|
height.set(pageContainer.offsetHeight);
|
||||||
|
};
|
||||||
|
|
||||||
|
export const setIndex = (i: number) => {
|
||||||
|
if (i < 0 || i >= pages.length) return;
|
||||||
|
index = i;
|
||||||
|
};
|
||||||
|
|
||||||
|
export const splicePages = (
|
||||||
|
start: number,
|
||||||
|
deleteCount: number,
|
||||||
|
...newPages: StateMachinePage[]
|
||||||
|
) => {
|
||||||
|
if (start < 0 || start > pages.length) return;
|
||||||
|
if (deleteCount < 0 || start + deleteCount > pages.length) return;
|
||||||
|
|
||||||
|
pages.splice(start, deleteCount, ...newPages);
|
||||||
|
if (index >= start && index < start + deleteCount) {
|
||||||
|
// current page was deleted
|
||||||
|
index = Math.min(start, pages.length - 1);
|
||||||
|
} else if (index >= start + deleteCount) {
|
||||||
|
// current page was after deleted pages
|
||||||
|
index -= deleteCount;
|
||||||
|
index += newPages.length;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
export const insertAfterCurrent = (...newPages: StateMachinePage[]) => {
|
||||||
|
splicePages(index + 1, 0, ...newPages);
|
||||||
|
};
|
||||||
|
|
||||||
const updateHeroText = () => {
|
const updateHeroText = () => {
|
||||||
if (
|
if (
|
||||||
heroText.scrollWidth > heroText.offsetWidth ||
|
heroText.scrollWidth > heroText.offsetWidth ||
|
||||||
@@ -235,6 +272,7 @@
|
|||||||
index = pages.length - 2;
|
index = pages.length - 2;
|
||||||
} else {
|
} else {
|
||||||
index = pages.length - 1;
|
index = pages.length - 1;
|
||||||
|
console.log(json);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user