Rubicon/tutu
1
0
Fork 0
Code Issues 19 Pull requests Projects Activity Actions

StackedRouter: new router simulates app behaviour #45

Merged
Rubicon merged 18 commits from stacky into master 2024-11-18 10:35:30 +00:00
Conversation 0 Commits 18 Files changed 25 +13 -15
1 changed files with 13 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files
Showing only changes of commit 3b5cc1e64e - Show all commits

28
src/platform/StackedRouter.tsx
View file

@ -194,11 +194,13 @@ function animateOpen(element: HTMLElement) {
function serializableStack(stack: readonly StackFrame[]) { function serializableStack(stack: readonly StackFrame[]) {
const frames = unwrap(stack); const frames = unwrap(stack);
return frames.map((fr) => { return frames.map((fr) => {
return { return fr.animateClose || fr.animateOpen
path: fr.path, ? {
rootId: fr.rootId, path: fr.path,
state: fr.state, rootId: fr.rootId,
}; state: fr.state,
}
: fr;
}); });
} }
@ -258,11 +260,6 @@ const StackedRouter: Component<StackedRouterProps> = (oprops) => {
} }
}); });
/* createEffect(() => {
const length = stack.length;
console.debug("stack is changed", length, unwrap(stack));
}); */
createRenderEffect(() => { createRenderEffect(() => {
if (stack.length === 0) { if (stack.length === 0) {
pushFrame(window.location.pathname); pushFrame(window.location.pathname);
@ -271,8 +268,12 @@ const StackedRouter: Component<StackedRouterProps> = (oprops) => {
createRenderEffect(() => { createRenderEffect(() => {
makeEventListener(window, "popstate", (event) => { makeEventListener(window, "popstate", (event) => {
if (event.state && stack.length !== event.state.length) { if (!event.state) return;
if (stack.length === 0) {
mutStack(event.state); mutStack(event.state);
} else if (stack.length > event.state.length) {
popFrame(stack.length - event.state.length);
} }
}); });
}); });
@ -358,10 +359,7 @@ const StackedRouter: Component<StackedRouterProps> = (oprops) => {
reenterableAnimation.effect!.getComputedTiming(); reenterableAnimation.effect!.getComputedTiming();
const totalTime = (delay || 0) + Number(activeDuration); const totalTime = (delay || 0) + Number(activeDuration);
if ( if (Number(reenterableAnimation.currentTime) / totalTime > 0.1) {
Number(reenterableAnimation.currentTime) / totalTime >
0.1
) {
reenterableAnimation.addEventListener("finish", () => { reenterableAnimation.addEventListener("finish", () => {
onlyPopFrame(1); onlyPopFrame(1);
}); });