POC working new caching method - moved controllers folder, renamed assets to textures, fixed HTTP bug, formatted code

package.json

@@ -51,7 +51,6 @@
     "typescript": "~5.6.2",
     "vite": "^5.4.9",
     "vite-plugin-compression": "^0.5.1",
-    "vite-plugin-vue-devtools": "^7.5.2",
     "vitest": "^2.0.3",
     "vue-tsc": "^1.6.5"
   }

src/components/screens/Game.vue

@@ -33,6 +33,7 @@ import Menu from '@/components/gui/Menu.vue'
 import { useGameStore } from '@/stores/gameStore'
 import AwaitLoaderPlugin from 'phaser3-rex-plugins/plugins/awaitloader-plugin'
 import { Game, Scene } from 'phavuer'
+import { onBeforeUnmount } from 'vue'
 
 const gameStore = useGameStore()
 
@@ -80,4 +81,8 @@ function preloadScene(scene: Phaser.Scene) {
 }
 
 function createScene(scene: Phaser.Scene) {}
+
+onBeforeUnmount(() => {
+
+})
 </script>

src/composables/gameComposable.ts

@@ -1,4 +1,4 @@
-import { Assets } from '@/application/assets'
+import { Assets } from '@/dexie/assets'
 import config from '@/application/config'
 import type { AssetDataT, HttpResponse, Sprite, SpriteAction } from '@/application/types'
 import { useGameStore } from '@/stores/gameStore'

src/dexie/mapObjects.ts

@@ -0,0 +1,111 @@
+import Dexie from 'dexie'
+import type { UUID } from '@/application/types'
+// import type { Map } from '@/application/types'
+
+export type Map = {
+  id: UUID; // or string, depending on your ID type
+  name: string;
+  width: number;
+  height: number;
+  tiles: any[]; // You might want to be more specific about the tiles type
+  pvp: boolean;
+  updatedAt: Date;
+  placedMapObjects: {
+    id: UUID; // or string
+    mapObject: UUID; // or string
+    depth: number;
+    isRotated: boolean;
+    positionX: number;
+    positionY: number;
+  }[];
+  mapEffects: {
+    effect: string; // or specific enum/type if available
+    strength: number;
+  }[];
+};
+
+export class MapStorage {
+  private dexie: Dexie
+
+  constructor() {
+    this.dexie = new Dexie('maps')
+    this.dexie.version(1).stores({
+      maps: 'id, name, createdAt, updatedAt'
+    })
+  }
+
+  async add(map: Map, overwrite = false) {
+    try {
+      // Check if map already exists, don't add if it does and overwrite is false
+      const existingMap = await this.get(map.id)
+      if (existingMap && !overwrite) return
+
+      await this.dexie.table('maps').put({
+        ...map
+      })
+    } catch (error) {
+      console.error(`Failed to add map ${map.id}:`, error)
+    }
+  }
+
+  async get(id: string): Promise<Map | null> {
+    try {
+      const map = await this.dexie.table('maps').get(id)
+      return map || null
+    } catch (error) {
+      console.error(`Failed to retrieve map ${id}:`, error)
+      return null
+    }
+  }
+
+  async getAll(): Promise<Map[]> {
+    try {
+      return await this.dexie.table('maps').toArray()
+    } catch (error) {
+      console.error('Failed to retrieve all maps:', error)
+      return []
+    }
+  }
+
+  async getByName(name: string): Promise<Map[]> {
+    try {
+      return await this.dexie.table('maps').where('name').equals(name).toArray()
+    } catch (error) {
+      console.error(`Failed to retrieve maps with name ${name}:`, error)
+      return []
+    }
+  }
+
+  async delete(id: string) {
+    try {
+      await this.dexie.table('maps').delete(id)
+    } catch (error) {
+      console.error(`Failed to delete map ${id}:`, error)
+    }
+  }
+
+  async clear() {
+    try {
+      await this.dexie.table('maps').clear()
+    } catch (error) {
+      console.error('Failed to clear maps storage:', error)
+    }
+  }
+
+  async update(id: string, updates: Partial<Map>) {
+    try {
+      const map = await this.get(id)
+      if (!map) return false
+
+      const updatedMap = {
+        ...map,
+        ...updates
+      }
+      await this.add(updatedMap)
+      return true
+    } catch (error) {
+      console.error(`Failed to update map ${id}:`, error)
+      return false
+    }
+  }
+}

src/dexie/maps.ts

