Merge branch 'goplus:dev' into spx-stage-viewer

spx-gui/src/api/project.ts

@@ -1,8 +1,8 @@
 import type { Project } from "@/interface/library";
-import { service,ResponseData } from "@/axios";
-import { FormatResponse } from "@/components/code-editor";
-import {Project} from "@/interface/library.ts";
-import { AxiosResponse } from "axios";
+import { service } from "@/axios"
+import type { ResponseData } from "@/axios";
+import type { FormatResponse } from "@/components/code-editor";
+import type { AxiosResponse } from "axios";
 
 /**
  * Saves a project.

spx-gui/src/class/AssetBase.ts → spx-gui/src/class/asset-base.ts

@@ -3,10 +3,10 @@
  * @Date: 2024-01-22 10:28:03
  * @LastEditors: TuGitee [email protected]
  * @LastEditTime: 2024-01-25 15:03:08
- * @FilePath: \builder\spx-gui\src\class\AssetBase.ts
+ * @FilePath: \builder\spx-gui\src\class\asset-base.ts
  * @Description: The abstract class of an asset.
  */
-import type file from "@/interface/file";
+import type { AssetBaseInterface } from "@/interface/file";
 import { getStorage } from "@/util/class";
 import FileWithUrl from "@/class/FileWithUrl";
 import { isObjectEmpty } from "@/util/global";
@@ -19,7 +19,7 @@ import type { Config } from '@/interface/file';
  * @author tgb
  * @createDate 2024-01-18
  */
