diff --git a/Cargo.toml b/Cargo.toml index dc9ac83..3562c4c 100644 --- a/Cargo.toml +++ b/Cargo.toml @@ -4,7 +4,7 @@ authors = [ ] categories = ["wasm", "web-programming", "sslvpn"] description = "" -edition = "2018" +edition = "2021" keywords = ["yew", "wasm", "wasm-bindgen", "web", "sslvpn"] license = "MIT" name = "webgateway" @@ -19,6 +19,9 @@ crate-type = ["cdylib", "rlib"] [dependencies] wasm-bindgen = "^0.2" yew = "0.18" +js-sys = "0.3.55" +web-sys = "0.3.55" +yew-router = "0.15" # The `console_error_panic_hook` crate provides better debugging of panics by # logging them with `console.error`. This is great for development, but requires # all the `std::fmt` and `std::panicking` infrastructure, so isn't great for diff --git a/src/app.rs b/src/app.rs index 7da94f3..7fba67a 100644 --- a/src/app.rs +++ b/src/app.rs @@ -1,4 +1,40 @@ +use std::borrow::Cow; + +use crate::pages::{page_home::PageHome, page_not_found::PageNotFound, page_ssh::PageSsh}; +use yew::html::IntoPropValue; use yew::prelude::*; +use yew::services::ConsoleService; +use yew::virtual_dom::VNode; +use yew::Component; +use yew_router::prelude::*; +use yew_router::{router::Router, Switch}; + +#[derive(Switch, Clone, Debug)] +enum AppRoute { + // #[at("/ssh/:id")] + // Ssh(i32), + #[to = "/ssh"] + Ssh, + #[to = "/!"] + Home, + #[to = ""] + NotFound, +} + +impl Into<&str> for AppRoute { + fn into(self) -> &'static str { + match self { + AppRoute::Ssh => &"/ssh", + _ => &"/", + } + } +} + +impl IntoPropValue>> for AppRoute { + fn into_prop_value(self: AppRoute) -> Option> { + Some(Cow::Borrowed(self.into())) + } +} pub struct App {} @@ -8,8 +44,8 @@ impl Component for App { type Message = Msg; type Properties = (); - fn create(_: Self::Properties, _: ComponentLink) -> Self { - App {} + fn create(_: Self::Properties, _link: ComponentLink) -> Self { + Self {} } fn update(&mut self, _msg: Self::Message) -> ShouldRender { @@ -20,9 +56,61 @@ impl Component for App { false } - fn view(&self) -> Html { + fn view(&self) -> VNode { html! { -

{ "Hello world!\n\n\n\n" }

+ <> + { self.view_nav() } +
+ + render = Router::render(Self::switch) + redirect=Router::redirect(|route: Route| { + ConsoleService::log(&format!("{:?}", route)); + AppRoute::NotFound + }) + /> +
+ + + } + } +} + +impl App { + fn view_nav(&self) -> Html { + html! { + + } + } + + fn switch(switch: AppRoute) -> Html { + ConsoleService::log(&format!("{:?}", switch)); + match switch { + // Route::Ssh(ip) => { + // html! { } + // } + AppRoute::Ssh => { + html! {} + } + AppRoute::Home => { + html! {} + } + AppRoute::NotFound => { + html! { } + } } } } diff --git a/src/lib.rs b/src/lib.rs index 98fc652..0ed2799 100644 --- a/src/lib.rs +++ b/src/lib.rs @@ -1,7 +1,10 @@ mod app; mod utils; +mod pages; use wasm_bindgen::prelude::*; +use wasm_bindgen::JsCast; +use web_sys::{console, KeyboardEvent}; #[cfg(feature = "wee_alloc")] #[global_allocator] @@ -9,6 +12,20 @@ static ALLOC: wee_alloc::WeeAlloc = wee_alloc::WeeAlloc::INIT; #[wasm_bindgen] pub fn run_app() -> Result<(), JsValue> { + let window = web_sys::window().unwrap(); + let handler_submit = move |e: KeyboardEvent| { + e.stop_propagation(); + console::log_1(&format!("{:?}", e).into()) + }; + + let handler = Box::new(handler_submit) as Box; + + let cb = Closure::wrap(handler); + + window + .add_event_listener_with_callback("keydown", cb.as_ref().unchecked_ref()) + .unwrap(); + cb.forget(); yew::start_app::(); Ok(()) diff --git a/src/pages/mod.rs b/src/pages/mod.rs new file mode 100644 index 0000000..5fd035d --- /dev/null +++ b/src/pages/mod.rs @@ -0,0 +1,3 @@ +pub mod page_home; +pub mod page_not_found; +pub mod page_ssh; diff --git a/src/pages/page_home.rs b/src/pages/page_home.rs new file mode 100644 index 0000000..4eb19cb --- /dev/null +++ b/src/pages/page_home.rs @@ -0,0 +1,39 @@ +use yew::prelude::*; +use yew::Component; +use yew::ShouldRender; + +pub struct PageHome; + +impl Component for PageHome { + type Message = (); + type Properties = (); + + fn create(_props: Self::Properties, _link: ComponentLink) -> Self { + Self + } + + fn view(&self) -> Html { + html! { +
+
+
+

+ { "Hello World" } +

+

+ { "Hello again" } +

+
+
+
+ } + } + + fn update(&mut self, _msg: Self::Message) -> ShouldRender { + true + } + + fn change(&mut self, _props: Self::Properties) -> ShouldRender { + false + } +} diff --git a/src/pages/page_not_found.rs b/src/pages/page_not_found.rs new file mode 100644 index 0000000..71cb76b --- /dev/null +++ b/src/pages/page_not_found.rs @@ -0,0 +1,39 @@ +use yew::prelude::*; +use yew::Component; +use yew::ShouldRender; + +pub struct PageNotFound; + +impl Component for PageNotFound { + type Message = (); + type Properties = (); + + fn create(_props: Self::Properties, _link: ComponentLink) -> Self { + Self + } + + fn view(&self) -> Html { + html! { +
+
+
+

+ { "Page not found" } +

+

+ { "Page page does not seem to exist" } +

+
+
+
+ } + } + + fn update(&mut self, _msg: Self::Message) -> ShouldRender { + false + } + + fn change(&mut self, _props: Self::Properties) -> ShouldRender { + false + } +} diff --git a/src/pages/page_ssh.rs b/src/pages/page_ssh.rs new file mode 100644 index 0000000..e958909 --- /dev/null +++ b/src/pages/page_ssh.rs @@ -0,0 +1,28 @@ +use yew::prelude::*; + +pub struct PageSsh {} + +pub enum Msg {} + +impl Component for PageSsh { + type Message = Msg; + type Properties = (); + + fn create(_: Self::Properties, _: ComponentLink) -> Self { + PageSsh {} + } + + fn update(&mut self, _msg: Self::Message) -> ShouldRender { + true + } + + fn change(&mut self, _: Self::Properties) -> ShouldRender { + false + } + + fn view(&self) -> Html { + html! { +

{ "Hello ssh!\n\n\n\n" }

+ } + } +} diff --git a/www/index.html b/www/index.html index 9f26fed..d5a5c28 100644 --- a/www/index.html +++ b/www/index.html @@ -4,9 +4,37 @@ Hello, World + + \ No newline at end of file