@colijnit/configurator 259.1.5 → 260.1.1

package/fesm2015/colijnit-configurator.js

@@ -769,6 +769,33 @@ class VariationUtils {
             }
         });
     }
+    static LoadVariationByUrl(materialCode, url) {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (!url) {
+                return null;
+            }
+            if (!url.includes('ione3d')) {
+                url = url.concat('.ione3d');
+            }
+            if (!window.hasOwnProperty('downloadVariation')) {
+                console.error('downloadVariation not defined in window global');
+                throw new Error('downloadVariation not defined in window global');
+            }
+            if (this.MaterialCache.has(materialCode)) {
+                return this.MaterialCache.get(materialCode);
+            }
+            try {
+                const file = yield window.downloadVariation(url);
+                const settings = yield VariationUtils.GetVariationSettingsFromFile(materialCode, file);
+                this.MaterialCache.set(materialCode, settings);
+                return settings;
+            }
+            catch (err) {
+                console.error('Error loading variation:', err);
+                throw err;
+            }
+        });
+    }
     // public static GetMaterialFromName(variationFolder: string, material: any): Promise<MeshStandardMaterial> {
     //   return new Promise((resolve: Function) => {
     //     if (!material) {
@@ -1130,17 +1157,20 @@ class VariationHelper extends BaseUtils {
             try {
                 const len = parts.length;
                 for (let i = 0; i < len; i++) {
+                    let partSettings;
+                    if (parts[i].decoNode && parts[i].decoNode.materialUrl && parts[i].decoNode.type === DecoNodeType.Part) {
+                        partSettings = yield VariationUtils.LoadVariationByUrl(parts[i].decoNode.materialCode, parts[i].decoNode.materialUrl);
+                    }
                     if (parts[i].decoNode && parts[i].decoNode.gameObjectName && parts[i].decoNode.type === DecoNodeType.Part) {
-                        const partSettings = yield VariationUtils.LoadVariation(this.assetPath, parts[i].decoNode.gameObjectName || parts[i].decoId);
-                        if (partSettings) {
-                            const partVariation = new Variation();
-                            partVariation.decoId = parseFloat(parts[i].decoNode.id);
-                            partVariation.brandId = parts[i].decoNode.brandId;
-                            partVariation.gameObjectName = parts[i].decoNode.gameObjectName;
-                            partVariation.material = yield AssetUtils.CreateMaterialFromAsset(partSettings);
-                            // parts[i].variation = partVariation;
-                            this._applyMaterialPart(obj, partVariation, parts[i].node, usePbr);
-                        }
+                        partSettings = yield VariationUtils.LoadVariation(this.assetPath, parts[i].decoNode.gameObjectName || parts[i].decoId);
+                    }
+                    if (partSettings) {
+                        const partVariation = new Variation();
+                        partVariation.decoId = parseFloat(parts[i].decoNode.id);
+                        partVariation.brandId = parts[i].decoNode.brandId;
+                        partVariation.gameObjectName = parts[i].decoNode.gameObjectName;
+                        partVariation.material = yield AssetUtils.CreateMaterialFromAsset(partSettings);
+                        this._applyMaterialPart(obj, partVariation, parts[i].node, usePbr);
                     }
                 }
             }
@@ -1168,8 +1198,14 @@ class VariationHelper extends BaseUtils {
                     const lastKnownVariations = [];
                     const variationPromise = [];
                     for (let j = 0; j < variations.length; j++) {
-                        variationPromise.push(this.loadTheVariation(variations[j].gameObjectName || parts[i].decoId)
-                            .then((variationSettings) => {
+                        let variationsName = '';
+                        if (variations[j].materialCode && variations[j].materialUrl) {
+                            variationsName = variations[j].materialCode;
+                        }
+                        else {
+                            variationsName = variations[j].gameObjectName || parts[i].decoId;
+                        }
+                        variationPromise.push(this.loadTheVariation(variationsName).then((variationSettings) => {
                             const newVariation = new Variation();
                             newVariation.decoId = variations[j].constructor.name === 'Variation' ? variations[j].decoId : parseFloat(variations[j].id);
                             newVariation.node = variations[j].constructor.name === 'Variation' ? variations[j].node : variations[j].nodeId;
@@ -1211,29 +1247,46 @@ class VariationHelper extends BaseUtils {
         }
     }
     preloadVariations(fileNames) {
-        for (let i = 0; i < fileNames.length; i++) {
-            const fileName = fileNames[i];
-            if (fileName && !this.get(fileName)) {
-                const settings = new VariationSettings();
-                settings.id = fileName;
-                settings.loading = true;
-                this._variations.push(settings);
-                VariationUtils.LoadVariation(this.assetPath, fileName)
-                    .then((variationSettings) => {
-                    settings.loading = false;
-                    if (variationSettings) {
-                        // this.set(variationSettings);
-                        settings.copyFrom(variationSettings);
-                    }
-                    settings.loaded.next(settings);
-                })
-                    .catch((err) => {
-                    console.error(`Error loading variation ${fileName}:`, err);
-                    settings.loading = false;
-                    settings.loaded.next(null);
-                });
+        fileNames.forEach((node) => {
+            if (node.materialUrl) {
+                if (node.materialCode && !this.get(node.materialCode)) {
+                    const settings = new VariationSettings();
+                    settings.id = node.materialCode;
+                    settings.loading = true;
+                    this._variations.push(settings);
+                    VariationUtils.LoadVariationByUrl(node.materialCode, node.materialUrl).then((variationSettings) => {
+                        settings.loading = false;
+                        if (variationSettings) {
+                            settings.copyFrom(variationSettings);
+                        }
+                        settings.loaded.next(settings);
+                    }).catch((err) => {
+                        console.error(`Error loading variation ${node.materialCode}:`, err);
+                        settings.loading = false;
+                        settings.loaded.next(null);
+                    });
+                }
             }
-        }
+            else if (node.gameObjectName) {
+                if (!this.get(node.gameObjectName)) {
+                    const settings = new VariationSettings();
+                    settings.id = node.gameObjectName;
+                    settings.loading = true;
+                    this._variations.push(settings);
+                    VariationUtils.LoadVariation(this.assetPath, node.gameObjectName).then((variationSettings) => {
+                        settings.loading = false;
+                        if (variationSettings) {
+                            settings.copyFrom(variationSettings);
+                        }
+                        settings.loaded.next(settings);
+                    }).catch((err) => {
+                        console.error(`Error loading variation ${node.gameObjectName}:`, err);
+                        settings.loading = false;
+                        settings.loaded.next(null);
+                    });
+                }
+            }
+        });
     }
     loadTheVariation(fileName) {
         return __awaiter(this, void 0, void 0, function* () {
@@ -1933,8 +1986,8 @@ class Builder {
     _preloadMaterials() {
         if (this._decos && this._decos.length) {
             const materials = [...new Set(this._decos
-                    .filter(d => d.gameObjectName && d.type === DecoNodeType.Variation)
-                    .map(d => d.gameObjectName))];
+                    .filter(d => (d.gameObjectName || d.materialUrl) && d.type === DecoNodeType.Variation)
+                    .map(d => d))];
             this._variationHelper.preloadVariations(materials);
         }
     }
@@ -2113,18 +2166,14 @@ class Builder {
                     if (lastAdded) {
                         if (newPart) {
                             if (decoNode.materialId) {
-                                if (!lastAdded.variations.find(v => v.id === decoNode.id)) {
-                                    lastAdded.variations.push(decoNode);
-                                }
+                                lastAdded.variations.push(decoNode);
                             }
                             else {
                                 lastAdded.variations = [decoNode];
                             }
                         }
                         else {
-                            if (!lastAdded.variations.find(v => v.id === decoNode.id)) {
-                                lastAdded.variations.push(decoNode);
-                            }
+                            lastAdded.variations.push(decoNode);
                         }
                         newPart = false;
                     }
@@ -2480,23 +2529,23 @@ class AnswerComponent {
 AnswerComponent.decorators = [
     { type: Component, args: [{
                 selector: 'answer',
-                template: `
-    <div class="ione-configurator">
-      <div class="answer-wrapper">
-        <div class="answer-content" @answerAppear>
-          <div class="answer-thumbnail">
-            <rp-loader *ngIf="answer.imageData === ''"></rp-loader>
-            <img *ngIf="answer.imageData !== '' && answer.imageData !== null" class="answer-img" [src]="answer.imageData">
-          </div>
-          <div class="answer-title-wrapper">
-            <span class="answer-title" [textContent]="answer.commercialAnswer"></span>
-          </div>
-          <div class="price">
-            <span class="price-value"></span>
-          </div>
-        </div>
-      </div>
-    </div>
+                template: `
+    <div class="ione-configurator">
+      <div class="answer-wrapper">
+        <div class="answer-content" @answerAppear>
+          <div class="answer-thumbnail">
+            <rp-loader *ngIf="answer.imageData === ''"></rp-loader>
+            <img *ngIf="answer.imageData !== '' && answer.imageData !== null" class="answer-img" [src]="answer.imageData">
+          </div>
+          <div class="answer-title-wrapper">
+            <span class="answer-title" [textContent]="answer.commercialAnswer"></span>
+          </div>
+          <div class="price">
+            <span class="price-value"></span>
+          </div>
+        </div>
+      </div>
+    </div>
   `,
                 animations: [
                     trigger('answerAppear', [
@@ -2623,17 +2672,17 @@ class LoaderComponent {
 LoaderComponent.decorators = [
     { type: Component, args: [{
                 selector: 'rp-loader',
-                template: `
-    <div class="loader-wrapper">
-      <svg xmlns="http://www.w3.org/2000/svg" width="44" height="44" viewBox="0 0 44 44" stroke="#3760a1">
-        <g fill="none" fill-rule="evenodd" stroke-width="3">
-          <circle class="ripple1" cx="22" cy="22" r="19">
-          </circle>
-          <circle class="ripple2" cx="22" cy="22" r="19">
-          </circle>
-        </g>
-      </svg>
-    </div>
+                template: `
+    <div class="loader-wrapper">
+      <svg xmlns="http://www.w3.org/2000/svg" width="44" height="44" viewBox="0 0 44 44" stroke="#3760a1">
+        <g fill="none" fill-rule="evenodd" stroke-width="3">
+          <circle class="ripple1" cx="22" cy="22" r="19">
+          </circle>
+          <circle class="ripple2" cx="22" cy="22" r="19">
+          </circle>
+        </g>
+      </svg>
+    </div>
   `,
                 styles: [":host{-webkit-user-select:none;user-select:none;pointer-events:none}:host .loader-wrapper{z-index:1100;position:absolute;width:54px;height:54px}:host .loader-wrapper svg{width:100%;height:100%}:host .loader-wrapper svg .ripple1{transform-origin:center;animation:ripple 1.5s infinite}:host .loader-wrapper svg .ripple2{transform-origin:center;animation:ripple 1.5s infinite .4s}@keyframes ripple{0%{transform:scale(0);opacity:1}to{transform:scale(1);opacity:0}}\n"]
             },] }