redhotmagma-visualization 1.41.0 → 1.42.0

package/src/Three/ThreeBase.js

@@ -11,7 +11,11 @@ import {
 
 import TWEEN from "@tweenjs/tween.js";
 
-import { createPointerHitListener, getPointFromPointerEvent } from "../CommonUtils/pointerEvent";
+import {
+  createMouseMoveListener,
+  createPointerHitListener,
+  getPointFromPointerEvent,
+} from "../CommonUtils/pointerEvent";
 import { VisualizationInterface } from "../VisualizationInterface";
 import { EventTypes } from "../Constants";
 import { removeObject } from "../Utils/removeObject";
@@ -114,6 +118,10 @@ export class ThreeBase extends VisualizationInterface {
     this.setSize(size, false);
   }
 
+  getContainer() {
+    return this._container;
+  }
+
   /**
    * Creates the paths for loading a model (object + material)
    * @returns {{objPath: string, mtlPath: string}}
@@ -294,10 +302,14 @@ export class ThreeBase extends VisualizationInterface {
   endAnimation = () => this.cameraTweenGroup.getAll().forEach(item => item.end());
 
   render() {
-    if (this._disableRender) {
+    if (this._disableRender || !this._isInitialized) {
       return;
     }
-    this.renderer && this.renderer.render(this.scene, this.camera);
+    try {
+      this.renderer && this.renderer.render(this.scene, this.camera);
+    } catch (e) {
+      console.error("Rendering failed with the following error:", e);
+    }
   }
 
   isAnimating() {
@@ -331,6 +343,22 @@ export class ThreeBase extends VisualizationInterface {
         this.observable.dispatch(is ? EventTypes.Intersection : EventTypes.ClickAway, is);
       }
     });
+
+    createMouseMoveListener(element, {
+      onMove: evt => {
+        if (!this._hitTestEnabled) {
+          return;
+        }
+        const is = this.getIntersection(evt);
+        this.observable.dispatch(is ? EventTypes.HoverIn : EventTypes.HoverOut, is);
+      },
+      onLeave: () => {
+        if (!this._hitTestEnabled) {
+          return;
+        }
+        this.observable.dispatch(EventTypes.HoverOut);
+      },
+    });
   }
 
   /**

package/src/Utils/TextureBuilder/createTextureBuilder.js

@@ -37,9 +37,18 @@ export const createTextureBuilder = (textureImage, params = {}) => {
           const { width, height, scaling } = calculateDesignAreaSize(designArea);
 
           const effectCanvas = new EffectCanvas(width, height);
-          await drawToContext(effectCanvas.ctx, 0, 0, width, height, {
-            currentZoom,
-          });
+          try {
+            await drawToContext(effectCanvas.ctx, 0, 0, width, height, {
+              currentZoom,
+            });
+          } catch (e) {
+            // eslint-disable-next-line no-console
+            console.error(
+              "Transfering design to the visualization failed due to the following error.",
+              e
+            );
+            return;
+          }
           if (effect && effect !== "print") {
             await effectCanvas.applyEffect(effect, {
               getSvg,

package/src/VisualizationContainer.js

@@ -108,19 +108,25 @@ export class VisualizationContainer extends React.Component {
     const { autoDispose, visualization } = this.props;
     autoDispose && visualization.dispose();
     this.resizeSensor && this.resizeSensor.detach();
+    this.offObservers && this.offObservers();
   }
 
   initVisualization(container) {
     const { visualization } = this.props;
     visualization.init(container);
-    visualization.observable.on(
+    const offLoadError = visualization.observable.on(
       VisualizationEventTypes.LoadError,
       ({ data: { screenshot } }) => !screenshot && this.setState({ broken: true })
     );
-    visualization.observable.on(
+    const offLoadFinished = visualization.observable.on(
       VisualizationEventTypes.LoadFinished,
       ({ data: { screenshot } }) => !screenshot && this.setState({ broken: false })
     );
+    this.offObservers = () => {
+      offLoadError();
+      offLoadFinished();
+      delete this.offObservers;
+    };
   }
 
   onSizeChange = size => {

package/src/index.js

@@ -1,9 +1,8 @@
-import "react-hot-loader";
-import ReactDOM from "react-dom";
+import { createRoot } from "react-dom/client";
 import React from "react";
 
 import DevApp from "DevApp";
 
 const container = document.createElement("div");
 document.body.appendChild(container);
-ReactDOM.render(<DevApp />, container);
+createRoot(container).render(<DevApp />);

package/visualizationAdapterCreator.js

@@ -3,41 +3,26 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.createAdapterConfig = exports.createVisualizationAdapter = void 0;
-
+exports.createVisualizationAdapter = exports.createAdapterConfig = void 0;
 var _react = _interopRequireDefault(require("react"));
-
 var _merge = _interopRequireDefault(require("lodash/merge"));
-
 var _ReactBase = require("./React/ReactBase");
-
 var _Three2DLayers = require("./Three/Three2DLayers");
-
 var _Three3DScene = require("./Three/Three3DScene");
-
 var _Three2D = require("./Three/Three2D");
-
 var _Three3D = require("./Three/Three3D");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-var createVisualizationAdapter = function createVisualizationAdapter(adapterConfig, target) {
+var createVisualizationAdapter = exports.createVisualizationAdapter = function createVisualizationAdapter(adapterConfig, target) {
   var cfg = adapterConfig[target];
-
   if (!cfg) {
     throw new Error("No adapter configuration for the following target: ".concat(target));
   }
-
   var Adapter = cfg.adapterClass;
-
   if (Adapter) {
     return new Adapter(cfg);
   }
 };
-
-exports.createVisualizationAdapter = createVisualizationAdapter;
-
-var createAdapterConfig = function createAdapterConfig(_ref) {
+var createAdapterConfig = exports.createAdapterConfig = function createAdapterConfig(_ref) {
   var host = _ref.host;
   var overrides = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
   return (0, _merge["default"])({
@@ -45,14 +30,14 @@ var createAdapterConfig = function createAdapterConfig(_ref) {
       adapterClass: _Three2D.Three2D,
       modelBasePath: host,
       basePath: "".concat(host, "/images/item/view") // only for conventional urls
-
     },
+
     "2dVariantOverlay": {
       adapterClass: _Three2D.Three2D,
       modelBasePath: host,
       basePath: "".concat(host, "/images/item/view") // only for conventional urls
-
     },
+
     "2dLayer": {
       adapterClass: _Three2DLayers.Three2DLayers,
       modelBasePath: host
@@ -77,6 +62,4 @@ var createAdapterConfig = function createAdapterConfig(_ref) {
       }
     }
   }, overrides);
-};
-
-exports.createAdapterConfig = createAdapterConfig;
+};