Merge pull request #142 from Smithsonian/dev-bugfix

Dev bugfix merge
Smithsonian · May 27, 2022 · b9a388e · b9a388e
2 parents 2083a83 + a9726d1
commit b9a388e
Show file tree

Hide file tree

Showing 18 changed files with 127 additions and 78 deletions.
diff --git a/docs/content/explorer/scene-create/_index.md b/docs/content/explorer/scene-create/_index.md
@@ -131,6 +131,11 @@ If you are comfortable with installing and configuring software built from sourc
 
 Cook can also automate generation of additional asset derivatives. Use the "si-voyager-scene", "si-voyager-asset", or "generate-web-gltf" Cook recipes, depending on your needs.
 
-**Option 3: Public instance (Coming Soon!)**
+**Option 3: Public instance**
 
-We are hoping to soon have a public instance of Voyager Story that you can use to create and modify scene files without installing or setting up any additional tools.
+You can you use our publically accessible Voyager Story "Standalone" instance to create your scene. You'll find it at: https://3d.si.edu/voyager-story-standalone 
+Just drag-and-drop your assets into the browser and configure your scene as described in the Voyager Story section of these docs. 
+
+The main difference between this
+version and the traditional deployment is that "Standalone" saves all of your work in browser memory and requires you to download the scene package for permanent storage
+instead of writing changes directly to disk.
diff --git a/docs/content/explorer/usage/_index.md b/docs/content/explorer/usage/_index.md
@@ -33,7 +33,7 @@ If you want to use Voyager to show your own content or wish to make use of the E
 Below is the minimum html needed to use Voyager Explorer with comments above each line describing its purpose.
 
 **Note:** The voyager-explorer.min.js endpoint shown below will always give you the most recent version of Voyager. If you want to pin to or test out an older version,
-just use an endpoint like the following with the appropriate version number: https://3d-api.si.edu/resources/js/v0.17.0/voyager-explorer.min.js 
+just use an endpoint like the following with the appropriate version number: https://3d-api.si.edu/resources/js/v0.17.0/voyager-explorer.min.js
 
 {{<highlight html>}}
 <!DOCTYPE html>

