wip frontend

2023-06-11 07:47:01 +02:00
parent 6e845907d1
commit bfabcc0abc
15 changed files with 771 additions and 18 deletions
--- a/crates/frontend/src/components/achievement.rs
+++ b/crates/frontend/src/components/achievement.rs
@@ -0,0 +1 @@
+
--- a/crates/frontend/src/components/admin.rs
+++ b/crates/frontend/src/components/admin.rs
@@ -0,0 +1,9 @@
+use crate::Route;
+use yew::functional::*;
+use yew::prelude::*;
+use yew_router::prelude::*;
+
+#[function_component(Admin)]
+pub fn admin() -> Html {
+    html! {}
+}
--- a/crates/frontend/src/components/mod.rs
+++ b/crates/frontend/src/components/mod.rs
@@ -0,0 +1,3 @@
+pub mod achievement;
+pub mod admin;
+pub mod root;
--- a/crates/frontend/src/components/root.rs
+++ b/crates/frontend/src/components/root.rs
@@ -0,0 +1,26 @@
+use crate::Route;
+use yew::functional::*;
+use yew::prelude::*;
+use yew_router::prelude::*;
+
+#[function_component(Root)]
+pub fn root() -> Html {
+    let app_state = use_context::<crate::AppState>().expect("no context found");
+
+    let achievements = app_state
+        .state
+        .achievements
+        .iter()
+        .map(|a| {
+            html! {
+                <p>{format!("{}", a.goal)}</p>
+            }
+        })
+        .collect::<Html>();
+
+    html! {
+        <div>
+            {achievements}
+        </div>
+    }
+}
--- a/crates/frontend/src/main.rs
+++ b/crates/frontend/src/main.rs
@@ -1 +1,64 @@
-fn main() {}
+use components::admin::Admin;
+use components::root::Root;
+use std::rc::Rc;
+use yew::prelude::*;
+use yew_router::BrowserRouter;
+use yew_router::Routable;
+use yew_router::Switch;
+
+mod components;
+mod services;
+
+#[derive(Debug, Clone, Copy, PartialEq, Routable)]
+enum Route {
+    #[at("/")]
+    Root,
+    #[at("/chat")]
+    Admin,
+    #[not_found]
+    #[at("/404")]
+    NotFound,
+}
+
+fn switch(selected_route: Route) -> Html {
+    match selected_route {
+        Route::Root => html! {<Root />},
+        Route::Admin => html! {<Admin/>},
+        Route::NotFound => html! {<h1>{"404 not found"}</h1>},
+    }
+}
+
+#[derive(Default, Clone, Debug, PartialEq, Eq)]
+struct AppStateInner {
+    state: common::State,
+}
+type AppState = Rc<AppStateInner>;
+
+#[function_component]
+fn App() -> Html {
+    // let counter = use_state(|| 0);
+    // let onclick = {
+    //     let counter = counter.clone();
+    //     move |_| {
+    //         let value = *counter + 1;
+    //         counter.set(value);
+    //     }
+    // };
+
+    let ctx = use_state(|| Rc::new(AppStateInner::default()));
+
+    html! {
+        <ContextProvider<AppState> context={(*ctx).clone()}>
+        <BrowserRouter>
+            <div class="flex w-screen h-screen">
+                <Switch<Route> render={switch}/>
+            </div>
+        </BrowserRouter>
+        </ContextProvider<AppState>>
+    }
+}
+
+fn main() {
+    wasm_logger::init(wasm_logger::Config::default());
+    yew::Renderer::<App>::new().render();
+}
--- a/crates/frontend/src/services/mod.rs
+++ b/crates/frontend/src/services/mod.rs
@@ -0,0 +1 @@
+pub mod websocket;
--- a/crates/frontend/src/services/websocket.rs
+++ b/crates/frontend/src/services/websocket.rs
@@ -0,0 +1,49 @@
+use futures::channel::mpsc::Sender;
+use futures::SinkExt;
+use futures::StreamExt;
+use reqwasm::websocket::futures::WebSocket;
+use reqwasm::websocket::Message;
+use wasm_bindgen_futures::spawn_local;
+
+pub struct WebsocketService {
+    pub tx: Sender<String>,
+}
+
+impl WebsocketService {
+    pub fn new() -> Self {
+        let ws = WebSocket::open("ws://127.0.0.1:4000").unwrap();
+
+        let (mut write, mut read) = ws.split();
+
+        let (in_tx, mut in_rx) = futures::channel::mpsc::channel::<String>(1000);
+
+        spawn_local(async move {
+            while let Some(s) = in_rx.next().await {
+                log::debug!("got event from channel! {}", s);
+                write.send(Message::Text(s)).await.unwrap();
+            }
+        });
+
+        spawn_local(async move {
+            while let Some(msg) = read.next().await {
+                match msg {
+                    Ok(Message::Text(data)) => {
+                        log::debug!("from websocket: {}", data);
+                    }
+                    Ok(Message::Bytes(b)) => {
+                        let decoded = std::str::from_utf8(&b);
+                        if let Ok(val) = decoded {
+                            log::debug!("from websocket: {}", val);
+                        }
+                    }
+                    Err(e) => {
+                        log::error!("ws: {:?}", e)
+                    }
+                }
+            }
+            log::debug!("WebSocket Closed");
+        });
+
+        Self { tx: in_tx }
+    }
+}