[FEAT] Auth. and user projects

src/composables/useExportLayers.ts

@@ -106,13 +106,7 @@ export const useExportLayers = (layersRef: Ref<Layer[]>, columns: Ref<number>, n
     link.click();
   };
 
-  const exportSpritesheetJSON = async () => {
-    const visibleLayers = getVisibleLayers();
-    if (!visibleLayers.length || !visibleLayers.some(l => l.sprites.length)) {
-      alert('Nothing to export. Please add sprites first.');
-      return;
-    }
-
+  const generateProjectJSON = async () => {
     const layersData = await Promise.all(
       layersRef.value.map(async layer => {
         const sprites = await Promise.all(
@@ -131,7 +125,7 @@ export const useExportLayers = (layersRef: Ref<Layer[]>, columns: Ref<number>, n
       })
     );
 
-    const json = {
+    return {
       version: 2,
       columns: columns.value,
       negativeSpacingEnabled: negativeSpacingEnabled.value,
@@ -141,6 +135,16 @@ export const useExportLayers = (layersRef: Ref<Layer[]>, columns: Ref<number>, n
       manualCellHeight: manualCellHeight?.value || 64,
       layers: layersData,
     };
+  };
+
+  const exportSpritesheetJSON = async () => {
+    const visibleLayers = getVisibleLayers();
+    if (!visibleLayers.length || !visibleLayers.some(l => l.sprites.length)) {
+      alert('Nothing to export. Please add sprites first.');
+      return;
+    }
+
+    const json = await generateProjectJSON();
     const jsonString = JSON.stringify(json, null, 2);
     const blob = new Blob([jsonString], { type: 'application/json' });
     const url = URL.createObjectURL(blob);
@@ -151,10 +155,7 @@ export const useExportLayers = (layersRef: Ref<Layer[]>, columns: Ref<number>, n
     URL.revokeObjectURL(url);
   };
 
-  const importSpritesheetJSON = async (jsonFile: File) => {
-    const text = await jsonFile.text();
-    const data = JSON.parse(text);
-
+  const loadProjectData = async (data: any) => {
     const loadSprite = (spriteData: any) =>
       new Promise<Sprite>(resolve => {
         const img = new Image();
@@ -217,6 +218,12 @@ export const useExportLayers = (layersRef: Ref<Layer[]>, columns: Ref<number>, n
     throw new Error('Invalid JSON format');
   };
 
+  const importSpritesheetJSON = async (jsonFile: File) => {
+    const text = await jsonFile.text();
+    const data = JSON.parse(text);
+    await loadProjectData(data);
+  };
+
   const downloadAsGif = (fps: number) => {
     const visibleLayers = getVisibleLayers();
     if (!visibleLayers.length || !visibleLayers.some(l => l.sprites.length)) {
@@ -314,5 +321,5 @@ export const useExportLayers = (layersRef: Ref<Layer[]>, columns: Ref<number>, n
     URL.revokeObjectURL(url);
   };
 
-  return { downloadSpritesheet, exportSpritesheetJSON, importSpritesheetJSON, downloadAsGif, downloadAsZip };
+  return { downloadSpritesheet, exportSpritesheetJSON, importSpritesheetJSON, downloadAsGif, downloadAsZip, generateProjectJSON, loadProjectData };
 };

src/composables/useShare.ts

@@ -1,7 +1,7 @@
 import type { Ref } from 'vue';
 import type { Layer } from '@/types/sprites';
 
-const POCKETBASE_URL = 'https://pb1.adhd.sh';
+const POCKETBASE_URL = import.meta.env.VITE_POCKETBASE_URL;
 const COLLECTION = 'spritesheets';
 
 export interface SpritesheetConfig {