diff --git a/docs/content/introduction/hosting/_index.md b/docs/content/introduction/hosting/_index.md
@@ -12,7 +12,8 @@ Every Voyager release comes with a pre-built distribution package with everythin
 
 Download the distribution package for the [latest Voyager release](https://github.com/Smithsonian/dpo-voyager/releases/latest). Unzip it and copy all of the files to a directory on your web server.
 
-As long as these files are all accessible via your server, you are ready to go!
+**Note:** The prebuilt Voyager package requires WebDAV enabled file server access to any content for the Story component to save changes directly to disk. If this is not available to you, 
+try [installing from source](../../introduction/installation/) which includes a simple server, or ['Standalone' mode](../../story/overview/) when using Story.
 
 ## Use
 

diff --git a/docs/content/story/launch/index.md b/docs/content/story/launch/index.md
@@ -4,9 +4,8 @@ summary: Embed and use Voyager Story in your own production pipeline.
 weight: 110
 ---
 
-**Currently, the only options for launching Voyager Story require hosting the application yourself in one of the ways described below.
-If you are an end user with no access to this option, please contact us. We are working to host a publically accessible version of Story that end users can use without the need for any installation or setup.**
-
+If you would like to host your own version of Voyager Story, check out the instructions below. **If you just want to use it to create a Voyage scene, try our 
+publically accessible deployment of [Voyager Story Standalone](https://3d.si.edu/voyager-story-standalone).**
 
 ## Web Application
 
@@ -16,6 +15,8 @@ Sample HTML documents are provided as part of the distributable package.
 The application can be launched via custom HTML element that can be customized using the following properties.
 Properties can be provided as URL variables or as attributes of the custom HTML element.
 
+**Note:** If you are having trouble deploying Voyager Story or are not able to supply a file server for it, try "Standalone" mode described below.
+
 ### Properties
 
 | Property     | Type/Values       | Description                                                                                               |
@@ -27,7 +28,7 @@ Properties can be provided as URL variables or as attributes of the custom HTML
 | texture      | String/URL        | If a geometry URL is given, optional URL of a color texture to use with the geometry (relative to the root folder). |
 | quality      | "Thumb", "Low", "Medium", "High", "Highest" | For a model/geometry/texture: The quality level of the generated derivative.                              |
 | referrer     | String/URL        | The page URL to navigate to when the user exits the story tool. |
-| mode         | "QC", "Author", "Expert" | Launch in "qc" mode to edit/QC an item. Launch in "author" mode to author items and presentations. Launch in "expert" mode to get access to all tasks/for debugging |
+| mode         | "QC", "Edit", "Expert", "Standalone" | Launch in: "qc" mode to edit/QC an item, "edit" mode to author items and presentations, "expert" mode to get access to all tasks/for debugging, "standalone" mode for scene creation without backend storage. |
 
 ### Example 1: launching the Story tool via custom HTML element
 {{<highlight html>}}

diff --git a/docs/content/story/overview/index.md b/docs/content/story/overview/index.md
@@ -6,7 +6,9 @@ weight: 100
 
 _Voyager Story_ is the creation and authoring application of the Voyager tool suite. The application can be used to create and author _Voyager SVX Documents_. Documents are files in JSON format containing the description of a Voyager scene or experience.
 
- _Voyager Story_ can be operated in two different modes. Each mode offers a number of tasks.
+ _Voyager Story_ can be operated in several different modes. Each mode offers a number of tasks.
+
+ **Note:** If you are having trouble deploying _Voyager Story_ or are not able to supply a file server for it, try Standalone mode described below.
 
 ## QC Mode
 
@@ -21,17 +23,16 @@ This mode is aimed at 3D technicians. After a model has been digitized and proce
 QC mode is enabled by supplying the mode=qc URL parameter.
 ```
 
-## Authoring Mode
+## Edit Mode
 
-The authoring tools can be used by curators to stage the model(s) using lights, cameras and props, and to add content (annotations, articles, and tours) to the experience. The following tasks are available in authoring mode:
+Along with the QC tasks, edit mode allow authoring tools to be used to stage the model(s) using lights, cameras and props, and to add content (annotations, articles, and tours) to the experience. The following tasks are available in edit mode:
 
 - Annotations task: add annotations to specific 3D locations on a model
 - Articles task: write and edit articles (documents with text and media), and connect them with annotations and models
 - Tours task: create guided tours which guide through the experience in multiple steps
-- Settings task: adjust parameters such as material settings
 
 ```
-Authoring mode is enabled by supplying the mode=author URL parameter.
+Edit mode is enabled by supplying the mode=edit URL parameter.
 ```
 
 ## Expert Mode
@@ -40,4 +41,16 @@ _Voyager Story_ actually offers a third mode, called expert mode, which shows al
 
 ```
 Expert mode is enabled by supplying the mode=expert URL parameter.
-``` 
+``` 
+
+## Standalone Mode
+
+By default, _Voyager Story_ requires a WebDAV file server backend to facilitate saving Voyager files directly to your permanent storage location. If you spin up Voyager from the source ([instructions here](../../introduction/installation/))
+ a simple server is included. Otherwise, you are responsible for appropriately accessible file storage. 
+
+Standalone mode removes the file server requirement by saving Voyager scenes in browser memory and gives you the
+ option to download the complete package directly to your machine. You can try out our deployment of it here: [Voyager Standalone](https://3d.si.edu/voyager-story-standalone)
+
+```
+Standalone mode is enabled by supplying the mode=standalone URL parameter.
+```
diff --git a/docs/public b/docs/public
diff --git a/libs/ff-scene b/libs/ff-scene
diff --git a/libs/ff-three b/libs/ff-three
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -70,7 +70,7 @@
         "simple-dropzone": "^0.8.1",
         "stream-browserify": "^3.0.0",
         "style-loader": "^3.3.1",
-        "three": "^0.137.5",
+        "three": "^0.139.2",
         "three-bmfont-text": "git+https://github.com/Smithsonian/three-bmfont-text.git#e611dac13d",
         "tinymce": "^6.0.1",
         "toposort": "^2.0.2",
@@ -82,13 +82,13 @@
         "@types/chai": "^4.2.21",
         "@types/mocha": "^9.0.0",
         "@types/node": "^14.0.26",
-        "@types/three": "^0.137.0",
+        "@types/three": "^0.139.0",
         "chai": "^4.2.0",
         "concurrently": "^6.2.1",
         "css-loader": "^6.2.0",
         "css-minimizer-webpack-plugin": "^3.0.2",
         "dotenv": "^10.0.0",
-        "handlebars-loader": "^1.7.1",
+        "handlebars-loader": "^1.7.2",
         "html-webpack-plugin": "^5.3.2",
         "license-checker": "^25.0.1",
         "mini-css-extract-plugin": "^2.2.0",

diff --git a/source/client/components/CVARManager.ts b/source/client/components/CVARManager.ts
@@ -142,6 +142,7 @@ export default class CVARManager extends Component
     protected lightTransform: CTransform = null;
     protected lightsToReset: CVDirectionalLight[] = [];
     protected featuresToReset: number[] = [];  // in order: floor/grid/tape/slicer/material
+    protected annotationsAtLaunch: boolean = false;
 
     update()
     {
@@ -330,6 +331,8 @@ export default class CVARManager extends Component
         featuresToReset.push(setup.tape.ins.visible.value ? 1 : 0);
         featuresToReset.push(setup.slicer.ins.enabled.value ? 1 : 0);
         featuresToReset.push(setup.viewer.ins.shader.value);
+
+        this.annotationsAtLaunch = setup.viewer.ins.annotationsVisible.value;
 
         // Disable extended features (TODO: support some/all of these features)    
         setup.floor.ins.visible.setValue(false);
@@ -339,6 +342,7 @@ export default class CVARManager extends Component
         if(setup.viewer.ins.shader.value !== EShaderMode.Default) {
             setup.viewer.ins.shader.setValue(EShaderMode.Default);
         }
+        setup.viewer.ins.annotationsVisible.setValue(false);
 
         // Set scale to m
         const originalUnits = this.originalUnits = scene.ins.units.getValidatedValue();
@@ -569,6 +573,7 @@ export default class CVARManager extends Component
             });
 
         this.shadow.updateMatrices();
+        this.setup.viewer.ins.annotationsVisible.setValue(this.annotationsAtLaunch);
     }
 
     protected getHitPoint( hitResult: XRHitTestResult): Vector3|null {

diff --git a/source/client/components/CVAnnotationsTask.ts b/source/client/components/CVAnnotationsTask.ts
@@ -35,6 +35,7 @@ import CVAnnotationView, { IAnnotationsUpdateEvent, IAnnotationClickEvent } from
 import AnnotationsTaskView from "../ui/story/AnnotationsTaskView";
 import CVScene from "client/components/CVScene";
 import { ELanguageStringType, ELanguageType, DEFAULT_LANGUAGE } from "client/schema/common";
+import { getMeshTransform } from "client/utils/Helpers";
 
 ////////////////////////////////////////////////////////////////////////////////
 
@@ -175,11 +176,15 @@ export default class CVAnnotationsTask extends CVTask
             _scaling.setScalar(1);
             _mat4.compose(_position, _quat, _scaling);
 
+            const meshTransform = getMeshTransform(model.object3D, event.object3D);
+            const invMeshTransform = meshTransform.clone().invert();
+            const bounds = model.localBoundingBox.clone().applyMatrix4(meshTransform);
+
             // add mesh parent transforms in this branch
-            _mat4.copy(_mat4.multiply(this.getMeshTransform(model.object3D, event.object3D).invert()));   
+            _mat4.copy(_mat4.multiply(invMeshTransform));   
             _mat3.getNormalMatrix(_mat4);
 
-            const position = event.view.pickPosition(event).applyMatrix4(_mat4).toArray();
+            const position = event.view.pickPosition(event, bounds).applyMatrix4(_mat4).toArray();
             const normal = event.view.pickNormal(event).applyMatrix3(_mat3).toArray();
 
             const mode = this.ins.mode.getValidatedValue();
@@ -302,25 +307,6 @@ export default class CVAnnotationsTask extends CVTask
         }
     }
 
