redhotmagma-visualization 1.44.1 → 1.44.3

package/Three/Three3DScene.js

@@ -13,7 +13,6 @@ var _RGBELoader = require("three/examples/jsm/loaders/RGBELoader");
 var _get = _interopRequireDefault(require("lodash/get"));
 var _size = _interopRequireDefault(require("lodash/size"));
 var _isPlainObject = _interopRequireDefault(require("lodash/isPlainObject"));
-var _isEqual = _interopRequireDefault(require("lodash/isEqual"));
 var _glTFExporter = require("./Exporters/glTFExporter");
 var _findIndex = _interopRequireDefault(require("lodash/findIndex"));
 var _merge = _interopRequireDefault(require("lodash/merge"));
@@ -291,6 +290,7 @@ var Three3DScene = exports.Three3DScene = /*#__PURE__*/function (_Three3D) {
       useShadowGround: true,
       removeGroundForScreenshot: true,
       useEnvironmentMap: true,
+      useDirectionalLight: false,
       useBakedShadows: false,
       bakedShadow: {
         lightPositionOffset: {
@@ -401,6 +401,8 @@ var Three3DScene = exports.Three3DScene = /*#__PURE__*/function (_Three3D) {
       renderer.outputEncoding = _three.sRGBEncoding;
       renderer.shadowMap.enabled = true;
       renderer.shadowMap.type = _three.PCFSoftShadowMap;
+      renderer.toneMapping = _three.ACESFilmicToneMapping;
+      renderer.toneMappingExposure = 1;
       var realWidth = window.innerWidth * window.devicePixelRatio;
       if ((0, _isMobileDevice.isMobileDevice)() && realWidth >= 1024) {
         renderer.setPixelRatio(1);
@@ -451,11 +453,13 @@ var Three3DScene = exports.Three3DScene = /*#__PURE__*/function (_Three3D) {
     key: "createScene",
     value: function createScene() {
       var scene = new _three.Scene();
-      scene.add(this.createDirLight());
       scene.add(this.sceneContainer);
       if (this.config.useEnvironmentMap && this.envMap) {
         scene.environment = this.envMap;
       }
+      if (this.config.useDirectionalLight) {
+        scene.add(this.createDirLight());
+      }
       return scene;
     }
   }, {
@@ -506,7 +510,7 @@ var Three3DScene = exports.Three3DScene = /*#__PURE__*/function (_Three3D) {
     key: "addLightsIfNeeded",
     value: function addLightsIfNeeded(scene) {
       var sceneHasLight = scene.getObjectByProperty("isLight", true);
-      if (!sceneHasLight && !this.dirLight) {
+      if (!sceneHasLight && !this.dirLight && (this.config.useDirectionalLight || !this.config.useEnvironmentMap)) {
         this.scene.add(this.createDirLight());
       } else if (sceneHasLight) {
         // remove if the scene shipped its own light
@@ -1189,6 +1193,17 @@ var Three3DScene = exports.Three3DScene = /*#__PURE__*/function (_Three3D) {
       }
       this.screenshotViews = this.calculateRelativeViews(this.relativeScreenshotViews, center, (this.controls.minDistance + this.controls.maxDistance) * 0.5);
     }
+  }, {
+    key: "getCameraViewRatio",
+    value: function getCameraViewRatio(view1, view2) {
+      return view2.lookat.distanceTo(view2.position) / view1.lookat.distanceTo(view1.position);
+    }
+  }, {
+    key: "shouldViewChangeTriggerJumpToView",
+    value: function shouldViewChangeTriggerJumpToView(view1, view2) {
+      var tolerance = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0.5;
+      return Math.abs(this.getCameraViewRatio(view1, view2) - 1) > tolerance;
+    }
   }, {
     key: "initCameraViews",
     value: function initCameraViews(cameras) {
@@ -1209,7 +1224,7 @@ var Three3DScene = exports.Three3DScene = /*#__PURE__*/function (_Three3D) {
         this._firstCameraInitDone = true;
         this.currentCameraView = null;
         this.jumpToView("default", false);
-      } else if (previousCameraView && this.cameraViews[currentCameraName] && !(0, _isEqual["default"])(previousCameraView, this.cameraViews[currentCameraName])) {
+      } else if (previousCameraView && this.cameraViews[currentCameraName] && this.shouldViewChangeTriggerJumpToView(previousCameraView, this.cameraViews[currentCameraName])) {
         this.currentCameraView = null;
         this.jumpToView(currentCameraName, true);
       }
@@ -1354,9 +1369,13 @@ var Three3DScene = exports.Three3DScene = /*#__PURE__*/function (_Three3D) {
       controls.maxDistance = maxDistance;
       camera.near = minDistance * 0.01;
       camera.far = maxDistance * 100;
-      camera.position.copy(camera.position.normalize().multiplyScalar(maxDistance * 0.75));
+      // update current position only if it does not fit into the distance range
+      var currentDistance = sphere.center.distanceTo(camera.position);
+      if (currentDistance < minDistance || currentDistance > maxDistance) {
+        camera.position.copy(camera.position.normalize().multiplyScalar(maxDistance * 0.75));
+        controls.target = sphere.center;
+      }
       camera.updateProjectionMatrix();
-      controls.target = sphere.center;
       controls.update();
     }
   }, {

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "redhotmagma-visualization",
-  "version": "1.44.1",
+  "version": "1.44.3",
   "license": "UNLICENSED",
   "private": false,
   "main": "./index.js",
   "dependencies": {
     "@babel/polyfill": "^7.12.1",
-    "@configuratorware/scripts": "1.44.1",
+    "@configuratorware/scripts": "1.44.3",
     "@tweenjs/tween.js": "^17.6.0",
     "console-polyfill": "^0.3.0",
     "css-element-queries": "^1.2.3",

package/src/Three/Three3DScene.js

@@ -1,4 +1,5 @@
 import {
+  ACESFilmicToneMapping,
   AnimationMixer,
   Box3,
   CameraHelper,
@@ -35,7 +36,6 @@ import { RGBELoader } from "three/examples/jsm/loaders/RGBELoader";
 import get from "lodash/get";
 import size from "lodash/size";
 import isPlainObject from "lodash/isPlainObject";
-import isEqual from "lodash/isEqual";
 import { exportGLTF } from "./Exporters/glTFExporter";
 import findIndex from "lodash/findIndex";
 import merge from "lodash/merge";
@@ -274,6 +274,7 @@ export class Three3DScene extends Three3D {
     useShadowGround: true,
     removeGroundForScreenshot: true,
     useEnvironmentMap: true,
+    useDirectionalLight: false,
     useBakedShadows: false,
     bakedShadow: {
       lightPositionOffset: { x: 0, y: 0, z: 0 },
@@ -336,6 +337,8 @@ export class Three3DScene extends Three3D {
     renderer.outputEncoding = sRGBEncoding;
     renderer.shadowMap.enabled = true;
     renderer.shadowMap.type = PCFSoftShadowMap;
+    renderer.toneMapping = ACESFilmicToneMapping;
+    renderer.toneMappingExposure = 1;
 
     const realWidth = window.innerWidth * window.devicePixelRatio;
     if (isMobileDevice() && realWidth >= 1024) {
@@ -387,12 +390,14 @@ export class Three3DScene extends Three3D {
 
   createScene() {
     const scene = new Scene();
-    scene.add(this.createDirLight());
     scene.add(this.sceneContainer);
 
     if (this.config.useEnvironmentMap && this.envMap) {
       scene.environment = this.envMap;
     }
+    if (this.config.useDirectionalLight) {
+      scene.add(this.createDirLight());
+    }
 
     return scene;
   }
@@ -446,7 +451,11 @@ export class Three3DScene extends Three3D {
 
   addLightsIfNeeded(scene) {
     const sceneHasLight = scene.getObjectByProperty("isLight", true);
-    if (!sceneHasLight && !this.dirLight) {
+    if (
+      !sceneHasLight &&
+      !this.dirLight &&
+      (this.config.useDirectionalLight || !this.config.useEnvironmentMap)
+    ) {
       this.scene.add(this.createDirLight());
     } else if (sceneHasLight) {
       // remove if the scene shipped its own light
@@ -967,6 +976,14 @@ export class Three3DScene extends Three3D {
     );
   }
 
+  getCameraViewRatio(view1, view2) {
+    return view2.lookat.distanceTo(view2.position) / view1.lookat.distanceTo(view1.position);
+  }
+
+  shouldViewChangeTriggerJumpToView(view1, view2, tolerance = 0.5) {
+    return Math.abs(this.getCameraViewRatio(view1, view2) - 1) > tolerance;
+  }
+
   initCameraViews(cameras) {
     if (!this.sceneContainer?.children?.length) {
       return;
@@ -991,7 +1008,10 @@ export class Three3DScene extends Three3D {
     } else if (
       previousCameraView &&
       this.cameraViews[currentCameraName] &&
-      !isEqual(previousCameraView, this.cameraViews[currentCameraName])
+      this.shouldViewChangeTriggerJumpToView(
+        previousCameraView,
+        this.cameraViews[currentCameraName]
+      )
     ) {
       this.currentCameraView = null;
       this.jumpToView(currentCameraName, true);
@@ -1120,9 +1140,13 @@ export class Three3DScene extends Three3D {
     controls.maxDistance = maxDistance;
     camera.near = minDistance * 0.01;
     camera.far = maxDistance * 100;
-    camera.position.copy(camera.position.normalize().multiplyScalar(maxDistance * 0.75));
+    // update current position only if it does not fit into the distance range
+    const currentDistance = sphere.center.distanceTo(camera.position);
+    if (currentDistance < minDistance || currentDistance > maxDistance) {
+      camera.position.copy(camera.position.normalize().multiplyScalar(maxDistance * 0.75));
+      controls.target = sphere.center;
+    }
     camera.updateProjectionMatrix();
-    controls.target = sphere.center;
 
     controls.update();
   }