Issue #292: Initial rotating of camera

src/apps/viewer/index.ts

@@ -26,7 +26,8 @@ import { Expression } from '../../mol-script/language/expression';
 import { PluginStateObject } from '../../mol-plugin-state/objects';
 import { MembraneOrientation } from '../../extensions/tmdet/prop';
 import { MEMBRANE_STORAGE_KEY } from '../../extensions/tmdet/algorithm';
-import { Vec3 } from '../../mol-math/linear-algebra';
+import { Quat, Vec3 } from '../../mol-math/linear-algebra';
+import { PluginCommands } from '../../mol-plugin/commands';
 
 require('mol-plugin-ui/skin/light.scss');
 
@@ -138,7 +139,9 @@ export class Viewer {
         //
         // reset the camera because the membranes render 1st and the structure might not be fully visible
         //
-        requestAnimationFrame(() => this.plugin.canvas3d?.requestCameraReset());
+        this.rotateCamera();
+
+        //requestAnimationFrame(() => this.plugin.canvas3d?.requestCameraReset());
     }
 
     private createRegionRepresentation(chain: string, region: any, update: StateBuilder.To<any, any>) {
@@ -164,6 +167,33 @@ export class Viewer {
         return query;
     }
 
+    private rotateCamera(): void {
+        function rot90q(v: Vec3, axis: Vec3 = Vec3.create(1, 0, 0)): Vec3 {
+            const q = Quat.setAxisAngle(Quat(), axis, -Math.PI/2);
+            return Vec3.transformQuat(Vec3(), v, q);
+        }
+        function sub(v: Vec3, u: Vec3): Vec3 {
+            return Vec3.sub(Vec3(), v, u);
+        }
+        function add(v: Vec3, u: Vec3): Vec3 {
+            return Vec3.add(Vec3(), v, u);
+        }
+
+
+        const cam = this.plugin.canvas3d!.camera;
+        const snapshot = cam.getSnapshot();
+        const newSnapshot = {
+            ...snapshot,
+            // target + rotateBy90(postition - target)
+            position: add(snapshot.target, rot90q(sub(snapshot.position, snapshot.target))),
+            target: snapshot.target,
+            up: Vec3.negUnitZ
+        };
+
+        PluginCommands.Camera.Reset(this.plugin, { snapshot: newSnapshot, durationMs: 1000 });
+        //requestAnimationFrame(() => this.plugin.canvas3d?.requestCameraReset({ snapshot: newSnapshot }));
+    }
+
     ////////////////////////////// END OF PROTOTYPING SECTION