potato

package-lock.json

@@ -11,6 +11,7 @@
         "@primeuix/themes": "^2.0.3",
         "@primevue/forms": "^4.5.5",
         "axios": "^1.13.6",
+        "axios-retry": "^4.5.0",
         "primeflex": "^4.0.0",
         "primeicons": "^7.0.0",
         "primevue": "^4.5.4",
@@ -2771,6 +2772,18 @@
         "proxy-from-env": "^2.1.0"
       }
     },
+    "node_modules/axios-retry": {
+      "version": "4.5.0",
+      "resolved": "https://registry.npmjs.org/axios-retry/-/axios-retry-4.5.0.tgz",
+      "integrity": "sha512-aR99oXhpEDGo0UuAlYcn2iGRds30k366Zfa05XWScR9QaQD4JYiP3/1Qt1u7YlefUOK+cn0CcwoL1oefavQUlQ==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "is-retry-allowed": "^2.2.0"
+      },
+      "peerDependencies": {
+        "axios": "0.x || 1.x"
+      }
+    },
     "node_modules/balanced-match": {
       "version": "4.0.4",
       "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-4.0.4.tgz",
@@ -3876,6 +3889,18 @@
         "node": ">=0.12.0"
       }
     },
+    "node_modules/is-retry-allowed": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/is-retry-allowed/-/is-retry-allowed-2.2.0.tgz",
+      "integrity": "sha512-XVm7LOeLpTW4jV19QSH38vkswxoLud8sQ57YwJVTPWdiaI9I8keEhGFpBlslyVsgdQy4Opg8QOLb8YRgsyZiQg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/is-wsl": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/is-wsl/-/is-wsl-3.1.1.tgz",

package.json

@@ -18,6 +18,7 @@
     "@primeuix/themes": "^2.0.3",
     "@primevue/forms": "^4.5.5",
     "axios": "^1.13.6",
+    "axios-retry": "^4.5.0",
     "primeflex": "^4.0.0",
     "primeicons": "^7.0.0",
     "primevue": "^4.5.4",

src/Router.vue

