stuffs

src/components/screens/Loading.vue

@@ -17,63 +17,53 @@
 <script setup lang="ts" async>
 import config from '@/application/config'
 import type { HttpResponse, MapObject } from '@/application/types'
-import { MapObjectStorage } from '@/dexie/mapObjects'
-import { MapStorage } from '@/dexie/maps'
 // import type { Map } from '@/application/types'
-import type { Map } from '@/dexie/maps'
 import { useGameStore } from '@/stores/gameStore'
 import { ref } from 'vue'
+import type { BaseStorage } from '@/storage/baseStorage'
+import {
+  CharacterHairStorage,
+  CharacterTypeStorage,
+  MapObjectStorage,
+  MapStorage, SpriteStorage,
+  TileStorage
+} from '@/storage/storages'
 
 const gameStore = useGameStore()
 
-const mapStorage = new MapStorage()
-const mapObjectStorage = new MapObjectStorage()
-
 const totalItems = ref(0)
 const currentItem = ref(0)
 
-/**
- * Download map cache from the server and add them to the storage
- */
-async function downloadMaps() {
-  // Request to download maps
-  const request = await fetch(config.server_endpoint + '/cache/maps')
-  const response = (await request.json()) as HttpResponse<Map[]>
+async function downloadAndStore<T extends { id: string }>(
+  endpoint: string,
+  storage: BaseStorage<T>
+) {
+  const request = await fetch(`${config.server_endpoint}/cache/${endpoint}`)
+  const response = (await request.json()) as HttpResponse<T[]>
+
   if (!response.success) {
-    console.error('Failed to download maps:', response.message)
+    console.error(`Failed to download ${endpoint}:`, response.message)
     return
   }
 
-  const maps = response.data ?? ([] as Map[])
-
-  // Add maps to storage
-  for (const map of maps) {
-    await mapStorage.add(map)
+  const items = response.data ?? []
+  for (const item of items) {
+    await storage.add(item)
   }
 }
 
-/**
- * Download map objects cache from the server and add them to the storage
- */
-async function downloadMapObjects() {
-  // Request to download map objects
-  const request = await fetch(config.server_endpoint + '/cache/map_objects')
-  const response = (await request.json()) as HttpResponse<MapObject[]>
-  if (!response.success) {
-    console.error('Failed to download map objects:', response.message)
-    return
-  }
+const tileStorage = new TileStorage()
+const mapStorage = new MapStorage()
+const mapObjectStorage = new MapObjectStorage()
 
-  const mapObjects = response.data ?? ([] as MapObject[])
-
-  // Add map objects to storage
-  for (const mapObject of mapObjects) {
-    await mapObjectStorage.add(mapObject)
-  }
-}
-
-Promise.all([downloadMaps(), downloadMapObjects()]).then(() => {
-  // Set isLoaded to true
+Promise.all([
+  downloadAndStore('tiles', tileStorage),
+  downloadAndStore('maps', mapStorage),
+  downloadAndStore('map_objects', mapObjectStorage),
+  downloadAndStore('sprites', new SpriteStorage()),
+  downloadAndStore('character_types', new CharacterTypeStorage()),
+  downloadAndStore('character_hair', new CharacterHairStorage())
+]).then(() => {
   gameStore.game.isLoaded = true
 })
 </script>