-    /** Accumulates transforms from current object to root. */
-    protected getMeshTransform(root : Object3D, current: Object3D)
-    {
-        var result = new Matrix4();
-        var tempMatrix = new Matrix4();
-
-        result.identity();
-
-        do {
-            tempMatrix.compose(current.position, current.quaternion, current.scale);
-            result.multiply(tempMatrix.invert());
-
-            current = current.parent;
-        }
-        while (root !== current)
-
-        return result;
-    }
-
     // Make sure this task language matches document
     protected synchLanguage() {
         const {ins} = this;

diff --git a/source/client/components/CVNode.ts b/source/client/components/CVNode.ts
@@ -62,8 +62,8 @@ export default class CVNode extends CTransform
             _mat4.fromArray(data.matrix);
             _mat4.decompose(_vec3a, _quat, _vec3b);
             _vec3a.toArray(position.value);
-            _euler.setFromQuaternion(_quat, orderTag);
-            _euler.toVector3(_vec3a).multiplyScalar(MathUtils.RAD2DEG).toArray(rotation.value);
+            _euler.setFromQuaternion(_quat, orderTag); 
+            _vec3a.setFromEuler(_euler).multiplyScalar(MathUtils.RAD2DEG).toArray(rotation.value);
             _vec3b.toArray(scale.value);
 
             position.set();
@@ -77,7 +77,7 @@ export default class CVNode extends CTransform
             if (data.rotation) {
                 _quat.fromArray(data.rotation);
                 _euler.setFromQuaternion(_quat, orderTag);
-                _euler.toVector3(_vec3a).multiplyScalar(MathUtils.RAD2DEG).toArray(rotation.value);
+                _vec3a.setFromEuler(_euler).multiplyScalar(MathUtils.RAD2DEG).toArray(rotation.value);
                 rotation.set();
             }
             if (data.scale) {

diff --git a/source/client/components/CVScene.ts b/source/client/components/CVScene.ts
@@ -28,6 +28,7 @@ import unitScaleFactor from "client/utils/unitScaleFactor";
 import CTransform from "client/../../libs/ff-scene/source/components/CTransform";
 import CVCamera from "./CVCamera";
 import CVSetup from "./CVSetup";
+import CRenderer from "client/../../libs/ff-scene/source/components/CRenderer";
 
 ////////////////////////////////////////////////////////////////////////////////
 
@@ -82,6 +83,10 @@ export default class CVScene extends CVNode
         return this.getGraphComponent(CVSetup);
     }
 
+    protected get renderer() {
+        return this.getMainComponent(CRenderer);
+    }
+
     create()
     {
         super.create();
@@ -206,13 +211,11 @@ export default class CVScene extends CVNode
 
     protected updateCameras()
     {
-        // Make sure max zoom is less than far plane.
-        if(this.setup.navigation.ins.autoZoom.value) {
-            this.setup.navigation.ins.offset.once("value", this.updateCameraHelper);
-        }
-        else {
-            this.updateCameraHelper();
+        if(this.renderer.views[0].renderer.xr.isPresenting) {
+            return;
         }
+
+        this.updateCameraHelper();
     }
 
     protected updateCameraHelper = () =>
@@ -221,10 +224,10 @@ export default class CVScene extends CVNode
         const orbitRadius =  _vec3.set(navOffset[0], navOffset[1], navOffset[2]).length();
 
         if(!this.system.getComponent("CVStoryApplication", true)) {
-            const maxOffset = 2 * Math.max(orbitRadius, this.outs.boundingRadius.value);
+            const maxOffset = 2.5 * Math.max(orbitRadius, this.outs.boundingRadius.value);
             const currOffset = this.setup.navigation.ins.maxOffset.value;
-            const zOffset = navOffset[2] < currOffset[2] ? Math.min(currOffset[2], maxOffset) : maxOffset;
-            this.setup.navigation.ins.maxOffset.setValue([currOffset[0], currOffset[1], zOffset]);
+            //const zOffset = navOffset[2] < currOffset[2] ? Math.min(currOffset[2], maxOffset) : maxOffset;
+            this.setup.navigation.ins.maxOffset.setValue([currOffset[0], currOffset[1], maxOffset]);
         }
 
         this.cameras.forEach(camera => {
+6 −2		explorer/scene-create/index.html
+2 −1		introduction/hosting/index.html
+5 −4		story/launch/index.html
+11 −5		story/overview/index.html
+5 −0		source/RenderView.ts
+1 −1		source/components/CCamera.ts
+0 −1		source/components/CMaterial.ts
+0 −1		source/components/CTexture.ts
+1 −1		source/components/CTransform.ts