tween

graphics/src/camera/geometry.rs

@@ -1,5 +1,6 @@
 use cgmath::InnerSpace;
 
+#[derive(Debug, Clone, Copy)]
 pub struct CameraGeometry {
     eye: cgmath::Point3<f32>,
     target: cgmath::Point3<f32>,
@@ -19,6 +20,24 @@ impl CameraGeometry {
         }
     }
 
+    pub fn tween(&mut self, goal: &CameraGeometry, prop: f32) {
+        self.eye = cgmath::Point3::new(
+            self.eye.x + (goal.eye.x - self.eye.x) * prop,
+            self.eye.y + (goal.eye.y - self.eye.y) * prop,
+            self.eye.z + (goal.eye.z - self.eye.z) * prop,
+        );
+        self.target = cgmath::Point3::new(
+            self.target.x + (goal.target.x - self.target.x) * prop,
+            self.target.y + (goal.target.y - self.target.y) * prop,
+            self.target.z + (goal.target.z - self.target.z) * prop,
+        );
+        self.up_axis = cgmath::Vector3::new(
+            self.up_axis.x + (goal.up_axis.x - self.up_axis.x) * prop,
+            self.up_axis.y + (goal.up_axis.y - self.up_axis.y) * prop,
+            self.up_axis.z + (goal.up_axis.z - self.up_axis.z) * prop,
+        );
+    }
+
     pub fn build_view_matrix(&self) -> cgmath::Matrix4<f32> {
         cgmath::Matrix4::look_at_rh(self.eye, self.target, self.up_axis)
     }

graphics/src/camera/perspective.rs

@@ -23,7 +23,8 @@ const KEY_ROTATE_RIGHT: &str = "l";
 const KEY_ROTATE_LEFT: &str = "j";
 
 pub struct CameraPerspective {
-    geom: CameraGeometry,
+    geom_current: CameraGeometry,
+    geom_goal: CameraGeometry,
     speed: f32,
     aspect: f32,
     fovy: f32,
@@ -41,7 +42,8 @@ impl CameraPerspective {
         zfar: f32,
     ) -> Self {
         Self {
-            geom,
+            geom_current: geom,
+            geom_goal: geom,
             speed,
             aspect,
             fovy,
@@ -55,12 +57,12 @@ impl CameraPerspective {
     }
 
     pub fn build_uniform(&self) -> CameraUniform {
-        let view = self.geom.build_view_matrix();
+        let view = self.geom_current.build_view_matrix();
         let proj = cgmath::perspective(cgmath::Deg(self.fovy), self.aspect, self.znear, self.zfar);
         let view_proj = OPENGL_TO_WGPU_MATRIX * proj * view;
         CameraUniform {
-            view_pos: self.geom.build_pos_vec().into(),
-            target_pos: self.geom.build_target_vec().into(),
+            view_pos: self.geom_current.build_pos_vec().into(),
+            target_pos: self.geom_current.build_target_vec().into(),
             view_proj: view_proj.into(),
             aspect: self.aspect,
             _padding: [0.0; 7],
@@ -72,17 +74,21 @@ impl CameraPerspective {
             .iter()
             .filter(|(_, state)| state.is_pressing())
             .for_each(|(key, _)| match key.as_str() {
-                KEY_MOVE_FORWARD => self.geom.move_forward(self.speed),
-                KEY_MOVE_BACKWARD => self.geom.move_backward(self.speed),
-                KEY_MOVE_UP => self.geom.move_up(self.speed),
-                KEY_MOVE_DOWN => self.geom.move_down(self.speed),
-                KEY_MOVE_RIGHT => self.geom.move_right(self.speed),
-                KEY_MOVE_LEFT => self.geom.move_left(self.speed),
-                KEY_ROTATE_RIGHT => self.geom.rotate_right(self.speed),
-                KEY_ROTATE_LEFT => self.geom.rotate_left(self.speed),
-                KEY_ROTATE_UP => self.geom.rotate_up(self.speed),
-                KEY_ROTATE_DOWN => self.geom.rotate_down(self.speed),
+                KEY_MOVE_FORWARD => self.geom_goal.move_forward(self.speed),
+                KEY_MOVE_BACKWARD => self.geom_goal.move_backward(self.speed),
+                KEY_MOVE_UP => self.geom_goal.move_up(self.speed),
+                KEY_MOVE_DOWN => self.geom_goal.move_down(self.speed),
+                KEY_MOVE_RIGHT => self.geom_goal.move_right(self.speed),
+                KEY_MOVE_LEFT => self.geom_goal.move_left(self.speed),
+                KEY_ROTATE_RIGHT => self.geom_goal.rotate_right(self.speed),
+                KEY_ROTATE_LEFT => self.geom_goal.rotate_left(self.speed),
+                KEY_ROTATE_UP => self.geom_goal.rotate_up(self.speed),
+                KEY_ROTATE_DOWN => self.geom_goal.rotate_down(self.speed),
                 _ => {}
             });
     }
+
+    pub fn tween(&mut self, prop: f32) {
+        self.geom_current.tween(&self.geom_goal, prop);
+    }
 }

graphics/src/state.rs

@@ -403,6 +403,7 @@ impl State {
     #[wasm_bindgen]
     pub async fn update(&mut self, _time: f32) {
         self.camera.perspective.process_events(&self.key_states);
+        self.camera.perspective.tween(0.15);
         self.queue.write_buffer(
             &self.camera.buffer,
             0,

view/index.html

@@ -12,6 +12,7 @@
       body {
         margin: 0;
         padding: 0;
+        overflow: hidden;
       }
     </style>
   </head>