@preference-sl/pref-viewer 2.10.0-beta.4 → 2.10.0-beta.5

package/package.json

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

package/src/index.js

@@ -232,17 +232,21 @@ class PrefViewer extends HTMLElement {
         }
         this.#data.options.camera.changed = options.camera && options.camera !== this.#data.options.camera.value ? true : false;
         this.#data.options.camera.value = this.#data.options.camera.changed ? options.camera : this.#data.options.camera.value;
+        return this.#data.options.camera.changed;
     }
 
     #checkMaterialsChanged(options) {
         if (!options) {
             return false;
         }
+        let someChanged = false;
         Object.keys(this.#data.options.materials).forEach((material) => {
             const key = `${material}Material`;
             this.#data.options.materials[material].changed = options[key] && options[key] !== this.#data.options.materials[material].value ? true : false;
             this.#data.options.materials[material].value = this.#data.options.materials[material].changed ? options[key] : this.#data.options.materials[material].value;
+            someChanged = someChanged || this.#data.options.materials[material].changed;
         });
+        return someChanged;
     }
 
     #storeChangedFlagsForContainer(container) {
@@ -474,37 +478,45 @@ class PrefViewer extends HTMLElement {
             return false;
         }
 
-        containers.forEach((container) => {
-            container.meshes.filter((meshToFilter) => meshToFilter.name.startsWith(optionMaterial.prefix)).forEach((mesh) => { 
-                if (mesh.material) {
-                    mesh.material.dispose();
-                }
-                mesh.material = material;
-            });
-        });
+        let someSetted = false;
+        containers.forEach((container) =>
+            container.meshes
+                .filter((meshToFilter) => meshToFilter.name.startsWith(optionMaterial.prefix))
+                .forEach((mesh) => {
+                    mesh.material = material;
+                    someSetted = true;
+                })
+        );
 
-        return true;
+        return someSetted;
     }
 
     #setOptionsMaterials() {
-        Object.values(this.#data.options.materials).forEach((material) => this.#setOptionsMaterial(material));
+        let someSetted = false;
+        Object.values(this.#data.options.materials).forEach((material) => {
+            let settedMaterial = this.#setOptionsMaterial(material);
+            someSetted = someSetted || settedMaterial;
+        });
+        return someSetted;
     }
 
     #setOptionsCamera() {
         if (!this.#data.options.camera.value || (!this.#data.options.camera.changed && !this.#data.containers.model.assetContainer.changed)) {
             return false;
         }
+
         let camera = this.#data.containers.model.assetContainer?.cameras.find((cam) => cam.name === this.#data.options.camera.value) || null;
         if (!camera) {
-            camera = this.#camera;
-        } else {
-            camera.metadata = { locked: this.#data.options.camera.locked };
-            if (!this.#data.options.camera.locked) {
-                camera.attachControl(this.#canvas, true);
-            }
+            return false;
         }
 
+        camera.metadata = { locked: this.#data.options.camera.locked };
+        if (!this.#data.options.camera.locked) {
+            camera.attachControl(this.#canvas, true);
+        }
         this.#scene.activeCamera = camera;
+
+        return true;
     }
 
     #addContainer(container) {
@@ -657,7 +669,7 @@ class PrefViewer extends HTMLElement {
             return false;
         }
 
-        // AssetContainers
+        // Containers
         this.#data.containers.model.storage = config.model?.storage || null;
         this.#data.containers.model.show = config.model?.visible !== undefined ? config.model.visible : this.#data.containers.model.show;
         this.#data.containers.environment.storage = config.scene?.storage || null;
@@ -673,6 +685,22 @@ class PrefViewer extends HTMLElement {
         this.#initialized && this.#loadContainers(true, true, true);
     }
 
+    setOptions(options) {
+        if (!options) {
+            return false;
+        }
+        let someSetted = false;
+        if (this.#checkCameraChanged(options)) {
+            someSetted = someSetted || this.#setOptionsCamera();
+        }
+        if (this.#checkMaterialsChanged(options)) {
+            someSetted = someSetted || this.#setOptionsMaterials();
+        }
+        this.#resetChangedFlags();
+        debugger;
+        return someSetted;
+    }
+
     loadModel(model) {
         model = typeof model === "string" ? JSON.parse(model) : model;
         if (!model) {
@@ -717,9 +745,7 @@ class PrefViewer extends HTMLElement {
 
     downloadModelGLB() {
         const fileName = "model";
-        GLTF2Export.GLBAsync(this.#data.containers.model.assetContainer, fileName, { exportWithoutWaitingForScene: true }).then((glb) => {
-            glb.downloadFiles();
-        });
+        GLTF2Export.GLBAsync(this.#data.containers.model.assetContainer, fileName, { exportWithoutWaitingForScene: true }).then((glb) => glb.downloadFiles());
     }
 
     downloadModelUSDZ() {
@@ -742,9 +768,7 @@ class PrefViewer extends HTMLElement {
 
     downloadModelAndSceneGLB() {
         const fileName = "scene";
-        GLTF2Export.GLBAsync(this.#scene, fileName, { exportWithoutWaitingForScene: true }).then((glb) => {
-            glb.downloadFiles();
-        });
+        GLTF2Export.GLBAsync(this.#scene, fileName, { exportWithoutWaitingForScene: true }).then((glb) => glb.downloadFiles());
     }
 }