Adapt Three-D and First-Person buttons to xeokit CameraControl updates

robraccu · May 5, 2020 · 4b60195 · 4b60195
1 parent 348e115
commit 4b60195
Show file tree

Hide file tree

Showing 3 changed files with 35 additions and 13 deletions.
diff --git a/src/BIMViewer.js b/src/BIMViewer.js
@@ -249,13 +249,36 @@ class BIMViewer extends Controller {
             active: false
         });
 
+        // Allows Three-D and First Person toggle buttons to cooperatively switch
+        // CameraControl#navMode between "orbit", "firstPerson" and "planView" modes
+
+        const cameraControlNavModeMediator = new (function (viewer) {
+
+            let threeDActive = false;
+            let firstPersonActive = false;
+
+            this.setThreeDModeActive = (active) => {
+                viewer.cameraControl.navMode = active ? (firstPersonActive ? "firstPerson" : "orbit") : "planView";
+                viewer.cameraControl.pivoting = viewer.cameraControl.navMode === "orbit";
+                threeDActive = active;
+            };
+
+            this.setFirstPersonModeActive = (active) => {
+                viewer.cameraControl.navMode = active ? "firstPerson" : (threeDActive ? "orbit" : "planView");
+                viewer.cameraControl.pivoting = viewer.cameraControl.navMode === "orbit";
+                firstPersonActive = active;
+            };
+        })(this.viewer);
+
         this._threeDMode = new ThreeDMode(this, {
             buttonElement: toolbarElement.querySelector(".xeokit-threeD"),
+            cameraControlNavModeMediator: cameraControlNavModeMediator,
             active: false
         });
 
         this._firstPersonMode = new FirstPersonMode(this, {
             buttonElement: toolbarElement.querySelector(".xeokit-firstPerson"),
+            cameraControlNavModeMediator: cameraControlNavModeMediator,
             active: false
         });
 
@@ -1015,7 +1038,7 @@ class BIMViewer extends Controller {
     }
 
     _parseThreeDMode(viewerState, done) {
-        const activateThreeDMode = (viewerState.threeDEnabled !== false);
+        const activateThreeDMode = (viewerState.threeDActive !== false);
         this.set3DEnabled(activateThreeDMode, done);
     }
 
@@ -1652,7 +1675,7 @@ class BIMViewer extends Controller {
      * @returns {Boolean} Returns ````true```` if keyboard input is enabled.
      */
     getKeyboardEnabled() {
-        return  this.viewer.scene.input.keyboardEnabled;
+        return this.viewer.scene.input.keyboardEnabled;
     }
 
     /**

diff --git a/src/toolbar/FirstPersonMode.js b/src/toolbar/FirstPersonMode.js
@@ -13,10 +13,11 @@ class FirstPersonMode extends Controller {
 
         const buttonElement = cfg.buttonElement;
         const cameraControl = this.viewer.cameraControl;
+        const cameraControlNavModeMediator = cfg.cameraControlNavModeMediator;
 
-        cameraControl.firstPerson = false;
+        cameraControl.navMode = "orbit";
         cameraControl.pivoting = true;
-        cameraControl.panToPointer = true;
+        cameraControl.dollyToPointer = true;
 
         this.on("enabled", (enabled) => {
             if (!enabled) {
@@ -35,16 +36,13 @@ class FirstPersonMode extends Controller {
         });
 
         this.on("active", (active) => {
+            cameraControlNavModeMediator.setFirstPersonModeActive(active);
             if (active) {
-                cameraControl.firstPerson = true;
-                cameraControl.panToPointer = true;
+                cameraControl.dollyToPointer = true;
                 cameraControl.pivoting = false;
             } else {
-                cameraControl.firstPerson = false;
                 cameraControl.pivoting = true;
-                cameraControl.panToPointer = true;
             }
-            this.viewer.cameraControl.planView = false;
         });
 
         buttonElement.addEventListener("click", (event) => {

diff --git a/src/toolbar/ThreeDMode.js b/src/toolbar/ThreeDMode.js
@@ -16,6 +16,8 @@ class ThreeDMode extends Controller {
 
         this._buttonElement = cfg.buttonElement;
 
+        this._cameraControlNavModeMediator = cfg.cameraControlNavModeMediator;
+
         this._active = false;
 
         this.on("enabled", (enabled) => {
@@ -84,11 +86,10 @@ class ThreeDMode extends Controller {
         const up = (camera.yUp) ? [-1, 1, -1] : [-1, 1, 1];
 
         viewer.cameraControl.pivotPos = center;
-        viewer.cameraControl.planView = false;
 
         this.bimViewer._navCubeMode.setActive(true);
-        this.viewer.cameraControl.planView = false;
         this.bimViewer._firstPersonMode.setEnabled(true);
+        this._cameraControlNavModeMediator.setThreeDModeActive(true);
         this.bimViewer._sectionTool.setEnabled(true);
 
         if (done) {
@@ -134,11 +135,11 @@ class ThreeDMode extends Controller {
 
         this.bimViewer._sectionTool.setActive(false);
         this.bimViewer._sectionTool.clear();
-        this.viewer.cameraControl.planView = true;
         this.bimViewer._firstPersonMode.setEnabled(false);
-        this.bimViewer._firstPersonMode.setActive(false);
         this.bimViewer._sectionTool.setEnabled(false);
 
+        this._cameraControlNavModeMediator.setThreeDModeActive(false);
+
         if (done) {
             viewer.cameraFlight.flyTo({
                 projection: "ortho",