@colijnit/configurator 12.0.4 → 12.0.7

package/app/builder.d.ts

@@ -12,6 +12,7 @@ export declare class Builder {
     decosReceived: BehaviorSubject<DecoNode[]>;
     answersReceived: BehaviorSubject<Answer[]>;
     modelLoaded: BehaviorSubject<THREE.Object3D>;
+    debug: Function;
     private _scene;
     private _instanceId;
     private _sku;
@@ -42,6 +43,7 @@ export declare class Builder {
     getImageForSelectionOrAnswer(object: Selection | Answer): Promise<string>;
     _cleanUp(): void;
     private _handleResponseData;
+    private _preloadMaterials;
     private _setInstanceId;
     private _prepareConfiguration;
     private _downloadAsset;
@@ -61,4 +63,5 @@ export declare class Builder {
     private _getAdjustables;
     private _updatePivot;
     private _reset;
+    private _log;
 }

package/bundles/colijnit-configurator.umd.js

@@ -932,6 +932,15 @@
         return SceneUtils;
     }());
 
+    var VariationSettings = /** @class */ (function () {
+        function VariationSettings() {
+            this.settings = {};
+            this.loading = false;
+            this.loaded = new rxjs.Subject();
+        }
+        return VariationSettings;
+    }());
+
     var Material = /** @class */ (function () {
         function Material() {
             this.specular = new THREE__namespace.Color(0.3, 0.3, 0.3);
@@ -1168,15 +1177,6 @@
         return Variation;
     }());
 
-    var VariationSettings = /** @class */ (function () {
-        function VariationSettings() {
-            this.settings = {};
-            this.loading = false;
-            this.loaded = new rxjs.Subject();
-        }
-        return VariationSettings;
-    }());
-
     // @dynamic
     var VariationUtils = /** @class */ (function () {
         function VariationUtils() {
@@ -1186,44 +1186,53 @@
         };
         VariationUtils.LoadVariation = function (assetPath, fileName) {
             return __awaiter(this, void 0, void 0, function () {
-                var id, file, err_1, mute;
+                var _this = this;
                 return __generator(this, function (_a) {
-                    switch (_a.label) {
-                        case 0:
-                            if (!fileName) {
-                                return [2 /*return*/, null];
-                            }
-                            if (fileName.indexOf('ione3d') < 0) {
-                                fileName = fileName.concat('.ione3d');
-                            }
-                            id = fileName.substr(0, fileName.lastIndexOf('.ione3d'));
-                            _a.label = 1;
-                        case 1:
-                            _a.trys.push([1, 6, , 7]);
-                            if (!assetPath.endsWith('/')) {
-                                assetPath += '/';
-                            }
-                            if (!window.hasOwnProperty('downloadVariation')) {
-                                console.error('downloadVariation not defined in window global');
-                                return [2 /*return*/, null];
-                            }
-                            file = void 0;
-                            if (!this.MaterialCache.has(id)) return [3 /*break*/, 2];
-                            file = this.MaterialCache.get(id);
-                            return [3 /*break*/, 4];
-                        case 2: return [4 /*yield*/, window.downloadVariation(assetPath.replace('https://cdn1.colijn-it.nl/', '') + "variation/" + fileName)];
-                        case 3:
-                            file = _a.sent();
-                            this.MaterialCache.set(id, file);
-                            _a.label = 4;
-                        case 4: return [4 /*yield*/, VariationUtils.GetVariationSettingsFromFile(id, file)];
-                        case 5: return [2 /*return*/, _a.sent()];
-                        case 6:
-                            err_1 = _a.sent();
-                            mute = err_1;
-                            return [2 /*return*/, null];
-                        case 7: return [2 /*return*/];
-                    }
+                    return [2 /*return*/, new Promise(function (resolve, reject) { return __awaiter(_this, void 0, void 0, function () {
+                            var id, file, settings, err_1, mute;
+                            return __generator(this, function (_a) {
+                                switch (_a.label) {
+                                    case 0:
+                                        if (!fileName) {
+                                            resolve(null);
+                                        }
+                                        if (fileName.indexOf('ione3d') < 0) {
+                                            fileName = fileName.concat('.ione3d');
+                                        }
+                                        id = fileName.substr(0, fileName.lastIndexOf('.ione3d'));
+                                        _a.label = 1;
+                                    case 1:
+                                        _a.trys.push([1, 6, , 7]);
+                                        if (!assetPath.endsWith('/')) {
+                                            assetPath += '/';
+                                        }
+                                        if (!window.hasOwnProperty('downloadVariation')) {
+                                            console.error('downloadVariation not defined in window global');
+                                            reject('downloadVariation not defined in window global');
+                                        }
+                                        file = void 0;
+                                        if (!this.MaterialCache.has(id)) return [3 /*break*/, 2];
+                                        resolve(this.MaterialCache.get(id));
+                                        return [3 /*break*/, 5];
+                                    case 2: return [4 /*yield*/, window.downloadVariation(assetPath.replace('https://cdn1.colijn-it.nl/', '') + "variation/" + fileName)];
+                                    case 3:
+                                        file = _a.sent();
+                                        return [4 /*yield*/, VariationUtils.GetVariationSettingsFromFile(id, file)];
+                                    case 4:
+                                        settings = _a.sent();
+                                        this.MaterialCache.set(id, settings);
+                                        resolve(settings);
+                                        _a.label = 5;
+                                    case 5: return [3 /*break*/, 7];
+                                    case 6:
+                                        err_1 = _a.sent();
+                                        mute = err_1;
+                                        reject(err_1);
+                                        return [3 /*break*/, 7];
+                                    case 7: return [2 /*return*/];
+                                }
+                            });
+                        }); })];
                 });
             });
         };
@@ -1581,6 +1590,7 @@
 
     var VariationHelper = /** @class */ (function () {
         function VariationHelper() {
+            this._variations = [];
             this._lastKnownVariations = new Map();
         }
         VariationHelper.prototype.clearCache = function () {
@@ -1657,68 +1667,155 @@
         VariationHelper.prototype.loadVariation = function (obj, parts, usePbr) {
             if (usePbr === void 0) { usePbr = false; }
             return __awaiter(this, void 0, void 0, function () {
-                var len, i, variations, lastKnownVariations, j, variationSettings, newVariation, _a, e_2;
-                return __generator(this, function (_b) {
-                    switch (_b.label) {
+                var len, _loop_1, this_1, i, e_2;
+                var _this = this;
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
                         case 0:
-                            _b.trys.push([0, 9, , 10]);
+                            _a.trys.push([0, 5, , 6]);
                             len = parts.length;
+                            _loop_1 = function (i) {
+                                var variations, lastKnownVariations, variationPromise, _loop_2, j;
+                                return __generator(this, function (_b) {
+                                    switch (_b.label) {
+                                        case 0:
+                                            variations = parts[i].variations;
+                                            if (!variations || variations.length === 0) {
+                                                if (this_1._getLastKnownVariations(parts[i].nodeId)) {
+                                                    parts[i].variations = this_1._getLastKnownVariations(parts[i].nodeId);
+                                                    this_1._applyVariations(obj, parts[i], usePbr);
+                                                    return [2 /*return*/, "continue"];
+                                                }
+                                                else {
+                                                    return [2 /*return*/, "continue"];
+                                                }
+                                            }
+                                            lastKnownVariations = [];
+                                            variationPromise = [];
+                                            _loop_2 = function (j) {
+                                                variationPromise.push(this_1.loadTheVariation(variations[j].gameObjectName || parts[i].decoId).then(function (variationSettings) { return __awaiter(_this, void 0, void 0, function () {
+                                                    var newVariation, _a;
+                                                    return __generator(this, function (_b) {
+                                                        switch (_b.label) {
+                                                            case 0:
+                                                                newVariation = new Variation();
+                                                                newVariation.decoId = parseFloat(variations[j].id);
+                                                                newVariation.brandId = variations[j].brandId;
+                                                                newVariation.optionText = variations[j].optionText;
+                                                                newVariation.gameObjectName = variations[j].gameObjectName;
+                                                                newVariation.supplierArticleNr = variations[j].supplierArticleNr;
+                                                                newVariation.materialId = variations[j].materialId;
+                                                                _a = newVariation;
+                                                                return [4 /*yield*/, AssetUtils.CreateMaterialFromAsset(variationSettings)];
+                                                            case 1:
+                                                                _a.material = _b.sent();
+                                                                lastKnownVariations.push(newVariation);
+                                                                return [2 /*return*/];
+                                                        }
+                                                    });
+                                                }); }));
+                                            };
+                                            for (j = 0; j < variations.length; j++) {
+                                                _loop_2(j);
+                                            }
+                                            return [4 /*yield*/, Promise.all(variationPromise)];
+                                        case 1:
+                                            _b.sent();
+                                            this_1._setLastKnownVariations(parts[i].nodeId + "_" + parts[i].node, lastKnownVariations);
+                                            parts[i].variations = lastKnownVariations;
+                                            this_1._applyVariations(obj, parts[i], usePbr);
+                                            return [2 /*return*/];
+                                    }
+                                });
+                            };
+                            this_1 = this;
                             i = 0;
-                            _b.label = 1;
+                            _a.label = 1;
                         case 1:
-                            if (!(i < len)) return [3 /*break*/, 8];
-                            variations = parts[i].variations;
-                            if (!variations || variations.length === 0) {
-                                if (this._getLastKnownVariations(parts[i].nodeId)) {
-                                    parts[i].variations = this._getLastKnownVariations(parts[i].nodeId);
-                                    this._applyVariations(obj, parts[i], usePbr);
-                                    return [3 /*break*/, 7];
-                                }
-                                else {
-                                    return [3 /*break*/, 7];
-                                }
-                            }
-                            lastKnownVariations = [];
-                            j = 0;
-                            _b.label = 2;
+                            if (!(i < len)) return [3 /*break*/, 4];
+                            return [5 /*yield**/, _loop_1(i)];
                         case 2:
-                            if (!(j < variations.length)) return [3 /*break*/, 6];
-                            return [4 /*yield*/, VariationUtils.LoadVariation(this.assetPath, variations[j].gameObjectName || parts[i].decoId)];
+                            _a.sent();
+                            _a.label = 3;
                         case 3:
-                            variationSettings = _b.sent();
-                            newVariation = new Variation();
-                            newVariation.decoId = parseFloat(variations[j].id);
-                            newVariation.brandId = variations[j].brandId;
-                            newVariation.gameObjectName = variations[j].gameObjectName;
-                            newVariation.supplierArticleNr = variations[j].supplierArticleNr;
-                            newVariation.materialId = variations[j].materialId;
-                            _a = newVariation;
-                            return [4 /*yield*/, AssetUtils.CreateMaterialFromAsset(variationSettings)];
-                        case 4:
-                            _a.material = _b.sent();
-                            lastKnownVariations.push(newVariation);
-                            _b.label = 5;
-                        case 5:
-                            j++;
-                            return [3 /*break*/, 2];
-                        case 6:
-                            this._setLastKnownVariations(parts[i].nodeId, lastKnownVariations);
-                            parts[i].variations = lastKnownVariations;
-                            this._applyVariations(obj, parts[i], usePbr);
-                            _b.label = 7;
-                        case 7:
                             i++;
                             return [3 /*break*/, 1];
-                        case 8: return [3 /*break*/, 10];
-                        case 9:
-                            e_2 = _b.sent();
+                        case 4: return [3 /*break*/, 6];
+                        case 5:
+                            e_2 = _a.sent();
                             console.error(e_2);
-                            return [3 /*break*/, 10];
-                        case 10: return [2 /*return*/];
+                            return [3 /*break*/, 6];
+                        case 6: return [2 /*return*/];
+                    }
+                });
+            });
+        };
+        VariationHelper.prototype.get = function (id) {
+            var len = this._variations.length;
+            for (var i = 0; i < len; i++) {
+                if (this._variations[i].id && this._variations[i].id === id) {
+                    return this._variations[i];
+                }
+            }
+        };
+        VariationHelper.prototype.set = function (variations) {
+            var idx = this._variations.findIndex(function (v) { return v.id === variations.id; });
+            if (idx > -1) {
+                this._variations[idx] = variations;
+            }
+            else {
+                this._variations.push(variations);
+            }
+        };
+        VariationHelper.prototype.preloadVariations = function (schema, fileNames) {
+            var _this = this;
+            fileNames.forEach(function (fileName) {
+                if (fileName && !_this.get(fileName)) {
+                    var settings_1 = new VariationSettings();
+                    settings_1.id = fileName;
+                    settings_1.loading = true;
+                    _this._variations.push(settings_1);
+                    var assetPath = _this.assetPath;
+                    if (!assetPath.endsWith('/')) {
+                        assetPath += '/';
+                    }
+                    VariationUtils.LoadVariation(assetPath, fileName).then(function (variationSettings) {
+                        settings_1.loading = false;
+                        settings_1.loaded.next(variationSettings);
+                        if (variationSettings) {
+                            _this.set(variationSettings);
+                        }
+                    });
+                }
+            });
+        };
+        VariationHelper.prototype.loadTheVariation = function (fileName) {
+            return __awaiter(this, void 0, void 0, function () {
+                var settings;
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0:
+                            if (!fileName) {
+                                return [2 /*return*/, null];
+                            }
+                            if (!this.get(fileName)) return [3 /*break*/, 3];
+                            settings = this.get(fileName);
+                            if (!settings.loading) return [3 /*break*/, 2];
+                            return [4 /*yield*/, this._waitForVariationToLoad(settings)];
+                        case 1: return [2 /*return*/, _a.sent()];
+                        case 2: return [2 /*return*/, settings];
+                        case 3: return [2 /*return*/];
                     }
                 });
             });
         };
+        VariationHelper.prototype._waitForVariationToLoad = function (settings) {
+            return new Promise(function (resolve) {
+                settings.loaded.subscribe(function (value) {
+                    resolve(value);
+                });
+            });
+        };
         VariationHelper.prototype._getChildrenFilterByProp = function (obj, userDataObjectProp, prop, value) {
             return obj.children.filter(function (child) {
                 return child.userData &&
@@ -2255,6 +2352,7 @@
                             _a.label = 1;
                         case 1:
                             _a.trys.push([1, 6, , 7]);
+                            this._log('start build');
                             return [4 /*yield*/, this._downloadAsset(assetUrl, cdnUrl, schema)];
                         case 2:
                             _a.sent();
@@ -2262,10 +2360,12 @@
                             this._selections = selections;
                             this._decos = decos;
                             this._linkSelectionsAndDecos();
+                            this._preloadMaterials(schema);
                             return [4 /*yield*/, this._build()];
                         case 3:
                             build = _a.sent();
                             this._cleanUp();
+                            this._log('finish build');
                             return [2 /*return*/, build];
                         case 4: throw 'Unsufficient data provided!';
                         case 5: return [3 /*break*/, 7];
@@ -2377,6 +2477,9 @@
                 return '';
             }
         };
+        Builder.prototype._preloadMaterials = function (schema) {
+            this._variationHelper.preloadVariations(schema, this._decos.map(function (d) { return d.gameObjectName; }));
+        };
         Builder.prototype._setInstanceId = function (sku, instanceId, goodId) {
             return __awaiter(this, void 0, void 0, function () {
                 var result;
@@ -2470,6 +2573,7 @@
                             obj.visible = false; // no need to render visualy
                             this._scene.add(obj);
                             connected = false;
+                            this._log('build main model');
                             for (i = 0, len = adjustables.length; i < len; i++) {
                                 adjustable = this._createAdjustable(obj, adjustables[i]);
                                 if (adjustable) {
@@ -2487,14 +2591,19 @@
                                     console.warn('No connection found for: ', adjustable.name);
                                 }
                             }
+                            this._log('place addables');
                             this._placeAddables(obj);
+                            this._log('update pivot');
                             this._updatePivot(obj);
+                            this._log('load variations');
                             return [4 /*yield*/, this._loadVariations(obj)];
                         case 1:
                             _a.sent();
                             // this._variationHelper.clearCache();
+                            this._log('remove from scene');
                             this._scene.remove(obj);
                             ObjectUtils.DisposeObject(this._source);
+                            this._log('ready!');
                             return [2 /*return*/, obj];
                         case 2: throw 'No adjustables found!';
                     }
@@ -2794,16 +2903,22 @@
             return __awaiter(this, void 0, void 0, function () {
                 return __generator(this, function (_a) {
                     switch (_a.label) {
-                        case 0: return [4 /*yield*/, this._variationHelper.loadPart(obj, this._adjustables, true)];
+                        case 0:
+                            this._log('load variation for parts');
+                            return [4 /*yield*/, this._variationHelper.loadPart(obj, this._adjustables, true)];
                         case 1:
                             _a.sent();
+                            this._log('load variation for adjustables');
                             return [4 /*yield*/, this._variationHelper.loadVariation(obj, this._adjustables, true)];
                         case 2:
                             _a.sent();
+                            this._log('load variation for addables');
                             return [4 /*yield*/, this._variationHelper.loadVariation(obj, this._addables, true)];
                         case 3:
                             _a.sent();
+                            this._log('load variation clear cache');
                             this._variationHelper.clearCache();
+                            this._log('load variations done');
                             return [2 /*return*/];
                     }
                 });
@@ -2832,6 +2947,12 @@
             this._addables.length = 0;
             this._prepareTheSelections();
         };
+        Builder.prototype._log = function (message) {
+            if (this.debug) {
+                this.debug(message);
+                console.log(new Date(), message);
+            }
+        };
         return Builder;
     }());
     Builder.ɵprov = i0__namespace.ɵɵdefineInjectable({ factory: function Builder_Factory() { return new Builder(); }, token: Builder, providedIn: "root" });