-export default abstract class AssetBase implements file {
+export abstract class AssetBase implements AssetBaseInterface {
     protected _files: FileWithUrl[];
     public name: string;
     public abstract config: Config;

spx-gui/src/class/AssetList.ts → spx-gui/src/class/asset-list.ts

@@ -1,6 +1,6 @@
-import AssetBase from "./AssetBase";
-import Sound from "./sound";
-import Sprite from "./sprite";
+import { AssetBase } from "./asset-base";
+import { Sound } from "./sound";
+import { Sprite } from "./sprite";
 
 export abstract class AssetList<T extends AssetBase> {
     public list: T[] = [];

spx-gui/src/class/backdrop.ts

@@ -1,15 +1,16 @@
 /*
  * @Author: TuGitee [email protected]
  * @Date: 2024-01-19 21:53:50
- * @LastEditors: TuGitee [email protected]
- * @LastEditTime: 2024-01-25 14:15:02
- * @FilePath: \builder\spx-gui\src\class\backdrop.ts
+ * @LastEditors: Zhang Zhi Yang
+ * @LastEditTime: 2024-02-04 16:41:48
+ * @FilePath: /spx-gui/src/class/backdrop.ts
  * @Description: The class of a backdrop.
  */
 import type { BackdropConfig, Scene } from "@/interface/file";
-import AssetBase from "./AssetBase";
+import { AssetBase } from "./asset-base";
 import { isInstance, getAllFromLocal } from "@/util/class";
-import { rawFile } from "@/types/file";
+import type { RawDir } from "@/types/file";
+import { useProjectStore } from "@/store/modules/project";
 
 /**
  * @class Backdrop
@@ -46,7 +47,7 @@ import { rawFile } from "@/types/file";
  * backdrop.config = backdrop.genDefualtConfig()
  */
 
-export default class Backdrop extends AssetBase implements file {
+export class Backdrop extends AssetBase {
     /**
      * The root path of the backdrop.
      */
@@ -80,7 +81,6 @@ export default class Backdrop extends AssetBase implements file {
      * @returns all items in the storage
      */
     static async getAllFromLocal() {
-        // @ts-ignore
         return await getAllFromLocal(Backdrop);
     }
 
@@ -121,7 +121,7 @@ export default class Backdrop extends AssetBase implements file {
                 "name": file.name.split(".")[0],
                 "path": file.name
             })),
-            "zorder": [],
+            "zorder": useProjectStore().project?.sprite.list.map(sprite => sprite.name) || [],
             "sceneIndex": 0
         }
     }
@@ -166,7 +166,7 @@ export default class Backdrop extends AssetBase implements file {
      * Get the directory of the backdrop.
      */
     get dir() {
-        const dir: Record<string, rawFile> = {}
+        const dir: RawDir = {}
         dir[`${this.path}index.json`] = this.config
         for (const file of this.files) {
             dir[`${this.path}${file.name}`] = file

spx-gui/src/class/sound.ts

@@ -6,10 +6,9 @@
  * @FilePath: \builder\spx-gui\src\class\sound.ts
  * @Description: The class of a sound.
  */
-import type file from "@/interface/file";
-import AssetBase from "./AssetBase";
+import { AssetBase } from "./asset-base";
 import { isInstance, getAllFromLocal } from "@/util/class";
-import type { rawFile } from "@/types/file";
+import type { RawDir } from "@/types/file";
 import type { SoundConfig } from '@/interface/file';
 
 /**
@@ -51,7 +50,7 @@ import type { SoundConfig } from '@/interface/file';
  * snd1.config = snd1.genDefualtConfig()
  */
 
-export default class Sound extends AssetBase implements file {
+export class Sound extends AssetBase {
     /**
      * The root path of the sounds.
      */
@@ -129,7 +128,7 @@ export default class Sound extends AssetBase implements file {
      * Get the directory of the sound.
      */
     get dir() {
-        const dir: Record<string, rawFile> = {}
+        const dir: RawDir = {}
         dir[`${this.path}/index.json`] = this.config
         for (const file of this.files) {
             dir[`${this.path}/${file.name}`] = file

spx-gui/src/class/sprite.ts

@@ -7,11 +7,10 @@
  * @Description: The class of a sprite.
  */
 
-import type file from "@/interface/file";
 import type { Costume, SpriteConfig } from "@/interface/file";
-import AssetBase from "./AssetBase";
+import { AssetBase } from "./asset-base";
 import { isInstance, getAllFromLocal } from "@/util/class";
-import type { rawFile } from "@/types/file";
+import type { RawDir } from "@/types/file";
 
 /**
  * @class Sprite
@@ -58,7 +57,7 @@ import type { rawFile } from "@/types/file";
  * spt1.config = spt1.genDefualtConfig()
  */
 
-export default class Sprite extends AssetBase implements file {
+export class Sprite extends AssetBase {
     /**
      * The root path of the sprites.
      */
@@ -97,7 +96,6 @@ export default class Sprite extends AssetBase implements file {
      * @returns all items in the storage
      */
     static async getAllFromLocal() {
-        // @ts-ignore
         return await getAllFromLocal(Sprite);
     }
 
@@ -265,7 +263,7 @@ export default class Sprite extends AssetBase implements file {
      * Get the directory of the sprite.
      */
     get dir() {
-        const dir: Record<string, rawFile> = {}
+        const dir: RawDir = {}
         dir[`${this.path}/index.json`] = this.config
         for (const file of this.files) {
             dir[`${this.path}/${file.name}`] = file

spx-gui/src/components/code-editor/snippet.ts

@@ -1,4 +1,5 @@
-import { monaco, Snippet } from "./index";
+import { monaco } from "./index"
+import type { Snippet } from "./index";
 // motion snippet
 export const stepSnippet: Snippet = {
     label: "step",

spx-gui/src/interface/file.ts

@@ -8,15 +8,15 @@
  */
 
 import FileWithUrl from "@/class/FileWithUrl";
-import type { rawFile } from "@/types/file";
+import type { RawDir } from "@/types/file";
 
 /**
  * file interface
  */
-export default interface file {
+export interface AssetBaseInterface {
     files: FileWithUrl[];
     config: Config;
-    dir?: Record<string, rawFile>;
+    dir?: RawDir;
     path?: string;
 
     /**

spx-gui/src/store/modules/project/index.ts

@@ -1,20 +1,20 @@
 /*
  * @Author: TuGitee [email protected]
  * @Date: 2024-01-22 11:26:18
- * @LastEditors: TuGitee [email protected]
- * @LastEditTime: 2024-01-25 11:47:33
- * @FilePath: \builder\spx-gui\src\store\modules\project\index.ts
+ * @LastEditors: Zhang Zhi Yang
+ * @LastEditTime: 2024-02-04 16:46:21
+ * @FilePath: /spx-gui/src/store/modules/project/index.ts
  * @Description: The store of project.
  */
 
 import { ref, watch } from 'vue'
 import { defineStore } from 'pinia'
-import * as fs from '@/util/FileSystem'
-import { FileType, dirPath, rawDir } from "@/types/file";
+import * as fs from '@/util/file-system'
+import type { FileType, DirPath, RawDir } from "@/types/file";
 import { convertDirPathToProject, convertRawDirToDirPath, convertRawDirToZip, getDirPathFromZip } from "@/util/file";
 import saveAs from "file-saver";
-import { SoundList, SpriteList } from "@/class/AssetList";
-import Backdrop from '@/class/backdrop';
+import { SoundList, SpriteList } from "@/class/asset-list";
+import { Backdrop } from '@/class/backdrop';
 
 const UNTITLED_NAME = 'Untitled'
 interface ProjectData {
@@ -23,7 +23,7 @@ interface ProjectData {
     sound: SoundList
     backdrop: Backdrop
     entryCode: string
-    UnidentifiedFile: rawDir
+    UnidentifiedFile: RawDir
 }
 
 export class Project implements ProjectData {
@@ -32,15 +32,15 @@ export class Project implements ProjectData {
     sound: SoundList;
     backdrop: Backdrop;
     entryCode: string;
-    UnidentifiedFile: rawDir;
+    UnidentifiedFile: RawDir;
 
     static ENTRY_FILE_NAME = 'index.gmx'
 
     static fromRawData(data: ProjectData): Project {
         return new Project(data.title, data.sprite, data.sound, data.backdrop, data.entryCode, data.UnidentifiedFile)
     }
 
-    constructor(title: string, sprite: SpriteList = new SpriteList(), sound: SoundList = new SoundList(), backdrop: Backdrop = new Backdrop(), entryCode: string = "", UnidentifiedFile: rawDir = {}) {
+    constructor(title: string, sprite: SpriteList = new SpriteList(), sound: SoundList = new SoundList(), backdrop: Backdrop = new Backdrop(), entryCode: string = "", UnidentifiedFile: RawDir = {}) {
         this.title = title
         this.sprite = sprite
         this.sound = sound
@@ -66,7 +66,7 @@ export class Project implements ProjectData {
     async load(arg: string | File, title?: string): Promise<void> {
         if (typeof arg === 'string') {
             const paths = await fs.readdir(arg) as string[]
-            const dirPath: dirPath = {}
+            const dirPath: DirPath = {}
             for (const path of paths) {
                 const content = await fs.readFile(path) as FileType
                 dirPath[path] = content
@@ -80,17 +80,17 @@ export class Project implements ProjectData {
 
     /**
      * Load project from directory.
-     * @param dirPath The directory
+     * @param DirPath The directory
      */
-    private _load(dirPath: dirPath): void;
+    private _load(dirPath: DirPath): void;
 
     /**
      * Load project.
      * @param proj The project
      */
     private _load(proj: Project): void;
 
-    private _load(arg: dirPath | Project): void {
+    private _load(arg: DirPath | Project): void {
         if (typeof arg === 'object' && arg instanceof Project) {
             this.title = arg.title
             this.sprite = arg.sprite
@@ -126,8 +126,8 @@ export class Project implements ProjectData {
     }
 
     get rawDir() {
-        const dir: rawDir = {}
-        const files: rawDir = Object.assign({}, this.UnidentifiedFile, ...[this.backdrop, ...this.sprite.list, ...this.sound.list].map(item => item.dir))
+        const dir: RawDir = {}
+        const files: RawDir = Object.assign({}, this.UnidentifiedFile, ...[this.backdrop, ...this.sprite.list, ...this.sound.list].map(item => item.dir))
         files[Project.ENTRY_FILE_NAME] = this.entryCode
         for (const [path, value] of Object.entries(files)) {
             const fullPath = this.path + path
@@ -136,7 +136,7 @@ export class Project implements ProjectData {
         return dir
     }
 
-    get dirPath(): Promise<dirPath> {
+    get dirPath(): Promise<DirPath> {
         return convertRawDirToDirPath(this.rawDir)
     }
 }

spx-gui/src/types/file.ts

@@ -1,30 +1,13 @@
 /*
  * @Author: TuGitee [email protected]
  * @Date: 2024-01-19 21:53:50
- * @LastEditors: TuGitee [email protected]
- * @LastEditTime: 2024-01-24 08:53:12
- * @FilePath: \builder\spx-gui\src\types\file.ts
+ * @LastEditors: Zhang Zhi Yang
+ * @LastEditTime: 2024-02-04 16:44:29
+ * @FilePath: /spx-gui/src/types/file.ts
  * @Description: The type of file.
  */
 
-import Sprite from "@/class/sprite"
-import Sound from "@/class/sound"
-import Backdrop from "@/class/backdrop"
-import { Config } from "@/interface/file"
-
-export type codeType = {
-    path: string,
-    content: string
-}
-
-export interface projectType {
-    title: string,
-    sprites: Sprite[],
-    sounds: Sound[],
-    backdrop: Backdrop,
-    defaultDir: dirPath,
-    code: codeType
-}
+import type { Config } from "@/interface/file"
 
 export interface FileType {
     content: ArrayBuffer,
@@ -34,16 +17,12 @@ export interface FileType {
     modifyTime: Date
 }
 
-export interface dirPath {
+export interface DirPath {
     [path: string]: FileType
 }
 
-export type rawFile = string | File | Config
-
-export interface rawDir {
-    [path: string]: rawFile
-}
+export type RawFile = string | File | Config
 
-export interface directory {
-    [path: string]: File
+export interface RawDir {
+    [path: string]: RawFile
 }

spx-gui/src/util/class.ts

@@ -7,7 +7,7 @@
  * @Description: The util of class.
  */
 
-import AssetBase from "@/class/AssetBase";
+import { AssetBase } from "@/class/asset-base";
 import localforage from "localforage";
 
 /**

spx-gui/src/util/FileSystem.ts → spx-gui/src/util/file-system.ts

@@ -1,4 +1,12 @@
-import { FileType } from '@/types/file';
+/*
+ * @Author: Zhang Zhi Yang
+ * @Date: 2024-02-04 16:39:59
+ * @LastEditors: Zhang Zhi Yang
+ * @LastEditTime: 2024-02-04 16:45:22
+ * @FilePath: /spx-gui/src/util/FileSystem.ts
+ * @Description: 
+ */
+import type { FileType } from '@/types/file';
 import localforage from 'localforage';
 
 const storage = localforage.createInstance({