目立つ機能も追加

sample_codes/showcase/src/lib.rs

@@ -94,6 +94,21 @@ pub fn change_theme_light() {
     ));
 }
 
+#[cfg_attr(target_arch = "wasm32", wasm_bindgen)]
+pub fn zoom_in() {
+    send_action(Action::new_command("world", "forward"));
+}
+
+#[cfg_attr(target_arch = "wasm32", wasm_bindgen)]
+pub fn zoom_out() {
+    send_action(Action::new_command("world", "back"));
+}
+
+#[cfg_attr(target_arch = "wasm32", wasm_bindgen)]
+pub fn toggle_psychedelic() {
+    send_action(Action::new_command("world", "toggle-psychedelic"));
+}
+
 #[cfg_attr(target_arch = "wasm32", wasm_bindgen)]
 pub fn send_log(message: &str) {
     log::warn!("{}", message);

site/src/showcase.md

@@ -10,8 +10,13 @@ Click area and edit it!
 <input id="dark-mode-button" type="button" value="Dark mode"></input>
 <input id="light-mode-button" type="button" value="Light mode"></input>
 
+<input id="zoom-in-button" type="button" value="Zoom In"></input>
+<input id="zoom-out-button" type="button" value="Zoom Out"></input>
+
+<input id="psychedelic-mode-button" type="button" value="TOGGLE PSYCHEDELIC MODE"></input>
+
 <script type="module">
-  import init, { send_log, toggle_direction, look_current_and_centering, change_theme_dark, change_theme_light } from "./wasm/showcase/showcase.js";
+  import init, { send_log, toggle_direction, look_current_and_centering, change_theme_dark, change_theme_light, zoom_in, zoom_out, toggle_psychedelic } from "./wasm/showcase/showcase.js";
   init().then(() => {
     console.log("WASM Loaded");
     send_log("Hello from JS");
@@ -27,6 +32,15 @@ Click area and edit it!
     document.getElementById("light-mode-button").addEventListener("click", () => {
       change_theme_light();
     });
+    document.getElementById("zoom-in-button").addEventListener("click", () => {
+      zoom_in();
+    });
+    document.getElementById("zoom-out-button").addEventListener("click", () => {
+      zoom_out();
+    });
+    document.getElementById("psychedelic-mode-button").addEventListener("click", () => {
+      toggle_psychedelic();
+    });
   });
 </script>