Terminal implement typ

2024-12-18 11:17:29 +01:00 · 2024-12-18 11:17:29 +01:00 · ba6022747f
parent 7cc580cff6
commit ba6022747f
7 changed files with 1164 additions and 3 deletions
--- a/.gitignore
+++ b/.gitignore
@ -1,3 +1,2 @@
-.hugo_build.lock
-public
-resources/_gen
+/target
+/dist
--- a/Cargo.lock
+++ b/Cargo.lock
--- a/Cargo.toml
+++ b/Cargo.toml
@ -0,0 +1,12 @@
+[package]
+name = "vanten-s"
+version = "0.1.0"
+edition = "2021"
+
+[dependencies]
+log = "0.4.22"
+wasm-logger = "0.2.0"
+web-sys = "0.3.76"
+# this is the development version of Yew
+yew = { git = "https://github.com/yewstack/yew/", features = ["csr"] }
+
--- a/Trunk.toml
+++ b/Trunk.toml
--- a/index.html
+++ b/index.html
@ -0,0 +1,9 @@
+<!doctype html>
+<html>
+    <head>
+        <meta charset="utf-8" />
+        <title>Yew App</title>
+        <link data-trunk rel="css" href="main.css"/>
+    </head>
+    <body></body>
+</html>
--- a/shell.nix
+++ b/shell.nix
@ -0,0 +1,15 @@
+{ pkgs ? import <nixpkgs> {} }:
+
+pkgs.mkShell rec {
+    buildInputs = with pkgs; [
+      rustup
+      trunk
+    ];
+    RUSTC_VERSION = "stable"; 
+    shellHook = ''
+      rustup default $RUSTC_VERSION
+      rustup component add rust-analyzer
+      export PATH=$PATH:''${CARGO_HOME:-~/.cargo}/bin
+      export PATH=$PATH:''${RUSTUP_HOME:-~/.rustup}/toolchains/nightly-x86_64-unknown-linux-gnu/bin/
+    '';
+}
--- a/src/main.rs
+++ b/src/main.rs
@ -0,0 +1,73 @@
+use yew::prelude::*;
+use log::info;
+use web_sys::{wasm_bindgen::{JsCast, UnwrapThrowExt}, HtmlInputElement};
+
+#[function_component]
+fn App() -> Html {
+    let rader: UseStateHandle<Vec<String>> = use_state(Vec::new);
+
+    let rader_handle = rader.clone();
+    let push_rad = move |rad| {
+        info!("{}", rad);
+        let handle = rader_handle.clone();
+        let mut val = (*handle).clone();
+        val.push(rad);
+        rader_handle.set(val);
+    };
+
+    html! {
+        <div>
+            <Terminal rader = { (*rader).clone() } />
+            <Input { push_rad } />
+        </div>
+    }
+}
+
+#[derive(Properties, PartialEq)]
+struct InputProps {
+    pub push_rad: Callback<String>
+}
+
+#[function_component]
+fn Input(props: &InputProps) -> Html {
+    let push_rad = props.push_rad.clone();
+
+    let onchange = move |event: Event| {
+        let target: HtmlInputElement = event.target().unwrap_throw().dyn_into().unwrap_throw();
+        let value = target.value();
+        target.set_value("");
+        push_rad.emit(value);
+    };
+
+    html! {
+        <input { onchange } type="text" class="input"/>
+    }
+}
+
+#[derive(Properties, PartialEq)]
+struct TerminalProps {
+    pub rader: Vec<String>,
+}
+
+#[function_component]
+fn Terminal(props: &TerminalProps) -> Html {
+    let rader: Vec<_> = props.rader.iter().map(|rad| 
+        html! {
+            <>
+                <span> { rad } </span>
+                <br />
+            </>
+        }
+    ).collect();
+
+    html! {
+        <div id="terminal" class="terminal">
+            { rader }
+        </div>
+    }
+}
+
+fn main() {
+    wasm_logger::init(wasm_logger::Config::default());
+    yew::Renderer::<App>::new().render();
+}