@@ -40,12 +40,12 @@ onMounted(() => {
 })
 
 function tableLink() {
-  if (selectedTableRef.value.table_link == "None") {
+  if (!selectedTableRef.value) {
     linkVisible.value = false
     return ""
   }
   linkVisible.value = true
-  return 'http://' + selectedTableRef.value.table_link + '.' + hostname.value
+  return 'http://' + hostname.value + "/" + selectedTableRef.value.table_link
 }
 
 function displayUsername(): string {

src/TableEditor.vue

@@ -21,17 +21,17 @@
       </template>
       <template #footer>
         <div>
-          <Button class="button-box" label="Start" @click="startTable(activeTable)" />
+          <Button class="button-box" label="Start" @click="startTable(activeTable!)" />
-          <Button class="button-box" label="Stop" @click="stopTable(activeTable)" />
+          <Button class="button-box" label="Stop" @click="stopTable(activeTable!)" />
         </div>
         <div>
-          <Button class="button-box" label="Hard Start" @click="hardStartTable(activeTable)" />
+          <Button class="button-box" label="Hard Start" @click="hardStartTable(activeTable!)" />
           <Button class="button-box" label="Delete" @click="protectedDelete()" />
         </div>
       </template>
     </Card>
 
-    <Form :key="forceReset" ref="edit-form" :initialValues="activeTable" @submit="save">
+    <Form :key="forceReset" ref="edit-form" :initialValues="activeTable!" @submit="save">
       <Card class="detailCard flex">
         <template #title> Edit Details </template>
         <template #content>
@@ -123,7 +123,7 @@ const table = reactive({
   version: 0,
 })
 
-const activeTable: Ref<GameTable> = useSelectedTable()
+const activeTable: Ref<GameTable | null> = useSelectedTable()
 const forceReset = ref(0)
 
 const foundryStatus = reactive({
@@ -171,7 +171,7 @@ function readTable() {
 }
 
 function readFoundryStatus() {
-  if (table.active) {
+  if (activeTable.value) {
     axios.get(`http://${activeTable.value.table_link}.${hostname.value}/api/status`).then((resp) => {
       if (resp.status == 200) {
         foundryStatus.running = resp.data.version
@@ -192,15 +192,17 @@ watch(activeTable, () => {
 })
 
 function protectedDelete() {
+  if (activeTable.value) {
     confirm.require({
       header: `Delete ${table.table_name}?`,
       message: "This will delete the table and all of it's data",
       accept: () => {
-      deleteTable(activeTable.value)
+        deleteTable(activeTable.value!)
         router.push('/')
       },
     })
   }
+}
 
 function loadTable() {
   axios
@@ -219,7 +221,7 @@ function loadTable() {
 }
 
 function save(form: any) {
-  console.log(form)
+  if (activeTable.value) {
     updateTable(activeTable.value.id, {
       id: activeTable.value.id,
       table_name: form.values.table_name,
@@ -229,6 +231,7 @@ function save(form: any) {
       user_id: activeTable.value.user_id
     })
   }
+}
 
 function isTableLoading() {
   return table.active && !foundryStatus.running

src/TableList.vue

@@ -8,11 +8,11 @@
 
     <Column field="table_link" header="Table Link">
       <template #body="slotProps">
-        <a v-if="slotProps.data.active" :href="'http://' + slotProps.data.table_link + '.' + hostname">
+        <a v-if="slotProps.data.active" :href="'http://' + hostname + '/' + slotProps.data.table_link"">
-          http://{{ slotProps.data.table_link }}.{{ hostname }}/
+          http://{{ hostname }}/{{ slotProps.data.table_link }}
         </a>
         <div v-if="!slotProps.data.active">
-          http://{{ slotProps.data.table_link }}.{{ hostname }}/
+          http://{{ hostname }}/{{ slotProps.data.table_link }}
           </div>
       </template>
     </Column>

src/game_tables.ts

@@ -11,7 +11,7 @@ export interface GameTable {
   user_id: number
 }
 
-let $selectedTable: Ref<GameTable> | undefined
+let $selectedTable: Ref<GameTable | null> | undefined
 let $activeTables: Ref<Array<GameTable>> | undefined
 let $allTables: Ref<Array<GameTable>> | undefined
 
@@ -27,16 +27,9 @@ export function useAllTables(): Ref<Array<GameTable>> {
   return $allTables
 }
 
-export function useSelectedTable(): Ref<GameTable> {
+export function useSelectedTable(): Ref<GameTable | null> {
   if (!$selectedTable)
-    $selectedTable = ref({
+    $selectedTable = ref(null)
-      id: 0,
-      table_name: 'None',
-      table_link: 'None',
-      active: false,
-      version: 0,
-      user_id: 0,
-    })
   return $selectedTable
 }
 
@@ -50,7 +43,7 @@ export function loadAllTables(): void {
 }
 
 export function loadSelectedTable(tableId: number = 0): void {
-  if ($selectedTable) {
+  if ($selectedTable && $selectedTable.value) {
     let id = tableId || $selectedTable.value.id
     axios.get(`/api/tables/${id}`).then((resp) => ($selectedTable!.value = resp.data))
   }
@@ -69,12 +62,23 @@ export function clearSelectedTable(): void {
   }
 }
 
-export function startTable(gameTable: GameTable): void {
+export async function startTable(gameTable: GameTable): Promise<void> {
-  axios
+  await axios
     .post(`/api/tables/${gameTable.id}:start`, { hard: 'False' })
     .then(() => loadAllTables())
     .then(() => loadActiveTables())
     .then(() => loadSelectedTable())
+
+  for (let retries = 0; retries < 10; retries++) {
+    try {
+      await axios.get(`http://${location.hostname}/${gameTable.table_link}`)
+      console.log('loaded')
+      return
+    } catch {
+      await new Promise(f => setTimeout(f, 1000))
+    }
+  }
+
 }
 
 export function hardStartTable(gameTable: GameTable): void {
@@ -93,7 +97,7 @@ export function stopTable(gameTable: GameTable): void {
     .then(() => loadSelectedTable())
 }
 
-export function createTable(): Promise<number> {
+export async function createTable(): Promise<number> {
   return axios.post(`/api/tables`, {}).then((resp) => resp.data.id)
 }