Replace refId with url for asset reference resolution

e2e/case/project-loader.ts

@@ -17,7 +17,7 @@ WebGLEngine.create({ canvas: "canvas", shaderLab }).then((engine) => {
   engine.resourceManager
     .load({
       type: AssetType.Project,
-      url: "https://mdn.alipayobjects.com/oasis_be/afts/file/A*fe1xS4Anh3AAAAAAQPAAAAgAekp5AQ/project.json"
+      url: "https://mdn.alipayobjects.com/oasis_be/afts/file/A*qGzdR5VaZToAAAAAQJAAAAgAekp5AQ/project.json"
     })
     .then(() => {
       const cameraEntity = engine.sceneManager.activeScene.findEntityByName("Camera");

packages/core/src/asset/ResourceManager.ts

@@ -570,38 +570,33 @@ export class ResourceManager {
   /** @internal */
   _objectPool: { [key: string]: any } = Object.create(null);
   /** @internal */
-  _idResourceMap: Record<ResourceId, EditorResourceItem> = Object.create(null);
-  /** @internal */
   _virtualPathResourceMap: Record<VirtualPath, EditorResourceItem> = Object.create(null);
 
   /**
    * @internal
    * @beta Just for internal editor, not recommended for developers.
    */
-  getResourceByRef<T extends EngineObject>(ref: { refId: string; key?: string; isClone?: boolean }): AssetPromise<T> {
-    const { refId, key, isClone } = ref;
-    const obj = this._objectPool[refId];
-    let promise: AssetPromise<T>;
-    if (obj) {
-      promise = AssetPromise.resolve(obj);
-    } else {
-      const resourceConfig = this._idResourceMap[refId];
-      if (!resourceConfig) {
-        Logger.warn(`refId:${refId} is not find in this._idResourceMap.`);
-        return AssetPromise.resolve(null);
-      }
-      let url = resourceConfig.virtualPath;
-      if (key) {
-        url += "?q=" + key;
-      }
+  getResourceByRef<T extends EngineObject>(ref: { url: string; key?: string; isClone?: boolean }): AssetPromise<T> {
+    const { url, key, isClone } = ref;
+    if (!url) {
+      Logger.warn("ResourceManager.getResourceByRef: url is empty.");
+      return AssetPromise.resolve(null);
+    }
 
-      promise = this.load<T>({
-        url,
-        type: resourceConfig.type,
-        params: resourceConfig.params
-      });
+    const cached = this._objectPool[url];
+    if (cached) {
+      return AssetPromise.resolve(isClone ? <T>(<IClone>(<unknown>cached)).clone() : cached);
     }
-    return promise.then((item) => (isClone ? <T>(<IClone>(<unknown>item)).clone() : item));
+
+    const mapped = this._virtualPathResourceMap[url];
+    if (!mapped) {
+      Logger.warn(`ResourceManager.getResourceByRef: url "${url}" not found in virtualPathResourceMap.`);
+      return AssetPromise.resolve(null);
+    }
+
+    const loadUrl = key ? url + "?q=" + key : url;
+    const promise = this.load<T>({ url: loadUrl, type: mapped.type, params: mapped.params });
+    return isClone ? promise.then((item) => <T>(<IClone>(<unknown>item)).clone()) : promise;
   }
 
   /**
@@ -611,7 +606,6 @@ export class ResourceManager {
   initVirtualResources(config: EditorResourceItem[]): void {
     config.forEach((element) => {
       this._virtualPathResourceMap[element.virtualPath] = element;
-      this._idResourceMap[element.id] = element;
       if (element.dependentAssetMap) {
         this._virtualPathResourceMap[element.virtualPath].dependentAssetMap = element.dependentAssetMap;
       }
@@ -653,13 +647,11 @@ const rePropName = RegExp(
   "g"
 );
 
-type ResourceId = string;
 type VirtualPath = string;
 type EditorResourceItem = {
   virtualPath: string;
   path: string;
   type: string;
-  id: string;
   dependentAssetMap?: { [key: string]: string };
   subpackageName?: string;
   params?: Record<string, any>;

packages/loader/src/AnimationClipLoader.ts

@@ -10,7 +10,7 @@ import {
 } from "@galacean/engine-core";
 import { decode } from "./resource-deserialize";
 
-@resourceLoader(AssetType.AnimationClip, ["ani"])
+@resourceLoader(AssetType.AnimationClip, ["anim"])
 class AnimationClipLoader extends Loader<AnimationClip> {
   load(item: LoadItem, resourceManager: ResourceManager): AssetPromise<AnimationClip> {
     return new AssetPromise((resolve, reject) => {
@@ -45,7 +45,7 @@ class AnimationClipLoader extends Loader<AnimationClip> {
   private _parseKeyframeValue(keyframe: any, resourceManager: ResourceManager): Promise<any> {
     const value = keyframe.value;
 
-    if (typeof value === "object" && (value as any)?.refId) {
+    if (typeof value === "object" && (value as any)?.url) {
       return new Promise((resolve) => {
         resourceManager
           // @ts-ignore

packages/loader/src/AnimatorControllerLoader.ts

@@ -14,7 +14,7 @@ import {
   WrapMode
 } from "@galacean/engine-core";
 
-@resourceLoader(AssetType.AnimatorController, ["json"], false)
+@resourceLoader(AssetType.AnimatorController, ["animCtrl"])
 class AnimatorControllerLoader extends Loader<AnimatorController> {
   load(item: LoadItem, resourceManager: ResourceManager): AssetPromise<AnimatorController> {
     return new AssetPromise((resolve, reject) => {

packages/loader/src/BufferLoader.ts

@@ -10,7 +10,7 @@ import {
 
 const base64Regex = /^data:(.+?);base64,/;
 
-@resourceLoader(AssetType.Buffer, ["bin", "r3bin"])
+@resourceLoader(AssetType.Buffer, ["bin"])
 class BufferLoader extends Loader<BufferAsset> {
   load(item: LoadItem, resourceManager: ResourceManager): AssetPromise<BufferAsset> {
     const { url } = item;

packages/loader/src/MaterialLoader.ts

@@ -31,7 +31,7 @@ function parseProperty(object: Object, key: string, value: any) {
   }
 }
 
-@resourceLoader(AssetType.Material, ["json"])
+@resourceLoader(AssetType.Material, ["mat"])
 class MaterialLoader extends Loader<Material> {
   load(item: LoadItem, resourceManager: ResourceManager): AssetPromise<Material> {
     return new AssetPromise((resolve, reject) => {

packages/loader/src/PhysicsMaterialLoader.ts

@@ -8,7 +8,7 @@ import {
   PhysicsMaterial
 } from "@galacean/engine-core";
 
-@resourceLoader(AssetType.PhysicsMaterial, ["mesh"])
+@resourceLoader(AssetType.PhysicsMaterial, ["physMat"])
 class PhysicsMaterialLoader extends Loader<PhysicsMaterial> {
   load(item: LoadItem, resourceManager: ResourceManager): AssetPromise<PhysicsMaterial> {
     return (

packages/loader/src/ProjectLoader.ts

@@ -9,7 +9,7 @@ import {
 } from "@galacean/engine-core";
 import { IProject } from "./resource-deserialize";
 
-@resourceLoader(AssetType.Project, ["proj"], false)
+@resourceLoader(AssetType.Project, ["project"], false)
 class ProjectLoader extends Loader<void> {
   load(item: LoadItem, resourceManager: ResourceManager): AssetPromise<void> {
     const { engine } = resourceManager;

packages/loader/src/Texture2DLoader.ts

@@ -1,6 +1,7 @@
 import {
   AssetPromise,
   AssetType,
+  ContentRestorer,
   LoadItem,
   Loader,
   RequestConfig,
@@ -12,65 +13,117 @@ import {
   TextureWrapMode,
   resourceLoader
 } from "@galacean/engine-core";
-import { Texture2DContentRestorer } from "./Texture2DContentRestorer";
+import { decode } from "./resource-deserialize";
+import { FileHeader } from "./resource-deserialize/utils/FileHeader";
 
-@resourceLoader(AssetType.Texture2D, ["png", "jpg", "webp", "jpeg"])
+function loadImageFromBuffer(buffer: ArrayBuffer): AssetPromise<HTMLImageElement> {
+  return new AssetPromise((resolve, reject) => {
+    const blob = new Blob([buffer]);
+    const img = new Image();
+    img.onload = () => {
+      URL.revokeObjectURL(img.src);
+      resolve(img);
+    };
+    img.onerror = reject;
+    img.src = URL.createObjectURL(blob);
+  });
+}
+
+@resourceLoader(AssetType.Texture2D, ["png", "jpg", "webp", "jpeg", "tex"])
 class Texture2DLoader extends Loader<Texture2D> {
   override load(item: LoadItem, resourceManager: ResourceManager): AssetPromise<Texture2D> {
+    const url = item.url;
+    const requestConfig = <RequestConfig>{ ...item, type: "arraybuffer" };
     return new AssetPromise((resolve, reject, setTaskCompleteProgress, setTaskDetailProgress) => {
-      const url = item.url;
-      const requestConfig = <RequestConfig>{
-        ...item,
-        type: "image"
-      };
       resourceManager
         // @ts-ignore
-        ._request<HTMLImageElement>(url, requestConfig)
+        ._request<ArrayBuffer>(url, requestConfig)
         .onProgress(setTaskCompleteProgress, setTaskDetailProgress)
-        .then((image) => {
-          const {
-            format = TextureFormat.R8G8B8A8,
-            anisoLevel,
-            wrapModeU,
-            wrapModeV,
-            filterMode,
-            isSRGBColorSpace = true,
-            mipmap = true
-          } = (item.params as Partial<Texture2DParams>) ?? {};
-          const { width, height } = image;
-          const engine = resourceManager.engine;
+        .then((buffer) => {
+          if (FileHeader.checkMagic(buffer)) {
+            decode<Texture2D>(buffer, resourceManager.engine).then((texture) => {
+              resourceManager.addContentRestorer(new Texture2DContentRestorer(texture, url, requestConfig));
+              resolve(texture);
+            }, reject);
+          } else {
+            loadImageFromBuffer(buffer).then((img) => {
+              const texture = this._createTexture(img, item, resourceManager);
+              resourceManager.addContentRestorer(new Texture2DContentRestorer(texture, url, requestConfig));
+              resolve(texture);
+            }, reject);
+          }
+        })
+        .catch(reject);
+    });
+  }
 
-          const generateMipmap = TextureUtils.supportGenerateMipmapsWithCorrection(
-            engine,
-            width,
-            height,
-            format,
-            mipmap,
-            isSRGBColorSpace
-          );
+  private _createTexture(img: HTMLImageElement, item: LoadItem, resourceManager: ResourceManager): Texture2D {
+    const {
+      format = TextureFormat.R8G8B8A8,
+      anisoLevel,
+      wrapModeU,
+      wrapModeV,
+      filterMode,
+      isSRGBColorSpace = true,
+      mipmap = true
+    } = (item.params as Partial<Texture2DParams>) ?? {};
+    const { width, height } = img;
+    const engine = resourceManager.engine;
 
-          const texture = new Texture2D(engine, width, height, format, generateMipmap, isSRGBColorSpace);
+    const generateMipmap = TextureUtils.supportGenerateMipmapsWithCorrection(
+      engine,
+      width,
+      height,
+      format,
+      mipmap,
+      isSRGBColorSpace
+    );
 
-          texture.anisoLevel = anisoLevel ?? texture.anisoLevel;
-          texture.filterMode = filterMode ?? texture.filterMode;
-          texture.wrapModeU = wrapModeU ?? texture.wrapModeU;
-          texture.wrapModeV = wrapModeV ?? texture.wrapModeV;
+    const texture = new Texture2D(engine, width, height, format, generateMipmap, isSRGBColorSpace);
+    texture.anisoLevel = anisoLevel ?? texture.anisoLevel;
+    texture.filterMode = filterMode ?? texture.filterMode;
+    texture.wrapModeU = wrapModeU ?? texture.wrapModeU;
+    texture.wrapModeV = wrapModeV ?? texture.wrapModeV;
+    texture.setImageSource(img);
+    generateMipmap && texture.generateMipmaps();
 
-          texture.setImageSource(image);
-          generateMipmap && texture.generateMipmaps();
+    const url = item.url;
+    if (url.indexOf("data:") !== 0) {
+      texture.name = url.substring(url.lastIndexOf("/") + 1);
+    }
 
-          if (url.indexOf("data:") !== 0) {
-            const index = url.lastIndexOf("/");
-            texture.name = url.substring(index + 1);
-          }
+    return texture;
+  }
+}
+
+class Texture2DContentRestorer extends ContentRestorer<Texture2D> {
+  constructor(
+    resource: Texture2D,
+    public url: string,
+    public requestConfig: RequestConfig
+  ) {
+    super(resource);
+  }
 
-          resourceManager.addContentRestorer(new Texture2DContentRestorer(texture, url, requestConfig));
-          resolve(texture);
+  override restoreContent(): AssetPromise<Texture2D> {
+    const texture = this.resource;
+    const engine = texture.engine;
+    return (
+      engine.resourceManager
+        // @ts-ignore
+        ._request<ArrayBuffer>(this.url, this.requestConfig)
+        .then((buffer) => {
+          if (FileHeader.checkMagic(buffer)) {
+            return decode<Texture2D>(buffer, engine, texture);
+          } else {
+            return loadImageFromBuffer(buffer).then((img) => {
+              texture.setImageSource(img);
+              texture.generateMipmaps();
+              return texture;
+            });
+          }
         })
-        .catch((e) => {
-          reject(e);
-        });
-    });
+    );
   }
 }
 

packages/loader/src/TextureCubeLoader.ts

@@ -13,7 +13,7 @@ import {
 } from "@galacean/engine-core";
 import { TextureCubeContentRestorer } from "./TextureCubeContentRestorer";
 
-@resourceLoader(AssetType.TextureCube, [""])
+@resourceLoader(AssetType.TextureCube, ["texCube"])
 class TextureCubeLoader extends Loader<TextureCube> {
   override load(item: LoadItem, resourceManager: ResourceManager): AssetPromise<TextureCube> {
     return new AssetPromise((resolve, reject) => {

packages/loader/src/gltf/extensions/GLTFExtensionSchema.ts

@@ -153,7 +153,7 @@ export interface IEXTMeshoptCompressionSchema {
 }
 
 export interface IGalaceanMaterialRemap {
-  refId: string;
+  url: string;
   key?: string;
   isClone?: boolean;
 }

packages/loader/src/resource-deserialize/index.ts

@@ -26,7 +26,6 @@ export function decode<T>(arrayBuffer: ArrayBuffer, engine: Engine, ...args: any
 
 export * from "./resources/parser/HierarchyParser";
 export * from "./resources/parser/ParserContext";
-export * from "./resources/scene/EditorTextureLoader";
 export * from "./resources/scene/SceneParser";
 export * from "./resources/schema";