From 8370c605b28191927df4e4b50ade829d2000f938 Mon Sep 17 00:00:00 2001
From: Mark Hall <mark.hall@work.room3b.eu>
Date: Mon, 16 Oct 2023 16:55:33 +0100
Subject: [PATCH] Worked on the FastAPI transition

---
 museum_map/models/__init__.py                 |  9 ++
 museum_map/server/__init__.py                 | 14 ++-
 museum_map/server/api/__init__.py             | 11 +++
 museum_map/server/frontend/src/App.svelte     | 88 ++++++++++++++++++-
 .../server/frontend/src/store/config.ts       |  8 +-
 museum_map/server/frontend/src/store/index.ts |  3 +-
 museum_map/server/frontend/vite.config.ts     |  1 +
 7 files changed, 130 insertions(+), 4 deletions(-)
 create mode 100644 museum_map/server/api/__init__.py

diff --git a/museum_map/models/__init__.py b/museum_map/models/__init__.py
index 7ca6020..78c7d8e 100644
--- a/museum_map/models/__init__.py
+++ b/museum_map/models/__init__.py
@@ -30,3 +30,12 @@ def create_sessionmaker(config) -> Callable[[], AsyncSession]:
     if async_sessionmaker is None:
         async_sessionmaker = sessionmaker(create_engine(config), expire_on_commit=False, class_=AsyncSession)
     return async_sessionmaker
+
+
+def db_session() -> None:
+    global async_sessionmaker
+    dbsession = async_sessionmaker()
+    try:
+        yield dbsession
+    finally:
+        dbsession.close()
diff --git a/museum_map/server/__init__.py b/museum_map/server/__init__.py
index a04663d..2a2752d 100644
--- a/museum_map/server/__init__.py
+++ b/museum_map/server/__init__.py
@@ -1,4 +1,16 @@
 from fastapi import FastAPI
+from fastapi.staticfiles import StaticFiles
+from fastapi.responses import RedirectResponse
 
+from museum_map.server import api
 
-app = FastAPI
+
+app = FastAPI()
+
+app.mount("/app", StaticFiles(packages=[("museum_map.server", "frontend/dist")], html=True), name="static")
+app.include_router(api.router)
+
+
+@app.get("/")
+def index() -> RedirectResponse:
+    return RedirectResponse('/app')
diff --git a/museum_map/server/api/__init__.py b/museum_map/server/api/__init__.py
new file mode 100644
index 0000000..1fc2f0f
--- /dev/null
+++ b/museum_map/server/api/__init__.py
@@ -0,0 +1,11 @@
+from fastapi import APIRouter
+
+from museum_map.__about__ import __version__
+
+
+router = APIRouter(prefix="/api")
+
+
+@router.get("/")
+def index() -> dict():
+    return {"ready": False, "version": __version__}
diff --git a/museum_map/server/frontend/src/App.svelte b/museum_map/server/frontend/src/App.svelte
index 194e881..250482d 100644
--- a/museum_map/server/frontend/src/App.svelte
+++ b/museum_map/server/frontend/src/App.svelte
@@ -6,7 +6,7 @@
   import Lobby from "./routes/Lobby.svelte";
   import Room from "./routes/Room.svelte";
   import TrackingConfig from "./components/TrackingConfig.svelte";
