Orbit Around Cursor

packages/viewer-sandbox/src/main.ts

@@ -4,9 +4,9 @@ import {
   SelectionEvent,
   ViewerEvent,
   Viewer,
-  CameraController,
   ViewModes,
-  SelectionExtension
+  SelectionExtension,
+  CameraController
 } from '@speckle/viewer'
 
 import './style.css'
@@ -20,6 +20,7 @@ import {
 import { SectionTool } from '@speckle/viewer'
 import { SectionOutlines } from '@speckle/viewer'
 import { ViewModesKeys } from './Extensions/ViewModesKeys'
+// import { JSONSpeckleStream } from './JSONSpeckleStream'
 import { BoxSelection } from './Extensions/BoxSelection'
 
 const createViewer = async (containerName: string, _stream: string) => {
@@ -111,7 +112,7 @@ const getStream = () => {
     // prettier-ignore
     // 'https://app.speckle.systems/streams/da9e320dad/commits/5388ef24b8?c=%5B-7.66134,10.82932,6.41935,-0.07739,-13.88552,1.8697,0,1%5D'
     // Revit sample house (good for bim-like stuff with many display meshes)
-    // 'https://app.speckle.systems/streams/da9e320dad/commits/5388ef24b8'
+    'https://app.speckle.systems/streams/da9e320dad/commits/5388ef24b8'
     // 'https://latest.speckle.systems/streams/c1faab5c62/commits/ab1a1ab2b6'
     // 'https://app.speckle.systems/streams/da9e320dad/commits/5388ef24b8'
     // 'https://latest.speckle.systems/streams/58b5648c4d/commits/60371ecb2d'
@@ -456,10 +457,12 @@ const getStream = () => {
     // Perfectly flat
     // 'https://app.speckle.systems/projects/344f803f81/models/5582ab673e'
 
+    // big baker
+    // 'https://latest.speckle.systems/projects/126cd4b7bb/models/032d09f716'
     // 'https://speckle.xyz/streams/27e89d0ad6/commits/5ed4b74252'
 
     //Gingerbread
-    'https://latest.speckle.systems/projects/387050bffe/models/48f7eb26fb'
+    // 'https://latest.speckle.systems/projects/387050bffe/models/48f7eb26fb'
     // DUI3 Mesh Colors
     // 'https://app.speckle.systems/projects/93200a735d/models/cbacd3eaeb@344a397239'
 

packages/viewer/src/modules/Viewer.ts

@@ -202,7 +202,7 @@ export class Viewer extends EventEmitter implements IViewer {
   }
 
   private update() {
-    const delta = this.clock.getDelta()
+    const delta = this.clock.getDelta() * 1000 // turn to miliseconds
     const extensions = Object.values(this.extensions)
     extensions.forEach((ext: Extension) => {
       ext.onEarlyUpdate(delta)

packages/viewer/src/modules/extensions/CameraController.ts

@@ -94,6 +94,8 @@ export const DefaultOrbitControlsOptions: Required<CameraControllerOptions> = {
   touchAction: 'none',
   infiniteZoom: true,
   zoomToCursor: true,
+  orbitAroundCursor: true,
+  showOrbitPoint: true,
   lookSpeed: 1,
   moveSpeed: 1,
   damperDecay: 30,
@@ -194,8 +196,7 @@ export class CameraController extends Extension implements SpeckleCamera {
       this.perspectiveCamera,
       this.viewer.getContainer(),
       this.viewer.World,
-      this.viewer.getRenderer().scene,
-      this.viewer.getRenderer().intersections,
+      this.viewer.getRenderer(),
       this._options
     )
     orbitControls.enabled = true
@@ -295,8 +296,8 @@ export class CameraController extends Extension implements SpeckleCamera {
     this.emit(CameraEvent.Dynamic)
   }
 
-  public onEarlyUpdate() {
-    const changed = this._activeControls.update()
+  public onEarlyUpdate(_delta?: number) {
+    const changed = this._activeControls.update(_delta)
     if (changed !== this._lastCameraChanged) {
       this.emit(changed ? CameraEvent.Dynamic : CameraEvent.Stationary)
     }

packages/viewer/src/modules/extensions/HybridCameraController.ts

@@ -15,6 +15,7 @@ export class HybridCameraController extends CameraController {
   public constructor(viewer: IViewer) {
     super(viewer)
     document.addEventListener('keydown', this.onKeyDown.bind(this))
+    document.addEventListener('keyup', this.onKeyUp.bind(this))
   }
 
   protected onKeyDown(event: KeyboardEvent) {

packages/viewer/src/modules/extensions/controls/FlyControls.ts

@@ -63,8 +63,6 @@ class FlyControls extends SpeckleControls {
   }
 
   public set enabled(value: boolean) {
-    if (value) this.connect()
-    else this.disconnect()
     this._enabled = value
   }
 
@@ -109,6 +107,8 @@ class FlyControls extends SpeckleControls {
     this.container = container
     this.world = world
     this._options = Object.assign({}, options)
+
+    this.connect()
   }
 
   public isStationary(): boolean {
@@ -123,9 +123,12 @@ class FlyControls extends SpeckleControls {
     const now = performance.now()
     delta = delta !== undefined ? delta : now - this._lastTick
     this._lastTick = now
-    const deltaSeconds = delta / 1000
 
+    if (!this._enabled) return false
+
+    const deltaSeconds = delta / 1000
     const scaledWalkingSpeed = this.world.getRelativeOffset(0.2) * walkingSpeed
+
     if (this.keyMap.forward)
       this.velocity.z = -scaledWalkingSpeed * this._options.moveSpeed * deltaSeconds
     if (this.keyMap.back)
@@ -145,9 +148,14 @@ class FlyControls extends SpeckleControls {
     if (!this.keyMap.down && !this.keyMap.up) this.velocity.y = 0
 
     if (this.isStationary()) return false
-
     this.moveBy(this.velocity)
 
+    this.updatePositionRotation(delta)
+
+    return true
+  }
+
+  protected updatePositionRotation(delta: number) {
     const diagonal = this.world.worldBox.min.distanceTo(this.world.worldBox.max)
     const minMaxRange = diagonal < 1 ? diagonal : 1
     this.position.x = this.positionXDamper.update(
@@ -175,12 +183,10 @@ class FlyControls extends SpeckleControls {
 
     this.rotate(this.euler)
     this._targetCamera.position.copy(this.position)
-
-    return true
   }
 
   public jumpToGoal(): void {
-    this.update(SETTLING_TIME)
+    this.updatePositionRotation(SETTLING_TIME)
   }
 
   public fitToSphere(sphere: Sphere): void {
@@ -192,14 +198,14 @@ class FlyControls extends SpeckleControls {
     this.goalPosition.copy(pos)
   }
 
-  /** The input position and target will be in a basis with (0,1,0) as up */
+  /** The input position and target will be in a basis with (0,0,1) as up */
   public fromPositionAndTarget(position: Vector3, target: Vector3): void {
     const cPos = this.getPosition()
     const cTarget = this.getTarget()
     if (cPos.equals(position) && cTarget.equals(target)) return
 
-    const tPosition = new Vector3().copy(position).applyMatrix4(this._basisTransform)
-    const tTarget = new Vector3().copy(target).applyMatrix4(this._basisTransform)
+    const tPosition = new Vector3().copy(position)
+    const tTarget = new Vector3().copy(target)
     const matrix = new Matrix4()
       .lookAt(tPosition, tTarget, this._up)
       .premultiply(this._basisTransformInv)
@@ -208,7 +214,7 @@ class FlyControls extends SpeckleControls {
     this.goalPosition.copy(tPosition)
   }
 
-  /** The returned vector needs to be in a basis with (0,1,0) as up */
+  /** The returned vector needs to be in a basis with (0,0,1) as up */
   public getTarget(): Vector3 {
     const target = new Vector3().copy(this.goalPosition)
     const matrix = new Matrix4().makeRotationFromEuler(this.goalEuler)
@@ -217,12 +223,12 @@ class FlyControls extends SpeckleControls {
       .applyMatrix4(this._basisTransform)
       .normalize()
     target.addScaledVector(forward, -this.world.getRelativeOffset(0.2))
-    return target.applyMatrix4(this._basisTransformInv)
+    return target
   }
 
-  /** The returned vector needs to be in a basis with (0,1,0) as up */
+  /** The returned vector needs to be in a basis with (0,0,1) as up */
   public getPosition(): Vector3 {
-    return new Vector3().copy(this.goalPosition).applyMatrix4(this._basisTransformInv)
+    return new Vector3().copy(this.goalPosition)
   }
 
   /**
@@ -292,7 +298,7 @@ class FlyControls extends SpeckleControls {
 
   // event listeners
   protected onMouseMove = (event: PointerEvent) => {
-    if (event.buttons !== 1) return
+    if (event.buttons !== 1 || !this._enabled) return
 
     const movementX = event.movementX || 0
     const movementY = event.movementY || 0

packages/viewer/src/modules/extensions/controls/PivotalControls.ts

@@ -0,0 +1,53 @@
+// import { PerspectiveCamera, OrthographicCamera, Sphere, Vector3 } from 'three'
+// import { SpeckleControls } from './SpeckleControls.js'
+
+// export interface PivotalControlsOptions {}
+
+// export class PivotalControls extends SpeckleControls {
+//   private _enabled: boolean = false
+//   private _options: Required<PivotalControlsOptions> = {}
+
+//   get options(): Partial<PivotalControlsOptions> {
+//     return this._options
+//   }
+//   set options(value: Partial<PivotalControlsOptions>) {
+//     Object.assign(this._options, value)
+//   }
+
+//   get enabled(): boolean {
+//     return this._enabled
+//   }
+//   set enabled(value: boolean) {
+//     this._enabled = value
+//   }
+
+//   set targetCamera(target: PerspectiveCamera | OrthographicCamera) {
+//     throw new Error('Method not implemented.')
+//   }
+
+//   isStationary(): boolean {
+//     throw new Error('Method not implemented.')
+//   }
+
+//   update(delta?: number): boolean {
+//     throw new Error('Method not implemented.')
+//   }
+//   jumpToGoal(): void {
+//     throw new Error('Method not implemented.')
+//   }
+//   fitToSphere(sphere: Sphere): void {
+//     throw new Error('Method not implemented.')
+//   }
+//   dispose(): void {
+//     throw new Error('Method not implemented.')
+//   }
+//   fromPositionAndTarget(position: Vector3, target: Vector3): void {
+//     throw new Error('Method not implemented.')
+//   }
+//   getTarget(): Vector3 {
+//     throw new Error('Method not implemented.')
+//   }
+//   getPosition(): Vector3 {
+//     throw new Error('Method not implemented.')
+//   }
+// }