Oboarding undead-patch (#2456)

* Fixed sandbox lint error

* Added back the polar view and setting it. Changed the onboarding hardoced vectors from Z up to Y up, since that's what the camera controller now requires when setting inline views

packages/frontend-2/components/tour/Segmentation.vue

@@ -64,7 +64,7 @@
   </div>
 </template>
 <script setup lang="ts">
-import { Vector3 } from 'three'
+import { Vector3, Quaternion } from 'three'
 import { useActiveUser } from '~~/lib/auth/composables/activeUser'
 import {
   OnboardingIndustry,
@@ -107,6 +107,7 @@ function setRole(val: OnboardingRole) {
   emit('next')
 }
 
+/** Hardcoded vec3s in Z up space */
 const camPos = [
   [23.86779, 82.9541, 29.05586, -27.41942, 37.72358, 29.05586, 0, 1],
   [23.86779, 82.9541, 29.05586, -27.41942, 37.72358, 29.05586, 0, 1],
@@ -123,15 +124,21 @@ const rotateGently = (factor = 1) => {
 }
 
 function nextView() {
+  /** Camera controls works with vec3s in Y up space when setting inline views
+   *  That's why we're transforming them here
+   */
+  const quaternion = new Quaternion()
+    .setFromUnitVectors(new Vector3(0, 1, 0), new Vector3(0, 0, 1))
+    .invert()
   position.value = new Vector3(
     camPos[step.value][0],
     camPos[step.value][1],
     camPos[step.value][2]
-  )
+  ).applyQuaternion(quaternion)
   target.value = new Vector3(
     camPos[step.value][3],
     camPos[step.value][4],
     camPos[step.value][5]
-  )
+  ).applyQuaternion(quaternion)
 }
 </script>

packages/frontend-2/lib/tour/slideshowItems.ts

@@ -11,20 +11,20 @@ export type SlideshowItem = {
 
 export const items = [
   {
-    camPos: [-31.86138, 41.14196, 15.93344, -22.0765, 35.10095, 15.93344, 0, 1],
+    camPos: [-31.86138, 15.93344, -41.14196, -22.0765, 15.93344, -35.10095, 0, 1],
     style: {} as Partial<CSSProperties>,
     viewed: false,
     showControls: true,
     expanded: true,
     filters: {},
     location: {
-      x: -22.07650243501704,
-      y: 35.10094975369238,
-      z: 15.933444297269238
+      x: -22.0765,
+      y: 35.10095,
+      z: 15.93344
     }
   },
   {
-    camPos: [-3.3795, 40.78977, 23.25852, -20.65056, 40.72203, 21.78906, 0, 1],
+    camPos: [-3.3795, 23.25852, -40.78977, -20.65056, 21.78906, -40.72203, 0, 1],
     style: {} as Partial<CSSProperties>,
     viewed: false,
     showControls: true,
@@ -36,7 +36,7 @@ export const items = [
     }
   },
   {
-    camPos: [-39.91711, 46.26069, 42.83686, -18.44162, 29.75982, 34.91624, 0, 1],
+    camPos: [-39.91711, 42.83686, -46.26069, -18.44162, 34.91624, -29.75982, 0, 1],
     style: {} as Partial<CSSProperties>,
     viewed: false,
     showControls: false,

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

@@ -549,6 +549,15 @@ export class CameraController extends Extension implements SpeckleCamera {
     )
   }
 
+  protected isPolarView(
+    view: CanonicalView | SpeckleView | InlineView | PolarView
+  ): view is PolarView {
+    return (
+      (view as PolarView).azimuth !== undefined &&
+      (view as PolarView).polar !== undefined
+    )
+  }
+
   protected isBox3(
     view: CanonicalView | SpeckleView | InlineView | PolarView | Box3
   ): view is Box3 {
@@ -568,6 +577,9 @@ export class CameraController extends Extension implements SpeckleCamera {
     if (this.isInlineView(view)) {
       this.setViewInline(view, transition)
     }
+    if (this.isPolarView(view)) {
+      this.setViewPolar(view, transition)
+    }
   }
 
   protected setViewSpeckle(view: SpeckleView, transition = true) {
@@ -672,4 +684,14 @@ export class CameraController extends Extension implements SpeckleCamera {
 
     this.enableRotations()
   }
+
+  private setViewPolar(view: PolarView, transition = true) {
+    ;(this._activeControls as SmoothOrbitControls).adjustOrbit(
+      view.azimuth,
+      view.polar,
+      view.radius ? view.radius : 0
+    )
+    if (!transition) this._activeControls.jumpToGoal()
+    this.enableRotations()
+  }
 }