key event

TadaTeruki · Aug 14, 2024 · 46805f5 · 46805f5
1 parent 28eb888
commit 46805f5
Show file tree

Hide file tree

Showing 3 changed files with 77 additions and 1 deletion.
diff --git a/graphics/Cargo.toml b/graphics/Cargo.toml
@@ -16,6 +16,7 @@ web-sys = { version = "0.3", features = [
     "Window",
     "HtmlCanvasElement",
     "Element",
+    "KeyboardEvent",
 ]}
 wasm-logger = "0.2.0"
 wee_alloc = "0.4.5"

diff --git a/graphics/src/state.rs b/graphics/src/state.rs
@@ -1,3 +1,5 @@
+use std::collections::HashMap;
+
 use log::info;
 use wasm_bindgen::prelude::*;
 use wgpu::{util::DeviceExt, SurfaceTarget};
@@ -55,13 +57,22 @@ const VERTICES: &[Vertex] = &[
 
 const INDICES: &[u16] = &[0, 1, 4, 1, 2, 4, 2, 3, 4];
 
+#[derive(Debug, PartialEq, Eq)]
+enum KeyState {
+    Press,
+    Kept,
+    Release,
+}
+
 #[wasm_bindgen]
 pub struct State {
     surface: wgpu::Surface<'static>,
     device: wgpu::Device,
     queue: wgpu::Queue,
     config: wgpu::SurfaceConfiguration,
 
+    key_states: HashMap<String, KeyState>,
+
     render_pipeline: wgpu::RenderPipeline,
     vertex_buffer: wgpu::Buffer,
     index_buffer: wgpu::Buffer,
@@ -212,6 +223,7 @@ impl State {
             device,
             queue,
             config,
+            key_states: HashMap::new(),
             render_pipeline,
             vertex_buffer,
             index_buffer,
@@ -220,7 +232,54 @@ impl State {
     }
 
     #[wasm_bindgen]
-    pub async fn update(&mut self, _time: f32) {}
+    pub fn key_event(&mut self, event: &web_sys::KeyboardEvent) {
+        let released = event.type_() == "keyup";
+        let key = event.key();
+        if released {
+            self.key_states.insert(key, KeyState::Release);
+        } else {
+            if self.key_states.contains_key(&key) {
+                return;
+            }
+            self.key_states.insert(key, KeyState::Press);
+        }
+    }
+
+    fn update_key_states(&mut self) {
+        self.key_states.iter_mut().for_each(|(_, state)| {
+            if *state == KeyState::Press {
+                *state = KeyState::Kept;
+            }
+        });
+        self.key_states
+            .retain(|_, state| *state != KeyState::Release);
+    }
+
+    #[wasm_bindgen]
+    pub fn purge_events(&mut self) {
+        self.key_states.iter_mut().for_each(|(_, state)| {
+            *state = KeyState::Release;
+        });
+    }
+
+    #[wasm_bindgen]
+    pub async fn update(&mut self, _time: f32) {
+        for (key, state) in self.key_states.iter_mut() {
+            match state {
+                KeyState::Press => {
+                    info!("Key {} pressed", key);
+                }
+                KeyState::Release => {
+                    info!("Key {} released", key);
+                }
+                KeyState::Kept => {
+                    info!("Key {} kept", key);
+                }
+            }
+        }
+
+        self.update_key_states();
+    }
 
     #[wasm_bindgen]
     pub fn resize(&mut self, width: u32, height: u32) {

diff --git a/view/src/main.ts b/view/src/main.ts
@@ -40,6 +40,22 @@ async function main() {
 	};
 	requestAnimationFrame(renderloop);
 
+	// key event
+	addEventListener("keydown", (event) => {
+		state.key_event(event);
+	});
+	addEventListener("keyup", (event) => {
+		state.key_event(event);
+	});
+
+	// purge all cached events when the page is not visible
+	document.addEventListener("visibilitychange", () => {
+		state.purge_events();
+	});
+	document.addEventListener("blur", () => {
+		state.purge_events();
+	});
+
 	// `update` is called 60 times per second
 	const updateInterval = 1000 / 60;
 	const initialTime = Date.now();