From bf1a71a58bbb6215017d1d4ce4334176f3c1d81d Mon Sep 17 00:00:00 2001 From: Michael Zhang Date: Wed, 15 May 2024 14:17:01 -0500 Subject: [PATCH] reorg --- lib/{ => stepcharts}/parseDwi.ts | 0 lib/{ => stepcharts}/parseSimfile.ts | 0 lib/{ => stepcharts}/parseSm.ts | 0 lib/{ => stepcharts}/stepcharts.d.ts | 0 lib/{ => stepcharts}/util.ts | 0 package.json | 1 + scripts/compileStepcharts.ts | 4 +- src/App.tsx | 7 ++++ src/constants.ts | 1 - src/globals.ts | 4 ++ src/importCharts.ts | 56 ++++++++++++++++++-------- src/pages/Charts.tsx | 60 +++++++++++++++++++++++++--- tsconfig.json | 4 +- 13 files changed, 112 insertions(+), 25 deletions(-) rename lib/{ => stepcharts}/parseDwi.ts (100%) rename lib/{ => stepcharts}/parseSimfile.ts (100%) rename lib/{ => stepcharts}/parseSm.ts (100%) rename lib/{ => stepcharts}/stepcharts.d.ts (100%) rename lib/{ => stepcharts}/util.ts (100%) delete mode 100644 src/constants.ts create mode 100644 src/globals.ts diff --git a/lib/parseDwi.ts b/lib/stepcharts/parseDwi.ts similarity index 100% rename from lib/parseDwi.ts rename to lib/stepcharts/parseDwi.ts diff --git a/lib/parseSimfile.ts b/lib/stepcharts/parseSimfile.ts similarity index 100% rename from lib/parseSimfile.ts rename to lib/stepcharts/parseSimfile.ts diff --git a/lib/parseSm.ts b/lib/stepcharts/parseSm.ts similarity index 100% rename from lib/parseSm.ts rename to lib/stepcharts/parseSm.ts diff --git a/lib/stepcharts.d.ts b/lib/stepcharts/stepcharts.d.ts similarity index 100% rename from lib/stepcharts.d.ts rename to lib/stepcharts/stepcharts.d.ts diff --git a/lib/util.ts b/lib/stepcharts/util.ts similarity index 100% rename from lib/util.ts rename to lib/stepcharts/util.ts diff --git a/package.json b/package.json index 9b41dd4..f45fc53 100644 --- a/package.json +++ b/package.json @@ -6,6 +6,7 @@ "scripts": { "dev": "vite", "build": "vite build", + "check": "tsc", "generate-pwa-assets": "pwa-assets-generator" }, "type": "module", diff --git a/scripts/compileStepcharts.ts b/scripts/compileStepcharts.ts index b3ea9a1..1f64d94 100644 --- a/scripts/compileStepcharts.ts +++ b/scripts/compileStepcharts.ts @@ -6,8 +6,8 @@ import { Readable } from "node:stream"; import * as ndjson from "ndjson"; import { readdir, writeFile, stat } from "node:fs/promises"; import { createWriteStream } from "node:fs"; -import { parseSm } from "../lib/parseSm"; -import { parseSimfile } from "../lib/parseSimfile"; +import { parseSm } from "../lib/stepcharts/parseSm"; +import { parseSimfile } from "../lib/stepcharts/parseSimfile"; const rootDir = process.env.STEPCHARTS_DIR ?? "/tmp/stepcharts"; const stepchartsDir = join(rootDir, "prodStepcharts"); diff --git a/src/App.tsx b/src/App.tsx index a5daf34..280350a 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -20,6 +20,7 @@ import Scores from "./pages/Scores"; import Settings from "./pages/Settings"; import ImportChartWorker from "./importCharts?worker"; import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; +import { CHART_STORE_CREATION_EVENT } from "./globals"; const queryClient = new QueryClient(); @@ -76,6 +77,12 @@ export function AppWrapper() { export default function App() { useEffect(() => { const worker = new ImportChartWorker(); + worker.onmessage = (evt) => { + console.log("got event from web worker", evt); + if (evt.kind === "chartStoreCreate") { + document.dispatchEvent(CHART_STORE_CREATION_EVENT); + } + }; }); return ( diff --git a/src/constants.ts b/src/constants.ts deleted file mode 100644 index 3a7a50c..0000000 --- a/src/constants.ts +++ /dev/null @@ -1 +0,0 @@ -export const APP_DATA_VERSION = 1; diff --git a/src/globals.ts b/src/globals.ts new file mode 100644 index 0000000..0ea8650 --- /dev/null +++ b/src/globals.ts @@ -0,0 +1,4 @@ +// export const APP_DATA_VERSION = 1; +export const APP_DATA_VERSION = + Math.floor(new Date().getTime() / 1000) % 1000000; +export const CHART_STORE_CREATION_EVENT = new Event("chartStoreCreate"); diff --git a/src/importCharts.ts b/src/importCharts.ts index c0589fb..0112125 100644 --- a/src/importCharts.ts +++ b/src/importCharts.ts @@ -1,5 +1,5 @@ import stepchartsUrl from "../data/stepData.ndjson?url"; -import { APP_DATA_VERSION } from "./constants"; +import { APP_DATA_VERSION, CHART_STORE_CREATION_EVENT } from "./globals"; import ndjsonStream from "can-ndjson-stream"; export async function importCharts() { @@ -7,6 +7,8 @@ export async function importCharts() { db: { result: db }, refetchCharts, } = await openDb(); + + console.log("refetch", refetchCharts); console.log("db", db); if (refetchCharts) { @@ -62,29 +64,51 @@ async function* iterStream(reader: ReadableStreamReader) { } } +function migrateToVersion1(db: IDBOpenDBRequest) { + try { + const store = db.result.createObjectStore("chartStore", { + // TODO: Try to use the Konami ID here + autoIncrement: true, + }); + store.createIndex("title", "title", { unique: false }); + store.createIndex("artist", "artist", { unique: false }); + store.createIndex("mode", "mode", { unique: false }); + console.log("created object store"); + self.postMessage({ kind: "chartStoreCreate" }); + } catch (e) {} +} + function openDb() { return new Promise((resolve) => { + console.log("opening db..."); const db = indexedDB.open("ddrDb", APP_DATA_VERSION); + let refetchCharts = false; - db.onupgradeneeded = (evt) => { - console.log("UPGRADE", evt.oldVersion, evt.newVersion); + db.addEventListener("error", (evt) => { + console.log("ERROR", evt); + }); + + db.addEventListener("blocked", (evt) => { + console.log("BLOCKED", evt); + }); + + db.addEventListener("upgradeneeded", (evt) => { + console.log("IDB need upgrade", evt.oldVersion, "to", evt.newVersion); refetchCharts = true; + migrateToVersion1(db); - { - const store = db.result.createObjectStore("chartStore", { - // TODO: Try to use the Konami ID here - autoIncrement: true, - }); - store.createIndex("title", "title", { unique: false }); - store.createIndex("artist", "artist", { unique: false }); - store.createIndex("mode", "mode", { unique: false }); - } - }; - db.onsuccess = () => { + console.log("done upgrading"); + }); + + db.addEventListener("success", (evt) => { + console.log("IDB success", db.result.version, evt); resolve({ db, refetchCharts }); - }; + }); }); } -await importCharts(); +addEventListener("message", (evt) => { + console.log("message!", evt); + importCharts(); +}); diff --git a/src/pages/Charts.tsx b/src/pages/Charts.tsx index 8ebe115..efe2db5 100644 --- a/src/pages/Charts.tsx +++ b/src/pages/Charts.tsx @@ -1,23 +1,73 @@ import { useQuery, useQueryClient } from "@tanstack/react-query"; -import { APP_DATA_VERSION } from "../constants"; +import { APP_DATA_VERSION, CHART_STORE_CREATION_EVENT } from "../globals"; + +function openDb(): Promise { + return new Promise((resolve) => { + const req = indexedDB.open("ddrDb", APP_DATA_VERSION); + req.onsuccess = (evt) => resolve(req); + }); +} + +async function openStore(): Promise { + const db = await openDb(); + const tx = db.result.transaction("chartStore", "readonly"); + return tx.objectStore("chartStore"); +} async function fetchCharts() { - const db = indexedDB.open("ddrDb", APP_DATA_VERSION); - return []; + let store = null; + try { + store = await openStore(); + } catch (e) { + console.log("could not open store", e.message); + } + + if (!store) { + await new Promise((resolve) => { + document.addEventListener("chartStoreCreate", (evt) => { + console.log("SHIET"); + resolve(); + }); + }); + + store = await openStore(); + } + + const entries = await new Promise((resolve) => { + const req = store.getAll(undefined, 100); + req.onsuccess = (evt) => resolve(req.result); + }); + console.log("entries", entries); + return entries; } export default function Charts() { - const queryClient = useQueryClient(); const fetchChartsQuery = useQuery({ queryKey: ["fetchCharts"], queryFn: fetchCharts, }); + let inner = undefined; + + if (fetchChartsQuery.isSuccess) { + inner = ( +
+ {fetchChartsQuery.data.map((chart) => ( + //
{JSON.stringify(Object.keys(chart))}
+
{JSON.stringify(chart.title)}
+ ))} +
+ ); + } + return ( <>

Charts

- {JSON.stringify(fetchChartsQuery)} + {fetchChartsQuery.status} + {fetchChartsQuery.error?.message} + + {inner} ); } diff --git a/tsconfig.json b/tsconfig.json index bc6c6f5..266ed6b 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -3,6 +3,8 @@ "jsx": "react-jsx", "module": "ESNext", "target": "ESNext", - "moduleResolution": "Node" + "moduleResolution": "Node", + "skipLibCheck": true, + "noEmit": true } }