diff options
| author | Kjetil Orbekk <kj@orbekk.com> | 2022-10-07 10:05:58 -0400 |
|---|---|---|
| committer | Kjetil Orbekk <kj@orbekk.com> | 2022-10-07 10:05:58 -0400 |
| commit | 01753ebd32e4e0fa8adb11fb02a77720773e3018 (patch) | |
| tree | e632d32998ae8af88a90d03e1b96882de42a4b07 /webapp | |
| parent | 89d2868840a8689b8727c9cfad96eee10c4b517c (diff) | |
Add multi-page routing to the webapp
Diffstat (limited to 'webapp')
| -rw-r--r-- | webapp/Cargo.toml | 1 | ||||
| -rw-r--r-- | webapp/src/default.css | 4 | ||||
| -rw-r--r-- | webapp/src/main.rs | 31 |
3 files changed, 31 insertions, 5 deletions
diff --git a/webapp/Cargo.toml b/webapp/Cargo.toml index 39995a9..fe7addb 100644 --- a/webapp/Cargo.toml +++ b/webapp/Cargo.toml @@ -19,6 +19,7 @@ lazy_static = "1.4" gloo-net = "0.2.4" wasm-bindgen-futures = "0.4.33" data = { path = "../data" } +yew-router = "0.16.0" [dev-dependencies] env_logger = "0.8.4" diff --git a/webapp/src/default.css b/webapp/src/default.css index 9238804..72080dd 100644 --- a/webapp/src/default.css +++ b/webapp/src/default.css @@ -10,12 +10,12 @@ body { margin: 0; } -.app { +.game-layout { display: grid; grid-template-areas: "north north north nav" "west center east nav" "south south south nav"; - grid-template-rows: 10vw minmax(400px, 1fr) 10vw; + grid-template-rows: 10vw minmax(200px, 1fr) 10vw; grid-template-columns: 10vw 1fr 10vw 10vw; width: 100vw; height: 100vh; diff --git a/webapp/src/main.rs b/webapp/src/main.rs index ede4390..6fcf59f 100644 --- a/webapp/src/main.rs +++ b/webapp/src/main.rs @@ -2,6 +2,7 @@ use data::MyMessage; #[allow(unused_imports)] use log::{debug, error, info, warn}; use yew::prelude::*; +use yew_router::prelude::*; pub mod bridge_engine; pub mod card; pub mod components; @@ -12,6 +13,14 @@ extern crate wee_alloc; // Use `wee_alloc` as the global allocator. #[global_allocator] static ALLOC: wee_alloc::WeeAlloc = wee_alloc::WeeAlloc::INIT; +#[derive(Clone, Routable, PartialEq)] + +enum Route { + #[at("/")] + Home, + #[at("/playground")] + Playground, +} fn main() { std::panic::set_hook(Box::new(console_error_panic_hook::hook)); @@ -46,13 +55,29 @@ pub fn app() -> Html { html! { <> - <div class="app"> - <Game /> - </div> + <BrowserRouter> + <Switch<Route> render={Switch::render(switch)} /> + </BrowserRouter> </> } } +fn switch(routes: &Route) -> Html { + match routes { + Route::Home => html! { + <> + <p>{ "Hello!" }</p> + <p> + <Link<Route> to={Route::Playground}>{ "Playground" }</Link<Route>> + </p> + </> + }, + Route::Playground => html! { + <div class="game-layout"><Game /></div> + }, + } +} + #[cfg(test)] mod tests { pub fn test_setup() { |