Merge pull request #226 from Smithsonian/dev-ar

Dev ar

source/client/components/CVScene.ts

@@ -165,7 +165,11 @@ export default class CVScene extends CVNode
         const box = this.outs.boundingBox.value;
         box.makeEmpty();
 
-        this.models.forEach(model => box.expandByObject(model.object3D));
+        this.models.forEach(model => {
+            if(model.object3D.visible){
+                box.expandByObject(model.object3D)
+            }
+        });
         box.getSize(_vec3);
 
         this.outs.boundingBox.set();

source/client/components/CVViewer.ts

@@ -27,6 +27,7 @@ import CVModel2, { IModelLoadEvent } from "./CVModel2";
 import CVAnnotationView, { IAnnotationClickEvent, ITagUpdateEvent } from "./CVAnnotationView";
 import CVAnalytics from "./CVAnalytics";
 import CVLanguageManager from "./CVLanguageManager";
+import CVARManager from "./CVARManager";
 
 ////////////////////////////////////////////////////////////////////////////////
 
@@ -50,6 +51,8 @@ export default class CVViewer extends Component
         exposure: types.Number("Renderer.Exposure", 1),
         gamma: types.Number("Renderer.Gamma", 2),
         quality: types.Enum("Models.Quality", EDerivativeQuality, EDerivativeQuality.High),
+        isWallMountAR: types.Boolean("AR.IsWallMount", false),
+        arScale: types.Number("AR.Scale", 1.0)
     };
 
     protected static readonly outs = {
@@ -69,6 +72,8 @@ export default class CVViewer extends Component
             this.ins.toneMapping,
             this.ins.exposure,
             this.ins.gamma,
+            this.ins.isWallMountAR,
+            this.ins.arScale,
         ];
     }
 
@@ -88,6 +93,9 @@ export default class CVViewer extends Component
     protected get renderer() {
         return this.getMainComponent(CRenderer);
     }
+    protected get ar() {
+        return this.getMainComponent(CVARManager);
+    }
 
     get rootElement() {
         return this._rootElement;
@@ -102,6 +110,9 @@ export default class CVViewer extends Component
         this.graph.components.on(CVModel2, this.onModelComponent, this);
         this.graph.components.on(CVAnnotationView, this.onAnnotationsComponent, this);
         this.graph.components.on(CVLanguageManager, this.onLanguageComponent, this);
+
+        this.ar.ins.wallMount.linkFrom(this.ins.isWallMountAR);
+        this.ar.ins.arScale.linkFrom(this.ins.arScale);
     }
 
     dispose()
@@ -184,6 +195,8 @@ export default class CVViewer extends Component
             exposure: data.exposure !== undefined ? data.exposure : ins.exposure.schema.preset,
             toneMapping: data.toneMapping || false,
             gamma: data.gamma !== undefined ? data.gamma : ins.gamma.schema.preset,
+            isWallMountAR: data.isWallMountAR || false,
+            arScale: data.arScale || 1.0,
             annotationsVisible: !!data.annotationsVisible,
             activeTags: data.activeTags || "",
             sortedTags: data.sortedTags || "",
@@ -200,6 +213,8 @@ export default class CVViewer extends Component
             exposure: ins.exposure.value,
             toneMapping: ins.toneMapping.value,
             gamma: ins.gamma.value,
+            isWallMountAR: ins.isWallMountAR.value,
+            arScale: ins.arScale.value
         };
 
         if (ins.annotationsVisible.value) {

source/client/schema/setup.ts

@@ -65,6 +65,8 @@ export interface IViewer
     exposure: number;
     toneMapping: boolean;
     gamma: number;
+    isWallMountAR: boolean;
+    arScale: number;
     annotationsVisible?: boolean;
     activeTags?: string;
     sortedTags?: string;

source/client/ui/explorer/ARMenu.ts

@@ -22,6 +22,8 @@ import CVDocument from "../../components/CVDocument";
 import CVARManager from "../../components/CVARManager";
 
 import DocumentView, { customElement, html } from "./DocumentView";
+import CVAnnotationView from "client/components/CVAnnotationView";
+import CVScene from "client/components/CVScene";
 
 ////////////////////////////////////////////////////////////////////////////////
 
@@ -37,6 +39,9 @@ export default class ARMenu extends DocumentView
     protected get arManager() {
         return this.system.getMainComponent(CVARManager);
     }
+    protected get sceneNode() {
+        return this.system.getComponent(CVScene);
+    }
 
     protected firstConnected()
     {
@@ -65,8 +70,10 @@ export default class ARMenu extends DocumentView
         const outs = arManager.outs;
 
         const setup = document.setup;
+        const scene = this.sceneNode;
 
-        const annotationsButtonVisible = true;
+        const views = scene.getGraphComponents(CVAnnotationView);
+        const annotationsButtonVisible = views.some(view => {return view.hasAnnotations;});
         const annotationsActive = setup.viewer.ins.annotationsVisible.value;
 
         const narrationButtonVisible = setup.audio.outs.narrationEnabled.value;

source/client/ui/explorer/ARPrompt.ts

@@ -41,11 +41,12 @@ export default class ARPrompt extends DocumentView
     {
         const arManager = this.arManager;
         const outs = arManager.outs;
+        const location = arManager.ins.wallMount.value === true ? "a wall" : "the floor";
 
         return !outs.isPlaced.value && outs.isPresenting.value ? html`<div class="sv-ar-prompt">
                 <div class="sv-content">
                     <div><ff-icon class="ff-off ff-icon sv-ar-icon" name="device-move"}></ff-icon></div>
-                    Move the device to place your Smithsonian object!<br><br>**BETA**
+                    Point your device at ${location} and move it around to place your Smithsonian object!<br><br>**BETA**
                 </div>
             </div>` : null;
     }

source/client/ui/explorer/MainMenu.ts

@@ -131,8 +131,11 @@ export default class MainMenu extends DocumentView
 
         // TODO - push to ARManager?
         const models = scene.getGraphComponents(CVModel2);
-        const ARderivatives = models[0] ? models[0].derivatives.getByQuality(EDerivativeQuality.AR) : [];
-        const arButtonVisible = this.arManager.outs.available.value && ARderivatives.length > 0 && models.length >= 1;
+        let hasARderivatives = false;
+        models.forEach(model => {
+            hasARderivatives = model.derivatives.getByQuality(EDerivativeQuality.AR).length > 0 ? true : hasARderivatives;
+        });
+        const arButtonVisible = this.arManager.outs.available.value && hasARderivatives && models.length >= 1;
 
 
         return html`

source/client/ui/explorer/styles.scss

@@ -306,6 +306,22 @@ $pad: $canvas-border-width + $main-menu-button-size + 8px;
   transform: translate(-50%, -100%);
 }
 
+.sv-scale-annotation {
+  opacity: 0;
+  transition: opacity 0.3s ease-in;
+  position: absolute;
+  color: black;
+  background-color: white;
+  font-weight: bold;
+  border-radius: 20px;
+  padding-left: 4px;
+  padding-right: 4px;
+
+  &.sv-show {
+    opacity: 1;
+  }
+}
+
 .sv-standard-annotation, .sv-extended-annotation {
   max-width: 20%;
   min-width: min-content;