-  import { isBusy, isUpdatable } from "./store";
+  import { isBusy, isUpdatable, isReady } from "./store";
 
   import {
     fetchFloorTopics,
@@ -54,6 +54,92 @@
       </div>
     {/if}
 
+    {#if !$isReady}
+      <div
+        transition:fade
+        class="fixed left-1/2 top-1/2 transform -translate-x-1/2 -translate-y-1/2 z-50 p-4 bg-neutral-700 shadow-2xl rounded-2xl"
+        role="alert"
+      >
+        <span class="sr-only">Waiting for the application to become ready... Please wait...</span>
+          <svg
+            class="w-20 h-20 text-white stroke-current"
+            viewBox="0 0 45 45"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+          <g
+            fill="none"
+            fill-rule="evenodd"
+            transform="translate(1 1)"
+            stroke-width="2"
+          >
+            <circle cx="22" cy="22" r="6" stroke-opacity="0">
+              <animate
+                attributeName="r"
+                begin="1.5s"
+                dur="3s"
+                values="6;22"
+                calcMode="linear"
+                repeatCount="indefinite"
+              />
+              <animate
+                attributeName="stroke-opacity"
+                begin="1.5s"
+                dur="3s"
+                values="1;0"
+                calcMode="linear"
+                repeatCount="indefinite"
+              />
+              <animate
+                attributeName="stroke-width"
+                begin="1.5s"
+                dur="3s"
+                values="2;0"
+                calcMode="linear"
+                repeatCount="indefinite"
+              />
+            </circle>
+            <circle cx="22" cy="22" r="6" stroke-opacity="0">
+              <animate
+                attributeName="r"
+                begin="3s"
+                dur="3s"
+                values="6;22"
+                calcMode="linear"
+                repeatCount="indefinite"
+              />
+              <animate
+                attributeName="stroke-opacity"
+                begin="3s"
+                dur="3s"
+                values="1;0"
+                calcMode="linear"
+                repeatCount="indefinite"
+              />
+              <animate
+                attributeName="stroke-width"
+                begin="3s"
+                dur="3s"
+                values="2;0"
+                calcMode="linear"
+                repeatCount="indefinite"
+              />
+            </circle>
+            <circle cx="22" cy="22" r="8">
+              <animate
+                attributeName="r"
+                begin="0s"
+                dur="1.5s"
+                values="6;1;2;3;4;5;6"
+                calcMode="linear"
+                repeatCount="indefinite"
+              />
+            </circle>
+          </g>
+        </svg>
+      </div>
+
+    {/if}
+
     {#if $isBusy}
       <div
         transition:fade
diff --git a/museum_map/server/frontend/src/store/config.ts b/museum_map/server/frontend/src/store/config.ts
index 4786d2e..95da90c 100644
--- a/museum_map/server/frontend/src/store/config.ts
+++ b/museum_map/server/frontend/src/store/config.ts
@@ -2,7 +2,7 @@ import { writable, derived } from 'svelte/store';
 
 import { busyCounter } from './busy';
 
-export const status = writable(null as { version: string, ready: boolean });
+export const status = writable(null as { version: string, ready: boolean } | null);
 
 export async function fetchStatus() {
   busyCounter.start();
@@ -11,12 +11,18 @@ export async function fetchStatus() {
     if (response.status === 200) {
       const data = await response.json();
       status.set(data as { version: string, ready: boolean });
+    } else {
+      status.set(null);
     }
   } finally {
     busyCounter.stop();
   }
 }
 
+export const isReady = derived(status, (status) => {
+  return status !== null && status.ready;
+});
+
 export const isUpdatable = derived(status, (status) => {
   return status !== null && status.version !== '0.9.1';
 });
diff --git a/museum_map/server/frontend/src/store/index.ts b/museum_map/server/frontend/src/store/index.ts
index d401e82..b1f11fc 100644
--- a/museum_map/server/frontend/src/store/index.ts
+++ b/museum_map/server/frontend/src/store/index.ts
@@ -3,7 +3,7 @@ import { itemOfTheDay, fetchItemOfTheDay, randomItemsSelection, fetchRandomItems
 import { floorTopics, fetchFloorTopics, majorCollections, floors, fetchFloors } from './floors';
 import { cachedRooms, loadRooms } from './rooms';
 import { cachedItems, loadItems } from './items';
-import { config, fetchConfig, status, fetchStatus, isUpdatable } from './config';
+import { config, fetchConfig, status, fetchStatus, isUpdatable, isReady } from './config';
 import { cachedTopics, loadTopics } from './topics';
 import { localPreferences } from './preferences';
 import { searchTerm, searchRoom, matchingFloors, matchingRooms, matchingItems } from './search';
@@ -39,6 +39,7 @@ export {
     status,
     fetchStatus,
     isUpdatable,
+    isReady,
 
     localPreferences,
 
diff --git a/museum_map/server/frontend/vite.config.ts b/museum_map/server/frontend/vite.config.ts
index c70ab28..be69f46 100644
--- a/museum_map/server/frontend/vite.config.ts
+++ b/museum_map/server/frontend/vite.config.ts
@@ -5,6 +5,7 @@ import postcss from './postcss.config.cjs';
 // https://vitejs.dev/config/
 export default defineConfig({
   plugins: [svelte()],
+  base: "/app",
   css: {
     postcss,
   },