@preference-sl/pref-viewer 2.10.0-beta.17 → 2.10.0-beta.18

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@preference-sl/pref-viewer",
-  "version": "2.10.0-beta.17",
+  "version": "2.10.0-beta.18",
   "description": "Web Component to preview GLTF models with Babylon.js",
   "author": "Alex Moreno Palacio <amoreno@preference.es>",
   "scripts": {

package/src/gltf-storage.js

@@ -23,6 +23,12 @@ function _openEnsuringStore(dbName, storeName) {
         }
         open.onupgradeneeded = (ev) => {
             const upgradeDb = ev.target.result;
+
+            // Eliminar la object store si ya existe
+            if (upgradeDb.objectStoreNames.contains(storeName)) {
+                upgradeDb.deleteObjectStore(storeName);
+            }
+
             const store = upgradeDb.createObjectStore(storeName, { keyPath: 'id' });
             store.createIndex('expirationTimeStamp', 'expirationTimeStamp', { unique: false });
         };
@@ -218,4 +224,4 @@ export function deleteDatabase(dbName) {
     };
     // free to inspect PC.db in devtools
     global.PrefConfigurator.storage = Object.freeze(storage);
-})(globalThis);
+})(globalThis);

package/src/index.js

@@ -299,7 +299,6 @@ class PrefViewer extends HTMLElement {
     }
 
     #setStatusOptionsLoaded() {
-
         const toLoadDetail = {
             inneWallMaterial: !!this.#data.options.materials.innerWall.changed,
             outerWallMaterial: !!this.#data.options.materials.outerWall.changed,
@@ -310,7 +309,7 @@ class PrefViewer extends HTMLElement {
             inneWallMaterial: !!this.#data.options.materials.innerWall.changed?.success,
             outerWallMaterial: !!this.#data.options.materials.outerWall.changed?.success,
             innerFloorMaterial: !!this.#data.options.materials.innerFloor.changed?.success,
-            _outerFloorMaterial: !!this.#data.options.materials.outerFloor.changed?.success,
+            outerFloorMaterial: !!this.#data.options.materials.outerFloor.changed?.success,
         };
 
         const detail = {
@@ -358,10 +357,13 @@ class PrefViewer extends HTMLElement {
         if (success) {
             container.timeStamp = container.changed.timeStamp;
             container.size = container.changed.size;
-        } else {
+            container.changed.success = success;
+        } else if(container.changed)  {
             container.source = container.changed.source;
+            container.changed.success = success;
+        } else {
+            container.changed = { success: success };
         }
-        container.changed.success = success;
     }
 
     #resetChangedFlags() {
@@ -455,6 +457,7 @@ class PrefViewer extends HTMLElement {
     }
 
     #createLights() {
+        
         // 1) Stronger ambient fill
         this.#hemiLight = new HemisphericLight("hemiLight", new Vector3(-10, 10, -10), this.#scene);
         this.#hemiLight.intensity = 0.6;
@@ -733,25 +736,13 @@ class PrefViewer extends HTMLElement {
     }
 
     async #loadContainers(loadModel = true, loadEnvironment = true, loadMaterials = true) {        
+        this.#setStatusSceneLoading();
+
         const promiseArray = [];
         promiseArray.push(loadModel ? this.#loadAssetContainer(this.#data.containers.model) : false);
         promiseArray.push(loadEnvironment ? this.#loadAssetContainer(this.#data.containers.environment) : false);
         promiseArray.push(loadMaterials ? this.#loadAssetContainer(this.#data.containers.materials) : false);
 
-        const loadingDetail = {
-            model: !!this.#data.containers.model.changed,
-            environment: !!this.#data.containers.environment.changed,
-            materials: !!this.#data.containers.materials.changed,
-            options: {
-                camera: !!this.#data.options.camera.changed,
-                inneWallMaterial: !!this.#data.options.materials.innerWall.changed,
-                outerWallMaterial: !!this.#data.options.materials.outerWall.changed,
-                innerFloorMaterial: !!this.#data.options.materials.innerFloor.changed,
-                outerFloorMaterial: !!this.#data.options.materials.outerFloor.changed,
-            },
-        };
-        this.#setStatusSceneLoading(loadingDetail);
-
         Promise.allSettled(promiseArray)
             .then(async (values) => {
                 const modelContainer = values[0];
@@ -853,6 +844,7 @@ class PrefViewer extends HTMLElement {
         if (!model) {
             return false;
         }
+        this.#data.containers.model.changed = { storage: this.#data.containers.model.storage || null };
         this.#data.containers.model.storage = model.storage || null;
         this.#data.containers.model.show = model.visible !== undefined ? model.visible : this.#data.containers.model.show;
         this.initialized && this.#loadContainers(true, false, false);
@@ -863,11 +855,22 @@ class PrefViewer extends HTMLElement {
         if (!scene) {
             return false;
         }
+        this.#data.containers.environment.changed = { storage: this.#data.containers.environment.storage || null };
         this.#data.containers.environment.storage = scene.storage || null;
         this.#data.containers.environment.show = scene.visible !== undefined ? scene.visible : this.#data.containers.environment.show;
         this.initialized && this.#loadContainers(false, true, false);
     }
 
+    loadMaterials(materials) {
+        materials = typeof materials === "string" ? JSON.parse(materials) : materials;
+        if (!materials) {
+            return false;
+        }
+        this.#data.containers.materials.changed = { storage: this.#data.containers.materials.storage || null };
+        this.#data.containers.materials.storage = materials.storage || null;
+        this.initialized && this.#loadContainers(false, false, true);
+    }
+
     showModel() {
         this.#data.containers.model.show = true;
         this.#addContainer(this.#data.containers.model);