@configuratorware/configurator-frontendgui 1.44.10 → 1.45.0

package/App/Modules/Designer/Containers/ImageEditDialog.js

@@ -469,7 +469,7 @@ var ImageEditDialogContainer = exports.ImageEditDialogContainer = /*#__PURE__*/f
     });
     _defineProperty(_assertThisInitialized(_this), "onSelectImage", /*#__PURE__*/function () {
       var _ref7 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee7(file) {
-        var addGalleryImageToUserImages, imageUrl, thumbUrl, fileName, vectorizeColorsMap;
+        var addGalleryImageToUserImages, imageUrl, thumbUrl, fileName, vectorizeColorsMap, svgImageSize;
         return _regeneratorRuntime().wrap(function _callee7$(_context7) {
           while (1) switch (_context7.prev = _context7.next) {
             case 0:
@@ -481,11 +481,15 @@ var ImageEditDialogContainer = exports.ImageEditDialogContainer = /*#__PURE__*/f
               return _ServiceLocator.Services.designData.getGalleryImageColors(imageUrl);
             case 5:
               vectorizeColorsMap = _context7.sent;
-              addGalleryImageToUserImages(imageUrl, thumbUrl, fileName, vectorizeColorsMap);
+              _context7.next = 8;
+              return _ServiceLocator.Services.designData.getSVGImageSize(imageUrl);
+            case 8:
+              svgImageSize = _context7.sent;
+              addGalleryImageToUserImages(imageUrl, thumbUrl, fileName, vectorizeColorsMap, svgImageSize);
 
               // exit image upload if a gallery image is selected
               _this.setUpload(null);
-            case 8:
+            case 11:
             case "end":
               return _context7.stop();
           }
@@ -930,8 +934,8 @@ var mapDispatchToProps = function mapDispatchToProps(dispatch) {
     setSelectedImage: function setSelectedImage(identifier) {
       return dispatch((0, _Actions.setSelectedImageByIdentifier)(identifier));
     },
-    addGalleryImageToUserImages: function addGalleryImageToUserImages(imageUrl, thumbUrl, fileName, vectorizeColorsMap) {
-      return dispatch((0, _Actions.addGalleryImageToUserImages)(imageUrl, thumbUrl, fileName, vectorizeColorsMap));
+    addGalleryImageToUserImages: function addGalleryImageToUserImages(imageUrl, thumbUrl, fileName, vectorizeColorsMap, svgImageSize) {
+      return dispatch((0, _Actions.addGalleryImageToUserImages)(imageUrl, thumbUrl, fileName, vectorizeColorsMap, svgImageSize));
     },
     shouldAddImageImmediately: function shouldAddImageImmediately(imageData) {
       return (0, _Selectors3.isImageReadyToBeAdded)(_ServiceLocator.Services.store.state, imageData);

package/App/Reducers/Configurator/Actions.js

@@ -85,12 +85,11 @@ var receiveConfiguration = exports.receiveConfiguration = function receiveConfig
   var checkValidation = _ref.checkValidation;
   return /*#__PURE__*/function () {
     var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(dispatch, getState) {
-      var prevState, selectOptions, action, _getState, configurator, configuration, selectedoptionclassification, loadIdentifier, _getAvailableConfigur, designerEnabled, initialDesignData;
+      var prevState, action, _getState, configurator, configuration, selectedoptionclassification, loadIdentifier, _getAvailableConfigur, designerEnabled, initialDesignData;
       return _regeneratorRuntime().wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
           case 0:
             prevState = getState();
-            selectOptions = (0, _configuration.getConf)('selectOptions');
             dispatch(setCalculationEnabled(false));
             if (checkValidation) {
               dispatch(inspectValidationResults(json));
@@ -100,9 +99,6 @@ var receiveConfiguration = exports.receiveConfiguration = function receiveConfig
               data: (0, _Modifiers.patchViewImages)(json),
               receivedAt: Date.now()
             });
-            if (selectOptions) {
-              dispatch(selectMultipleOptions(selectOptions));
-            }
             dispatch(inspectCheckResults());
             _getState = getState(), configurator = _getState.configurator;
             configuration = configurator.configuration, selectedoptionclassification = configurator.selectedoptionclassification, loadIdentifier = configurator.loadIdentifier;
@@ -126,25 +122,25 @@ var receiveConfiguration = exports.receiveConfiguration = function receiveConfig
             applyVariantAmountPreSelection(configurator);
             setDefaultSelectedVariantIdentifier((0, _Selectors.getConfigurator)(getState()), loadIdentifier);
             if (!designerEnabled) {
-              _context.next = 26;
+              _context.next = 24;
               break;
             }
-            _context.next = 21;
+            _context.next = 19;
             return dispatch((0, _Actions3.fetchFonts)());
-          case 21:
+          case 19:
             dispatch((0, _Actions5.addCustomFonts)((0, _Selectors3.getUsedCustomFontsInEditor)(getState())));
-            _context.next = 24;
+            _context.next = 22;
             return dispatch(loadDesignerData((0, _Selectors.getConfiguration)((0, _Selectors.getConfigurator)(getState()))));
-          case 24:
+          case 22:
             initialDesignData = (0, _Transformers.createInitialDesignDataFromDesignAreas)((0, _get["default"])(getState(), 'designArea.filteredDesignAreas') || [], (0, _Reducer.getDesignData)((0, _Selectors.getConfigurator)(getState())));
             dispatch((0, _Actions6.setInitialDesignData)(initialDesignData));
-          case 26:
+          case 24:
             // enable calculation and trigger it
             dispatch(setCalculationEnabled(true));
             dispatch(invalidateCalculation());
             dispatch(doCalculation((0, _Selectors.getConfiguration)((0, _Selectors.getConfigurator)(getState()))));
             return _context.abrupt("return", action);
-          case 30:
+          case 28:
           case "end":
             return _context.stop();
         }
@@ -512,7 +508,13 @@ var inspectValidationResults = exports.inspectValidationResults = function inspe
   };
 };
 var fetchConfiguration = exports.fetchConfiguration = function fetchConfiguration(itemidentifier) {
-  return apiActions.fetchData('configuration/loadbyitemidentifier/' + itemidentifier, receiveConfiguration);
+  var selectOptions = (0, _configuration.getConf)('selectOptions');
+  var urlToCall = "configuration/loadbyitemidentifier/".concat(itemidentifier);
+  if (selectOptions) {
+    var switchOptionData = JSON.stringify(getSwitchOptionData(selectOptions));
+    urlToCall = "".concat(urlToCall, "?_switch_options=").concat(switchOptionData);
+  }
+  return apiActions.fetchData(urlToCall, receiveConfiguration);
 };
 var fetchConfigurationByCode = exports.fetchConfigurationByCode = function fetchConfigurationByCode(code) {
   var checkValidation = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
@@ -845,30 +847,34 @@ var applyOptionInputText = exports.applyOptionInputText = function applyOptionIn
 var selectMultipleOptions = exports.selectMultipleOptions = function selectMultipleOptions(optionsList) {
   return function (dispatch, getState) {
     var configuration = (0, _Selectors.getConfiguration)((0, _Selectors.getConfigurator)(getState()));
-    var switchOptionData = {};
-    var _iterator4 = _createForOfIteratorHelper(optionsList),
-      _step4;
-    try {
-      for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {
-        var component = _step4.value;
-        switchOptionData[component.identifier] = component.selectedoptions.map(function (_ref5) {
-          var identifier = _ref5.identifier,
-            amount = _ref5.amount;
-          return {
-            identifier: identifier,
-            amount: typeof amount === 'undefined' ? 1 : amount,
-            check_results: null
-          };
-        });
-      }
-    } catch (err) {
-      _iterator4.e(err);
-    } finally {
-      _iterator4.f();
-    }
+    var switchOptionData = getSwitchOptionData(optionsList);
     return dispatch(switchOptions(configuration, switchOptionData, false, false, true));
   };
 };
+var getSwitchOptionData = function getSwitchOptionData(optionsList) {
+  var switchOptionData = {};
+  var _iterator4 = _createForOfIteratorHelper(optionsList),
+    _step4;
+  try {
+    for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {
+      var component = _step4.value;
+      switchOptionData[component.identifier] = component.selectedoptions.map(function (_ref5) {
+        var identifier = _ref5.identifier,
+          amount = _ref5.amount;
+        return {
+          identifier: identifier,
+          amount: typeof amount === 'undefined' ? 1 : amount,
+          check_results: null
+        };
+      });
+    }
+  } catch (err) {
+    _iterator4.e(err);
+  } finally {
+    _iterator4.f();
+  }
+  return switchOptionData;
+};
 var viewOptionDetails = exports.viewOptionDetails = function viewOptionDetails(option) {
   return function (dispatch, getState) {
     if (!option) {

package/App/Reducers/ImageGallery/Actions.js

@@ -224,7 +224,7 @@ var commitChanges = exports.commitChanges = function commitChanges() {
     });
   };
 };
-var addGalleryImageToUserImages = exports.addGalleryImageToUserImages = function addGalleryImageToUserImages(imageUrl, thumbUrl, fileName, vectorizeColorsMap) {
+var addGalleryImageToUserImages = exports.addGalleryImageToUserImages = function addGalleryImageToUserImages(imageUrl, thumbUrl, fileName, vectorizeColorsMap, svgImageSize) {
   return function (dispatch, getState) {
     var compatibilityInfoHash = (0, _Selectors2.getCurrentCompatibilityInfoHash)(getState());
     return dispatch({
@@ -233,7 +233,8 @@ var addGalleryImageToUserImages = exports.addGalleryImageToUserImages = function
       thumbUrl: thumbUrl,
       fileName: fileName,
       vectorizeColorsMap: vectorizeColorsMap,
-      compatibilityInfoHash: compatibilityInfoHash
+      compatibilityInfoHash: compatibilityInfoHash,
+      svgImageSize: svgImageSize
     });
   };
 };

package/App/Reducers/ImageGallery/Modifiers.js

@@ -6,6 +6,12 @@ Object.defineProperty(exports, "__esModule", {
 exports.generateImageId = exports.createTextPlaceholder = exports.createSVGImageData = void 0;
 var _v = _interopRequireDefault(require("uuid/v4"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 var createTextPlaceholder = exports.createTextPlaceholder = function createTextPlaceholder(content) {
   return "<span data-placeholder=\"true\">".concat(content, "</span>");
 };
@@ -22,25 +28,26 @@ var createSVGImageData = exports.createSVGImageData = function createSVGImageDat
     _options$galleryImage = options.galleryImage,
     galleryImage = _options$galleryImage === void 0 ? true : _options$galleryImage,
     _options$isPlaceHolde = options.isPlaceHolderImage,
-    isPlaceHolderImage = _options$isPlaceHolde === void 0 ? false : _options$isPlaceHolde;
+    isPlaceHolderImage = _options$isPlaceHolde === void 0 ? false : _options$isPlaceHolde,
+    _options$svgImageSize = options.svgImageSize,
+    svgImageSize = _options$svgImageSize === void 0 ? {
+      width: 290,
+      height: 290
+    } : _options$svgImageSize;
   return {
     fileName: fileName,
     identifier: generateImageId(),
     originalFileName: imageUrl,
-    original: {
+    original: _objectSpread({
       url: null,
       format: 'SVG',
-      mimeType: 'image/svg+xml',
-      width: 290,
-      height: 290
-    },
-    preview: {
+      mimeType: 'image/svg+xml'
+    }, svgImageSize),
+    preview: _objectSpread({
       url: imageUrl,
       format: 'SVG',
-      mimeType: 'image/svg+xml',
-      width: 290,
-      height: 290
-    },
+      mimeType: 'image/svg+xml'
+    }, svgImageSize),
     thumbnail: {
       url: thumbUrl,
       format: 'PNG',

package/App/Reducers/ImageGallery/Reducer.js

@@ -231,11 +231,13 @@ function imageGalleryReducer() {
           thumbUrl = action.thumbUrl,
           _fileName2 = action.fileName,
           vectorizeColorsMap = action.vectorizeColorsMap,
-          _compatibilityInfoHash = action.compatibilityInfoHash;
+          _compatibilityInfoHash = action.compatibilityInfoHash,
+          svgImageSize = action.svgImageSize;
         var _image = (0, _Modifiers.createSVGImageData)({
           imageUrl: imageUrl,
           thumbUrl: thumbUrl,
           fileName: _fileName2,
+          svgImageSize: svgImageSize,
           operations: {
             vectorizeColorsMap: vectorizeColorsMap
           }

package/App/Services/DesignDataService.js

@@ -2473,6 +2473,56 @@ var DesignDataService = exports["default"] = /*#__PURE__*/function () {
       }
       return getGalleryImageColors;
     }()
+  }, {
+    key: "getSVGImageSize",
+    value: function () {
+      var _getSVGImageSize = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee33(url) {
+        var _svgContent$match, _svgContent$match2, _svgContent$match3, _svgTag$match;
+        var svgContent, svgTag, width, height, viewBoxValues;
+        return _regeneratorRuntime().wrap(function _callee33$(_context34) {
+          while (1) switch (_context34.prev = _context34.next) {
+            case 0:
+              _context34.next = 2;
+              return getSvgContent(url);
+            case 2:
+              svgContent = _context34.sent;
+              svgTag = (_svgContent$match = svgContent.match(/<svg[^>]+>/)) === null || _svgContent$match === void 0 ? void 0 : _svgContent$match[0];
+              width = (_svgContent$match2 = svgContent.match(/width="([^"]+)"/)) === null || _svgContent$match2 === void 0 ? void 0 : _svgContent$match2[1];
+              height = (_svgContent$match3 = svgContent.match(/height="([^"]+)"/)) === null || _svgContent$match3 === void 0 ? void 0 : _svgContent$match3[1];
+              if (!(width && height)) {
+                _context34.next = 8;
+                break;
+              }
+              return _context34.abrupt("return", {
+                width: parseFloat(width),
+                height: parseFloat(height)
+              });
+            case 8:
+              viewBoxValues = (_svgTag$match = svgTag.match(/viewBox="([^"]+)"/)) === null || _svgTag$match === void 0 || (_svgTag$match = _svgTag$match[1]) === null || _svgTag$match === void 0 ? void 0 : _svgTag$match.split(' ');
+              if (!(viewBoxValues.length === 4)) {
+                _context34.next = 11;
+                break;
+              }
+              return _context34.abrupt("return", {
+                width: parseFloat(viewBoxValues[2]),
+                height: parseFloat(viewBoxValues[3])
+              });
+            case 11:
+              return _context34.abrupt("return", {
+                width: 300,
+                height: 300
+              });
+            case 12:
+            case "end":
+              return _context34.stop();
+          }
+        }, _callee33);
+      }));
+      function getSVGImageSize(_x36) {
+        return _getSVGImageSize.apply(this, arguments);
+      }
+      return getSVGImageSize;
+    }()
   }, {
     key: "updateDesignAreaImagesWithSelectedImageData",
     value: function updateDesignAreaImagesWithSelectedImageData() {
@@ -2493,34 +2543,34 @@ var DesignDataService = exports["default"] = /*#__PURE__*/function () {
   }, {
     key: "editFileQueued",
     value: function () {
-      var _editFileQueued = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee33(operations, image) {
+      var _editFileQueued = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee34(operations, image) {
         var options,
           releaseLock,
-          _args34 = arguments;
-        return _regeneratorRuntime().wrap(function _callee33$(_context34) {
-          while (1) switch (_context34.prev = _context34.next) {
+          _args35 = arguments;
+        return _regeneratorRuntime().wrap(function _callee34$(_context35) {
+          while (1) switch (_context35.prev = _context35.next) {
             case 0:
-              options = _args34.length > 2 && _args34[2] !== undefined ? _args34[2] : {};
-              _context34.next = 3;
+              options = _args35.length > 2 && _args35[2] !== undefined ? _args35[2] : {};
+              _context35.next = 3;
               return (0, _ObjectLock.requestLock)(this);
             case 3:
-              releaseLock = _context34.sent;
-              _context34.prev = 4;
-              _context34.next = 7;
+              releaseLock = _context35.sent;
+              _context35.prev = 4;
+              _context35.next = 7;
               return this.editFile(operations, image, options);
             case 7:
-              return _context34.abrupt("return", _context34.sent);
+              return _context35.abrupt("return", _context35.sent);
             case 8:
-              _context34.prev = 8;
+              _context35.prev = 8;
               releaseLock();
-              return _context34.finish(8);
+              return _context35.finish(8);
             case 11:
             case "end":
-              return _context34.stop();
+              return _context35.stop();
           }
-        }, _callee33, this, [[4,, 8, 11]]);
+        }, _callee34, this, [[4,, 8, 11]]);
       }));
-      function editFileQueued(_x36, _x37) {
+      function editFileQueued(_x37, _x38) {
         return _editFileQueued.apply(this, arguments);
       }
       return editFileQueued;
@@ -2528,7 +2578,7 @@ var DesignDataService = exports["default"] = /*#__PURE__*/function () {
   }, {
     key: "editFile",
     value: function () {
-      var _editFile = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee34(operations, image) {
+      var _editFile = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee35(operations, image) {
         var options,
           _options$immediateCom,
           immediateCommit,
@@ -2562,11 +2612,11 @@ var DesignDataService = exports["default"] = /*#__PURE__*/function () {
           vectorizeOriginalColorsMap,
           numberOfAggregatedColors,
           numberOfColorsToRemove,
-          _args35 = arguments;
-        return _regeneratorRuntime().wrap(function _callee34$(_context35) {
-          while (1) switch (_context35.prev = _context35.next) {
+          _args36 = arguments;
+        return _regeneratorRuntime().wrap(function _callee35$(_context36) {
+          while (1) switch (_context36.prev = _context36.next) {
             case 0:
-              options = _args35.length > 2 && _args35[2] !== undefined ? _args35[2] : {};
+              options = _args36.length > 2 && _args36[2] !== undefined ? _args36[2] : {};
               // patch operations to keep other unchanged values
               operations = _objectSpread(_objectSpread({}, image.operations), operations);
               _options$immediateCom = options.immediateCommit, immediateCommit = _options$immediateCom === void 0 ? false : _options$immediateCom, _options$designProduc = options.designProductionMethod, designProductionMethod = _options$designProduc === void 0 ? (0, _Selectors.getSelectedDesignProductionMethod)(_ServiceLocator.Services.store.state) : _options$designProduc, _options$addMode = options.addMode, addMode = _options$addMode === void 0 ? false : _options$addMode, displayColorPreview = options.displayColorPreview;
@@ -2585,7 +2635,7 @@ var DesignDataService = exports["default"] = /*#__PURE__*/function () {
                 displayColorPreview: displayColorPreview
               });
               if (!(!operationsMatching || !imageIsCompatible)) {
-                _context35.next = 29;
+                _context36.next = 29;
                 break;
               }
               if (!image.operations) {
@@ -2593,13 +2643,13 @@ var DesignDataService = exports["default"] = /*#__PURE__*/function () {
               }
               operations = makeOperationsCompatible(operations, compatibilityInfoHash, designProductionMethod.colorPalettes);
               if (!image.gallery) {
-                _context35.next = 18;
+                _context36.next = 18;
                 break;
               }
               operations = _objectSpread(_objectSpread({}, operations || {}), {}, {
                 vectorizeColorsMap: operations.vectorizeColorsMap
               });
-              _context35.next = 29;
+              _context36.next = 29;
               break;
             case 18:
               _getImageUsageInfo = (0, _Selectors2.getImageUsageInfo)(_ServiceLocator.Services.store.state, image.identifier), designAreas = _getImageUsageInfo.designAreas, count = _getImageUsageInfo.count;
@@ -2608,10 +2658,10 @@ var DesignDataService = exports["default"] = /*#__PURE__*/function () {
               currentEditData = (0, _Modifiers.getEditDataFromOperations)(image.fileName, image.operations || {}, designProductionMethod);
               isBackendNeeded = createCopy || !(0, _isEqual["default"])(editData, currentEditData);
               if (!isBackendNeeded) {
-                _context35.next = 29;
+                _context36.next = 29;
                 break;
               }
-              _context35.next = 26;
+              _context36.next = 26;
               return _ServiceLocator.Services.store.dispatch((0, _Actions2.editImage)(_objectSpread(_objectSpread({}, editData), {}, {
                 createCopy: createCopy
               }), _objectSpread(_objectSpread({}, imageDataPatch), {}, {
@@ -2627,20 +2677,20 @@ var DesignDataService = exports["default"] = /*#__PURE__*/function () {
               imageIdentifier = (0, _get2["default"])(selectedImage, 'identifier');
             case 29:
               if (!(!preview || !preview.url)) {
-                _context35.next = 31;
+                _context36.next = 31;
                 break;
               }
               throw new Error('Preview image url is not specified!');
             case 31:
               if (!(0, _Selectors2.isEditableVectorImage)(preview)) {
-                _context35.next = 40;
+                _context36.next = 40;
                 break;
               }
               _designProductionMethod = (0, _Selectors.getSelectedDesignProductionMethod)(_ServiceLocator.Services.store.state);
-              _context35.next = 35;
+              _context36.next = 35;
               return getSvgContent(preview.url, false, !operationsMatching);
             case 35:
-              svgContent = _context35.sent;
+              svgContent = _context36.sent;
               svgColors = getSvgColors(svgContent, _designProductionMethod);
               vectorizeColorsMap = (0, _Modifiers.createVectorizeColorsMap)(operations.vectorizeColorsMap, svgColors);
               thresholdChanged = operations.vectorizeThreshold !== (0, _get2["default"])(image, 'operations.vectorizeThreshold', 0); // prepare initial values for the vectorize feature
@@ -2678,7 +2728,7 @@ var DesignDataService = exports["default"] = /*#__PURE__*/function () {
               if (immediateCommit) {
                 this.updateDesignAreaImagesWithSelectedImageData(image.identifier);
               }
-              return _context35.abrupt("return", {
+              return _context36.abrupt("return", {
                 vectorizeColorsMap: operations.vectorizeColorsMap,
                 vectorizeThreshold: operations.vectorizeThreshold,
                 vectorizeMaxColorAmount: operations.vectorizeMaxColorAmount,
@@ -2686,11 +2736,11 @@ var DesignDataService = exports["default"] = /*#__PURE__*/function () {
               });
             case 43:
             case "end":
-              return _context35.stop();
+              return _context36.stop();
           }
-        }, _callee34, this);
+        }, _callee35, this);
       }));
-      function editFile(_x38, _x39) {
+      function editFile(_x39, _x40) {
         return _editFile.apply(this, arguments);
       }
       return editFile;
@@ -2698,10 +2748,10 @@ var DesignDataService = exports["default"] = /*#__PURE__*/function () {
   }, {
     key: "resetEditedFile",
     value: function () {
-      var _resetEditedFile = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee35(image) {
+      var _resetEditedFile = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee36(image) {
         var state, _image, operations, vectorizeColorsMap, resetOperations, designProductionMethod;
-        return _regeneratorRuntime().wrap(function _callee35$(_context36) {
-          while (1) switch (_context36.prev = _context36.next) {
+        return _regeneratorRuntime().wrap(function _callee36$(_context37) {
+          while (1) switch (_context37.prev = _context37.next) {
             case 0:
               state = _ServiceLocator.Services.store.state;
               if (!image) {
@@ -2720,17 +2770,17 @@ var DesignDataService = exports["default"] = /*#__PURE__*/function () {
                   vectorizeThreshold: null
                 });
               }
-              _context36.next = 7;
+              _context37.next = 7;
               return this.editFileQueued(resetOperations, image);
             case 7:
-              return _context36.abrupt("return", _context36.sent);
+              return _context37.abrupt("return", _context37.sent);
             case 8:
             case "end":
-              return _context36.stop();
+              return _context37.stop();
           }
-        }, _callee35, this);
+        }, _callee36, this);
       }));
-      function resetEditedFile(_x40) {
+      function resetEditedFile(_x41) {
         return _resetEditedFile.apply(this, arguments);
       }
       return resetEditedFile;

package/App/Services/VisualizationService.js

@@ -339,6 +339,9 @@ var VisualizationService = exports["default"] = /*#__PURE__*/function (_Abstract
       component.observable.on(_Constants.EventTypes.Error, function () {
         _ServiceLocator.Services.ui.reportError((0, _i18n.t)('visualization.errors.visualizationNotPossible'));
       });
+      component.observable.on(_Constants.EventTypes.EmptySceneError, function () {
+        _ServiceLocator.Services.ui.reportError((0, _i18n.t)('visualization.errors.visualizationNotPossible'));
+      });
 
       // in dev mode expose the three object to the window
       if (!(0, _configuration.isProduction)()) {

package/App/Translations.js

@@ -10,38 +10,37 @@ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" ==
 function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return e; }; var t, e = {}, r = Object.prototype, n = r.hasOwnProperty, o = Object.defineProperty || function (t, e, r) { t[e] = r.value; }, i = "function" == typeof Symbol ? Symbol : {}, a = i.iterator || "@@iterator", c = i.asyncIterator || "@@asyncIterator", u = i.toStringTag || "@@toStringTag"; function define(t, e, r) { return Object.defineProperty(t, e, { value: r, enumerable: !0, configurable: !0, writable: !0 }), t[e]; } try { define({}, ""); } catch (t) { define = function define(t, e, r) { return t[e] = r; }; } function wrap(t, e, r, n) { var i = e && e.prototype instanceof Generator ? e : Generator, a = Object.create(i.prototype), c = new Context(n || []); return o(a, "_invoke", { value: makeInvokeMethod(t, r, c) }), a; } function tryCatch(t, e, r) { try { return { type: "normal", arg: t.call(e, r) }; } catch (t) { return { type: "throw", arg: t }; } } e.wrap = wrap; var h = "suspendedStart", l = "suspendedYield", f = "executing", s = "completed", y = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var p = {}; define(p, a, function () { return this; }); var d = Object.getPrototypeOf, v = d && d(d(values([]))); v && v !== r && n.call(v, a) && (p = v); var g = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(p); function defineIteratorMethods(t) { ["next", "throw", "return"].forEach(function (e) { define(t, e, function (t) { return this._invoke(e, t); }); }); } function AsyncIterator(t, e) { function invoke(r, o, i, a) { var c = tryCatch(t[r], t, o); if ("throw" !== c.type) { var u = c.arg, h = u.value; return h && "object" == _typeof(h) && n.call(h, "__await") ? e.resolve(h.__await).then(function (t) { invoke("next", t, i, a); }, function (t) { invoke("throw", t, i, a); }) : e.resolve(h).then(function (t) { u.value = t, i(u); }, function (t) { return invoke("throw", t, i, a); }); } a(c.arg); } var r; o(this, "_invoke", { value: function value(t, n) { function callInvokeWithMethodAndArg() { return new e(function (e, r) { invoke(t, n, e, r); }); } return r = r ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(e, r, n) { var o = h; return function (i, a) { if (o === f) throw new Error("Generator is already running"); if (o === s) { if ("throw" === i) throw a; return { value: t, done: !0 }; } for (n.method = i, n.arg = a;;) { var c = n.delegate; if (c) { var u = maybeInvokeDelegate(c, n); if (u) { if (u === y) continue; return u; } } if ("next" === n.method) n.sent = n._sent = n.arg;else if ("throw" === n.method) { if (o === h) throw o = s, n.arg; n.dispatchException(n.arg); } else "return" === n.method && n.abrupt("return", n.arg); o = f; var p = tryCatch(e, r, n); if ("normal" === p.type) { if (o = n.done ? s : l, p.arg === y) continue; return { value: p.arg, done: n.done }; } "throw" === p.type && (o = s, n.method = "throw", n.arg = p.arg); } }; } function maybeInvokeDelegate(e, r) { var n = r.method, o = e.iterator[n]; if (o === t) return r.delegate = null, "throw" === n && e.iterator["return"] && (r.method = "return", r.arg = t, maybeInvokeDelegate(e, r), "throw" === r.method) || "return" !== n && (r.method = "throw", r.arg = new TypeError("The iterator does not provide a '" + n + "' method")), y; var i = tryCatch(o, e.iterator, r.arg); if ("throw" === i.type) return r.method = "throw", r.arg = i.arg, r.delegate = null, y; var a = i.arg; return a ? a.done ? (r[e.resultName] = a.value, r.next = e.nextLoc, "return" !== r.method && (r.method = "next", r.arg = t), r.delegate = null, y) : a : (r.method = "throw", r.arg = new TypeError("iterator result is not an object"), r.delegate = null, y); } function pushTryEntry(t) { var e = { tryLoc: t[0] }; 1 in t && (e.catchLoc = t[1]), 2 in t && (e.finallyLoc = t[2], e.afterLoc = t[3]), this.tryEntries.push(e); } function resetTryEntry(t) { var e = t.completion || {}; e.type = "normal", delete e.arg, t.completion = e; } function Context(t) { this.tryEntries = [{ tryLoc: "root" }], t.forEach(pushTryEntry, this), this.reset(!0); } function values(e) { if (e || "" === e) { var r = e[a]; if (r) return r.call(e); if ("function" == typeof e.next) return e; if (!isNaN(e.length)) { var o = -1, i = function next() { for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = !1, next; return next.value = t, next.done = !0, next; }; return i.next = i; } } throw new TypeError(_typeof(e) + " is not iterable"); } return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), o(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, u, "GeneratorFunction"), e.isGeneratorFunction = function (t) { var e = "function" == typeof t && t.constructor; return !!e && (e === GeneratorFunction || "GeneratorFunction" === (e.displayName || e.name)); }, e.mark = function (t) { return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, define(t, u, "GeneratorFunction")), t.prototype = Object.create(g), t; }, e.awrap = function (t) { return { __await: t }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, c, function () { return this; }), e.AsyncIterator = AsyncIterator, e.async = function (t, r, n, o, i) { void 0 === i && (i = Promise); var a = new AsyncIterator(wrap(t, r, n, o), i); return e.isGeneratorFunction(r) ? a : a.next().then(function (t) { return t.done ? t.value : a.next(); }); }, defineIteratorMethods(g), define(g, u, "Generator"), define(g, a, function () { return this; }), define(g, "toString", function () { return "[object Generator]"; }), e.keys = function (t) { var e = Object(t), r = []; for (var n in e) r.push(n); return r.reverse(), function next() { for (; r.length;) { var t = r.pop(); if (t in e) return next.value = t, next.done = !1, next; } return next.done = !0, next; }; }, e.values = values, Context.prototype = { constructor: Context, reset: function reset(e) { if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = "next", this.arg = t, this.tryEntries.forEach(resetTryEntry), !e) for (var r in this) "t" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t); }, stop: function stop() { this.done = !0; var t = this.tryEntries[0].completion; if ("throw" === t.type) throw t.arg; return this.rval; }, dispatchException: function dispatchException(e) { if (this.done) throw e; var r = this; function handle(n, o) { return a.type = "throw", a.arg = e, r.next = n, o && (r.method = "next", r.arg = t), !!o; } for (var o = this.tryEntries.length - 1; o >= 0; --o) { var i = this.tryEntries[o], a = i.completion; if ("root" === i.tryLoc) return handle("end"); if (i.tryLoc <= this.prev) { var c = n.call(i, "catchLoc"), u = n.call(i, "finallyLoc"); if (c && u) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } else if (c) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); } else { if (!u) throw new Error("try statement without catch or finally"); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } } } }, abrupt: function abrupt(t, e) { for (var r = this.tryEntries.length - 1; r >= 0; --r) { var o = this.tryEntries[r]; if (o.tryLoc <= this.prev && n.call(o, "finallyLoc") && this.prev < o.finallyLoc) { var i = o; break; } } i && ("break" === t || "continue" === t) && i.tryLoc <= e && e <= i.finallyLoc && (i = null); var a = i ? i.completion : {}; return a.type = t, a.arg = e, i ? (this.method = "next", this.next = i.finallyLoc, y) : this.complete(a); }, complete: function complete(t, e) { if ("throw" === t.type) throw t.arg; return "break" === t.type || "continue" === t.type ? this.next = t.arg : "return" === t.type ? (this.rval = this.arg = t.arg, this.method = "return", this.next = "end") : "normal" === t.type && e && (this.next = e), y; }, finish: function finish(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.finallyLoc === t) return this.complete(r.completion, r.afterLoc), resetTryEntry(r), y; } }, "catch": function _catch(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.tryLoc === t) { var n = r.completion; if ("throw" === n.type) { var o = n.arg; resetTryEntry(r); } return o; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(e, r, n) { return this.delegate = { iterator: values(e), resultName: r, nextLoc: n }, "next" === this.method && (this.arg = t), y; } }, e; }
 function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
 function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
-function initLanguage(_x) {
+function initLanguage(_x, _x2) {
   return _initLanguage.apply(this, arguments);
 }
 function _initLanguage() {
-  _initLanguage = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(lang) {
-    var fileKey, langKey, cachedTranslationsDomain, results;
+  _initLanguage = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(lang, baseURL) {
+    var fileKey, langKey, results;
     return _regeneratorRuntime().wrap(function _callee$(_context) {
       while (1) switch (_context.prev = _context.next) {
         case 0:
           // ensure that the filename always has an underscore and no dash
           fileKey = lang.replace('-', '_');
           langKey = lang.substring(0, 2);
-          cachedTranslationsDomain = 'messages.';
           if (!(0, _configuration.isProduction)()) {
-            _context.next = 9;
+            _context.next = 8;
             break;
           }
-          _context.next = 6;
-          return Promise.all([loadLanguageJson('/translations_cached/' + cachedTranslationsDomain + fileKey + '.json', langKey)]);
-        case 6:
+          _context.next = 5;
+          return Promise.all([loadLanguageJson("".concat(baseURL, "translations/frontend/").concat(fileKey), langKey)]);
+        case 5:
           _context.t0 = _context.sent;
-          _context.next = 12;
-          break;
-        case 9:
           _context.next = 11;
+          break;
+        case 8:
+          _context.next = 10;
           return Promise.all([loadLanguageJson('/translations/' + fileKey + '.json', langKey), loadLanguageJson('/translations_custom/' + fileKey + '.json', langKey)]);
-        case 11:
+        case 10:
           _context.t0 = _context.sent;
-        case 12:
+        case 11:
           results = _context.t0;
           results.forEach(_i18n.use);
-        case 14:
+        case 13:
         case "end":
           return _context.stop();
       }

package/App/configuration.js

@@ -397,7 +397,7 @@ function setLanguage() {
   }
   applicationConfiguration.language = language.replace('_', '-');
   _Api["default"].setLanguage(applicationConfiguration.language);
-  (0, _Translations.initLanguage)(applicationConfiguration.language);
+  (0, _Translations.initLanguage)(applicationConfiguration.language, applicationConfiguration.network.baseURL);
 }
 
 // backward compatibility alias

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@configuratorware/configurator-frontendgui",
-  "version": "1.44.10",
+  "version": "1.45.0",
   "license": "UNLICENSED",
   "private": false,
   "main": "./index.js",
   "dependencies": {
     "@babel/polyfill": "^7.12.1",
-    "@configuratorware/scripts": "1.44.10",
+    "@configuratorware/scripts": "1.45.0",
     "@material-ui/core": "^4.12.4",
     "@material-ui/icons": "^4.11.3",
     "@material-ui/lab": "^4.0.0-alpha.61",
@@ -36,8 +36,8 @@
     "react-router-dom": "^5.3.4",
     "react-swipeable": "^5.5.1",
     "react-zoom-pan-pinch": "^2.1.3",
-    "redhotmagma-graphics-editor": "1.44.10",
-    "redhotmagma-visualization": "1.44.10",
+    "redhotmagma-graphics-editor": "1.45.0",
+    "redhotmagma-visualization": "1.45.0",
     "redux": "^4.1.0",
     "redux-logger": "^3.0.6",
     "redux-persist": "^5.10.0",

package/src/App/Modules/Designer/Containers/ImageEditDialog.js

@@ -562,7 +562,9 @@ export class ImageEditDialogContainer extends React.Component {
 
         const vectorizeColorsMap = await Services.designData.getGalleryImageColors(imageUrl);
 
-        addGalleryImageToUserImages(imageUrl, thumbUrl, fileName, vectorizeColorsMap);
+        const svgImageSize = await Services.designData.getSVGImageSize(imageUrl);
+
+        addGalleryImageToUserImages(imageUrl, thumbUrl, fileName, vectorizeColorsMap, svgImageSize);
 
         // exit image upload if a gallery image is selected
         this.setUpload(null);
@@ -864,8 +866,8 @@ const mapDispatchToProps = dispatch => ({
             ...options,
         }),
     setSelectedImage: identifier => dispatch(setSelectedImageByIdentifier(identifier)),
-    addGalleryImageToUserImages: (imageUrl, thumbUrl, fileName, vectorizeColorsMap) =>
-        dispatch(addGalleryImageToUserImages(imageUrl, thumbUrl, fileName, vectorizeColorsMap)),
+    addGalleryImageToUserImages: (imageUrl, thumbUrl, fileName, vectorizeColorsMap, svgImageSize) =>
+        dispatch(addGalleryImageToUserImages(imageUrl, thumbUrl, fileName, vectorizeColorsMap, svgImageSize)),
     shouldAddImageImmediately: imageData => isImageReadyToBeAdded(Services.store.state, imageData),
     isColorMappingCompatible: vectorizeColorsMap =>
         isColorMappingCompatible(

package/src/App/Reducers/Configurator/Actions.js

@@ -78,7 +78,6 @@ export const DELETE_SELECTED_AMOUNTS = 'DELETE_SELECTED_AMOUNTS';
 
 export const receiveConfiguration = (json, { checkValidation }) => async (dispatch, getState) => {
     const prevState = getState();
-    const selectOptions = getConf('selectOptions');
 
     dispatch(setCalculationEnabled(false));
 
@@ -92,10 +91,6 @@ export const receiveConfiguration = (json, { checkValidation }) => async (dispat
         receivedAt: Date.now(),
     });
 
-    if (selectOptions) {
-        dispatch(selectMultipleOptions(selectOptions));
-    }
-
     dispatch(inspectCheckResults());
 
     const { configurator } = getState();
@@ -462,7 +457,14 @@ export const inspectValidationResults = configuration => dispatch => {
 };
 
 export const fetchConfiguration = itemidentifier => {
-    return apiActions.fetchData('configuration/loadbyitemidentifier/' + itemidentifier, receiveConfiguration);
+    const selectOptions = getConf('selectOptions');
+    let urlToCall = `configuration/loadbyitemidentifier/${itemidentifier}`;
+    if (selectOptions) {
+        const switchOptionData = JSON.stringify(getSwitchOptionData(selectOptions));
+        urlToCall = `${urlToCall}?_switch_options=${switchOptionData}`;
+    }
+
+    return apiActions.fetchData(urlToCall, receiveConfiguration);
 };
 
 export const fetchConfigurationByCode = (code, checkValidation = true) => {
@@ -783,6 +785,11 @@ export const applyOptionInputText = optionClassification => (dispatch, getState)
 
 export const selectMultipleOptions = optionsList => (dispatch, getState) => {
     const configuration = getConfiguration(getConfigurator(getState()));
+    const switchOptionData = getSwitchOptionData(optionsList);
+    return dispatch(switchOptions(configuration, switchOptionData, false, false, true));
+};
+
+const getSwitchOptionData = optionsList => {
     const switchOptionData = {};
     for (const component of optionsList) {
         switchOptionData[component.identifier] = component.selectedoptions.map(({ identifier, amount }) => ({
@@ -791,7 +798,8 @@ export const selectMultipleOptions = optionsList => (dispatch, getState) => {
             check_results: null,
         }));
     }
-    return dispatch(switchOptions(configuration, switchOptionData, false, false, true));
+
+    return switchOptionData;
 };
 
 export const viewOptionDetails = option => (dispatch, getState) => {

package/src/App/Reducers/ImageGallery/Actions.js

@@ -182,10 +182,13 @@ export const commitChanges = () => (dispatch, getState) => {
     });
 };
 
-export const addGalleryImageToUserImages = (imageUrl, thumbUrl, fileName, vectorizeColorsMap) => (
-    dispatch,
-    getState
-) => {
+export const addGalleryImageToUserImages = (
+    imageUrl,
+    thumbUrl,
+    fileName,
+    vectorizeColorsMap,
+    svgImageSize
+) => (dispatch, getState) => {
     const compatibilityInfoHash = getCurrentCompatibilityInfoHash(getState());
     return dispatch({
         type: ADD_GALLERY_IMAGE_TO_USER_IMAGES,
@@ -194,6 +197,7 @@ export const addGalleryImageToUserImages = (imageUrl, thumbUrl, fileName, vector
         fileName,
         vectorizeColorsMap,
         compatibilityInfoHash,
+        svgImageSize,
     });
 };
 

package/src/App/Reducers/ImageGallery/Modifiers.js

@@ -12,6 +12,7 @@ export const createSVGImageData = (options = {}) => {
         operations = {},
         galleryImage = true,
         isPlaceHolderImage = false,
+        svgImageSize = { width: 290, height: 290 },
     } = options;
     return {
         fileName,
@@ -21,15 +22,13 @@ export const createSVGImageData = (options = {}) => {
             url: null,
             format: 'SVG',
             mimeType: 'image/svg+xml',
-            width: 290,
-            height: 290,
+            ...svgImageSize,
         },
         preview: {
             url: imageUrl,
             format: 'SVG',
             mimeType: 'image/svg+xml',
-            width: 290,
-            height: 290,
+            ...svgImageSize,
         },
         thumbnail: {
             url: thumbUrl,

package/src/App/Reducers/ImageGallery/Reducer.js

@@ -238,12 +238,20 @@ export function imageGalleryReducer(state = initialState, action = {}) {
             return result;
         }
         case actionTypes.ADD_GALLERY_IMAGE_TO_USER_IMAGES: {
-            const { imageUrl, thumbUrl, fileName, vectorizeColorsMap, compatibilityInfoHash } = action;
+            const {
+                imageUrl,
+                thumbUrl,
+                fileName,
+                vectorizeColorsMap,
+                compatibilityInfoHash,
+                svgImageSize,
+            } = action;
 
             const image = createSVGImageData({
                 imageUrl,
                 thumbUrl,
                 fileName,
+                svgImageSize,
                 operations: {
                     vectorizeColorsMap,
                 },

package/src/App/Reducers/ImageGallery/__tests__/Actions.test.js

@@ -280,12 +280,10 @@ describe('Reducers/ImageGallery/Actions', () => {
             },
         });
 
-        const action = addGalleryImageToUserImages(
-            imageUrl,
-            thumbUrl,
-            fileName,
-            vectorizeColorsMap
-        )(dispatch, getState);
+        const action = addGalleryImageToUserImages(imageUrl, thumbUrl, fileName, vectorizeColorsMap, {
+            width: 300,
+            height: 150,
+        })(dispatch, getState);
 
         expect(action).toEqual({
             type: ADD_GALLERY_IMAGE_TO_USER_IMAGES,
@@ -299,6 +297,7 @@ describe('Reducers/ImageGallery/Actions', () => {
                 vectorsRequired: true,
                 colorPalettes: ['default'],
             },
+            svgImageSize: { width: 300, height: 150 },
         });
     });
 

package/src/App/Services/DesignDataService.js

@@ -1895,6 +1895,30 @@ export default class DesignDataService {
         return createVectorizeColorsMap({}, getSvgColors(svgContent, designProductionMethod));
     }
 
+    async getSVGImageSize(url) {
+        const svgContent = await getSvgContent(url);
+        const svgTag = svgContent.match(/<svg[^>]+>/)?.[0];
+        const width = svgContent.match(/width="([^"]+)"/)?.[1];
+        const height = svgContent.match(/height="([^"]+)"/)?.[1];
+        if (width && height) {
+            return {
+                width: parseFloat(width),
+                height: parseFloat(height),
+            };
+        }
+        const viewBoxValues = svgTag.match(/viewBox="([^"]+)"/)?.[1]?.split(' ');
+        if (viewBoxValues.length === 4) {
+            return {
+                width: parseFloat(viewBoxValues[2]),
+                height: parseFloat(viewBoxValues[3]),
+            };
+        }
+        return {
+            width: 300,
+            height: 300,
+        };
+    }
+
     updateDesignAreaImagesWithSelectedImageData(originalImageIdentifier = '') {
         const imageIdentifier = get(Services.store.state, 'imageGallery.selectedImage.identifier');
         const newImage = find(Services.store.state.imageGallery.userImages, {

package/src/App/Services/VisualizationService.js

@@ -246,6 +246,10 @@ export default class VisualizationService extends AbstractVisualizationService {
             Services.ui.reportError(t('visualization.errors.visualizationNotPossible'));
         });
 
+        component.observable.on(VisualizationEventTypes.EmptySceneError, () => {
+            Services.ui.reportError(t('visualization.errors.visualizationNotPossible'));
+        });
+
         // in dev mode expose the three object to the window
         if (!isProduction()) {
             window.visualization = component;

package/src/App/Translations.js

@@ -1,18 +1,12 @@
 import { use } from 'Framework/i18n';
 import { isProduction } from './configuration';
-export async function initLanguage(lang) {
+export async function initLanguage(lang, baseURL) {
     // ensure that the filename always has an underscore and no dash
     const fileKey = lang.replace('-', '_');
     const langKey = lang.substring(0, 2);
-    const cachedTranslationsDomain = 'messages.';
 
     const results = isProduction()
-        ? await Promise.all([
-              loadLanguageJson(
-                  '/translations_cached/' + cachedTranslationsDomain + fileKey + '.json',
-                  langKey
-              ),
-          ])
+        ? await Promise.all([loadLanguageJson(`${baseURL}translations/frontend/${fileKey}`, langKey)])
         : await Promise.all([
               loadLanguageJson('/translations/' + fileKey + '.json', langKey),
               loadLanguageJson('/translations_custom/' + fileKey + '.json', langKey),

package/src/App/configuration.js

@@ -437,7 +437,7 @@ function setLanguage() {
     }
     applicationConfiguration.language = language.replace('_', '-');
     Api.setLanguage(applicationConfiguration.language);
-    initLanguage(applicationConfiguration.language);
+    initLanguage(applicationConfiguration.language, applicationConfiguration.network.baseURL);
 }
 
 // backward compatibility alias