1
0
silverbullet/packages/web/navigator.ts
2022-04-25 10:33:38 +02:00

70 lines
1.7 KiB
TypeScript

import { safeRun } from "../common/util";
function encodePageUrl(name: string): string {
return name.replaceAll(" ", "_");
}
function decodePageUrl(url: string): string {
return url.replaceAll("_", " ");
}
export class PathPageNavigator {
navigationResolve?: () => void;
async navigate(page: string, pos?: number) {
window.history.pushState({ page, pos }, page, `/${encodePageUrl(page)}`);
window.dispatchEvent(
new PopStateEvent("popstate", {
state: { page, pos },
})
);
await new Promise<void>((resolve) => {
this.navigationResolve = resolve;
});
this.navigationResolve = undefined;
}
subscribe(
pageLoadCallback: (pageName: string, pos: number) => Promise<void>
): void {
const cb = (event?: PopStateEvent) => {
const gotoPage = this.getCurrentPage();
if (!gotoPage) {
return;
}
safeRun(async () => {
await pageLoadCallback(
this.getCurrentPage(),
event?.state && event.state.pos
);
if (this.navigationResolve) {
this.navigationResolve();
}
});
};
window.addEventListener("popstate", cb);
cb();
}
decodeURI(): [string, number] {
let parts = decodeURI(location.pathname).substring(1).split("@");
let page =
parts.length > 1 ? parts.slice(0, parts.length - 1).join("@") : parts[0];
let pos = parts.length > 1 ? parts[parts.length - 1] : "0";
if (pos.match(/^\d+$/)) {
return [page, +pos];
} else {
return [`${page}@${pos}`, 0];
}
}
getCurrentPage(): string {
return decodePageUrl(this.decodeURI()[0]);
}
getCurrentPos(): number {
console.log("Pos", this.decodeURI()[1]);
return this.decodeURI()[1];
}
}