diff --git a/src/controllers/base.ts b/src/controllers/base.ts index 3a1dd93..6e57baa 100644 --- a/src/controllers/base.ts +++ b/src/controllers/base.ts @@ -251,7 +251,7 @@ export class Base { this.clickMenu = null; } } else { - this.clickMenu = this.diagramManager.diagramMenuManager.createClickMenu(mesh, this.xrInputSource.grip); + this.clickMenu = this.diagramManager.diagramMenuManager.createClickMenu(mesh, this.xrInputSource); } } else { diff --git a/src/diagram/diagramManager.ts b/src/diagram/diagramManager.ts index 3543e56..b08a108 100644 --- a/src/diagram/diagramManager.ts +++ b/src/diagram/diagramManager.ts @@ -1,4 +1,4 @@ -import {AbstractMesh, ActionManager, InstancedMesh, Mesh, Observable, Scene, TransformNode} from "@babylonjs/core"; +import {AbstractMesh, ActionManager, InstancedMesh, Mesh, Observable, Scene, WebXRInputSource} from "@babylonjs/core"; import {DiagramEntity, DiagramEvent, DiagramEventType} from "./types/diagramEntity"; import log from "loglevel"; import {Controllers} from "../controllers/controllers"; @@ -74,7 +74,7 @@ export class DiagramManager { return this._diagramMenuManager; } - public createClickMenu(mesh: AbstractMesh, grip: TransformNode): ClickMenu { + public createClickMenu(mesh: AbstractMesh, grip: WebXRInputSource): ClickMenu { return this._diagramMenuManager.createClickMenu(mesh, grip); } private notifyAll(event: DiagramEvent) { diff --git a/src/diagram/diagramMenuManager.ts b/src/diagram/diagramMenuManager.ts index e063674..a08624b 100644 --- a/src/diagram/diagramMenuManager.ts +++ b/src/diagram/diagramMenuManager.ts @@ -1,5 +1,5 @@ import {DiagramEvent, DiagramEventType} from "./types/diagramEntity"; -import {AbstractMesh, ActionEvent, Observable, Scene, TransformNode, Vector3} from "@babylonjs/core"; +import {AbstractMesh, ActionEvent, Observable, Scene, Vector3, WebXRInputSource} from "@babylonjs/core"; import {InputTextView} from "../information/inputTextView"; import {toDiagramEntity} from "./functions/toDiagramEntity"; import {DefaultScene} from "../defaultScene"; @@ -79,8 +79,8 @@ export class DiagramMenuManager { this._inputTextView.show(mesh); } - public createClickMenu(mesh: AbstractMesh, grip: TransformNode): ClickMenu { - const clickMenu = new ClickMenu(mesh, grip, this._notifier); + public createClickMenu(mesh: AbstractMesh, input: WebXRInputSource): ClickMenu { + const clickMenu = new ClickMenu(mesh, input, this._notifier); clickMenu.onClickMenuObservable.add((evt: ActionEvent) => { console.log(evt); switch (evt.source.id) { diff --git a/src/menus/clickMenu.ts b/src/menus/clickMenu.ts index b3b4fb6..a76edc4 100644 --- a/src/menus/clickMenu.ts +++ b/src/menus/clickMenu.ts @@ -1,4 +1,4 @@ -import {AbstractMesh, ActionEvent, Observable, Scene, TransformNode, Vector3} from "@babylonjs/core"; +import {AbstractMesh, ActionEvent, Observable, Scene, TransformNode, Vector3, WebXRInputSource} from "@babylonjs/core"; import {DiagramEvent, DiagramEventType} from "../diagram/types/diagramEntity"; import {toDiagramEntity} from "../diagram/functions/toDiagramEntity"; import {DiagramConnection} from "../diagram/diagramConnection"; @@ -15,7 +15,8 @@ export class ClickMenu { public onClickMenuObservable: Observable = new Observable(); private _diagramEventObservable: Observable; - constructor(mesh: AbstractMesh, grip: TransformNode, diagramEventObservable: Observable) { + constructor(mesh: AbstractMesh, input: WebXRInputSource, diagramEventObservable: Observable) { + const grip = input.grip; this._mesh = mesh; this._diagramEventObservable = diagramEventObservable; //this.diagramManager = diagramManager; @@ -63,9 +64,22 @@ export class ClickMenu { }, -1, false, this, false); - this.transform.position = mesh.absolutePosition.clone(); - this.transform.position.y = mesh.getBoundingInfo().boundingBox.maximumWorld.y + .1; - this.transform.billboardMode = TransformNode.BILLBOARDMODE_Y; + const meshPos = mesh.absolutePosition.clone(); + const camPos = scene.activeCamera.globalPosition.clone(); + const direction = meshPos.subtract(camPos).normalize(); + + //const {min, max} = mesh.getHierarchyBoundingVectors(true); + + this.transform.position = camPos.add(direction.scale(.8)); + this.transform.lookAt(meshPos); + this.transform.position.y = this.transform.position.y - .2; + + //this.transform.billboardMode = TransformNode.BILLBOARDMODE_Y; + const platform = scene.getMeshByName("platform"); + this.transform.setParent(platform); + + + } private makeNewButton(name: string, id: string, scene: Scene, x: number): HtmlButton { diff --git a/src/vrApp.ts b/src/vrApp.ts index b33137c..8240492 100644 --- a/src/vrApp.ts +++ b/src/vrApp.ts @@ -75,15 +75,15 @@ export class VrApp { */ /* - const chair = new GaussianSplattingMesh('chair', null, scene); - const m = await chair.loadFileAsync('https://models.deepdiagram.com/drill1.ply'); + const chair = new GaussianSplattingMesh('chair', null, scene); + const m = await chair.loadFileAsync('https://models.deepdiagram.com/house.ply'); - chair.position.y = 1.6; - chair.rotation.y = Math.PI; - chair.scaling = chair.scaling.scale(3); - chair.showBoundingBox = true; + chair.position.y = 1.6; + chair.rotation.y = Math.PI; + chair.scaling = chair.scaling.scale(1); + chair.showBoundingBox = true; - */ + */ const el = document.querySelector('#download'); if (el) { el.addEventListener('click', () => {