@@ -0,0 +1,85 @@
+import Dexie from 'dexie'
+import { Map } from '@/application/types'
+
+export class MapStorage {
+  private dexie: Dexie
+
+  constructor() {
+    this.dexie = new Dexie('maps')
+    this.dexie.version(1).stores({
+      maps: 'id, name, createdAt, updatedAt'
+    })
+  }
+
+  async add(map: Map) {
+    try {
+      await this.dexie.table('maps').put({
+        ...map
+      })
+    } catch (error) {
+      console.error(`Failed to add map ${map.id}:`, error)
+    }
+  }
+
+  async get(id: string): Promise<Map | null> {
+    try {
+      const map = await this.dexie.table('maps').get(id)
+      return map || null
+    } catch (error) {
+      console.error(`Failed to retrieve map ${id}:`, error)
+      return null
+    }
+  }
+
+  async getAll(): Promise<Map[]> {
+    try {
+      return await this.dexie.table('maps').toArray()
+    } catch (error) {
+      console.error('Failed to retrieve all maps:', error)
+      return []
+    }
+  }
+
+  async getByName(name: string): Promise<Map[]> {
+    try {
+      return await this.dexie.table('maps').where('name').equals(name).toArray()
+    } catch (error) {
+      console.error(`Failed to retrieve maps with name ${name}:`, error)
+      return []
+    }
+  }
+
+  async delete(id: string) {
+    try {
+      await this.dexie.table('maps').delete(id)
+    } catch (error) {
+      console.error(`Failed to delete map ${id}:`, error)
+    }
+  }
+
+  async clear() {
+    try {
+      await this.dexie.table('maps').clear()
+    } catch (error) {
+      console.error('Failed to clear maps storage:', error)
+    }
+  }
+
+  async update(id: string, updates: Partial<Map>) {
+    try {
+      const map = await this.get(id)
+      if (map) {
+        const updatedMap = {
+          ...map,
+          ...updates
+        }
+        await this.add(updatedMap)
+        return true
+      }
+      return false
+    } catch (error) {
+      console.error(`Failed to update map ${id}:`, error)
+      return false
+    }
+  }
+}

src/dexie/textures.ts

@@ -3,11 +3,11 @@ import type { AssetDataT } from '@/application/types'
 import Dexie from 'dexie'
 
 export class Assets {
-  private db: Dexie
+  private dexie: Dexie
 
   constructor() {
-    this.db = new Dexie('assets')
-    this.db.version(1).stores({
+    this.dexie = new Dexie('assets')
+    this.dexie.version(1).stores({
       assets: 'key, group'
     })
   }
@@ -15,7 +15,7 @@ export class Assets {
   async download(asset: AssetDataT) {
     try {
       // Check if the asset already exists, then check if updatedAt is newer
-      const _asset = await this.db.table('assets').get(asset.key)
+      const _asset = await this.dexie.table('assets').get(asset.key)
       if (_asset && _asset.updatedAt > asset.updatedAt) {
         return
       }
@@ -25,7 +25,7 @@ export class Assets {
       const blob = await response.blob()
 
       // Store the asset in the database
-      await this.db.table('assets').put({
+      await this.dexie.table('assets').put({
         key: asset.key,
         data: blob,
         group: asset.group,
@@ -45,7 +45,7 @@ export class Assets {
 
   async get(key: string) {
     try {
-      const asset = await this.db.table('assets').get(key)
+      const asset = await this.dexie.table('assets').get(key)
       if (asset) {
         return {
           ...asset,
@@ -60,7 +60,7 @@ export class Assets {
 
   async getByGroup(group: string) {
     try {
-      const assets = await this.db.table('assets').where('group').equals(group).toArray()
+      const assets = await this.dexie.table('assets').where('group').equals(group).toArray()
       return assets.map((asset) => ({
         ...asset,
         data: URL.createObjectURL(asset.data) // Convert blob to data URL
@@ -73,7 +73,7 @@ export class Assets {
 
   async delete(key: string) {
     try {
-      await this.db.table('assets').delete(key)
+      await this.dexie.table('assets').delete(key)
     } catch (error) {
       console.error(`Failed to delete asset ${key}:`, error)
     }

vite.config.js

@@ -8,7 +8,6 @@ import viteCompression from 'vite-plugin-compression'
 export default defineConfig({
     plugins: [
         vue(),
-        // VueDevTools(),
         viteCompression()
     ],
     resolve: {

vite.config.ts

@@ -8,7 +8,6 @@ import viteCompression from 'vite-plugin-compression';
 export default defineConfig({
   plugins: [
     vue(),
-    // VueDevTools(),
     viteCompression()
   ],
   resolve: {