98 lines
2.4 KiB
Rust
98 lines
2.4 KiB
Rust
use leptos::*;
|
|
use leptos_router::{Outlet, A};
|
|
|
|
#[leptos::component]
|
|
pub fn demo() -> impl leptos::IntoView {
|
|
let params = leptos_router::use_params_map();
|
|
let id = move || params.with(|params| params.get("id").cloned().unwrap_or_default());
|
|
|
|
let demo_info = create_resource(|| (), move |_| async move {
|
|
let res = reqwasm::http::Request::get(&format!("/api/demos/{}/info", id())).send().await.unwrap();
|
|
res.json::<common::DemoInfo>().await.unwrap()
|
|
});
|
|
|
|
let map = move || {
|
|
match demo_info.get() {
|
|
Some(v) => v.map.clone(),
|
|
None => String::new(),
|
|
}
|
|
};
|
|
|
|
let selected_tab = move || {
|
|
let loc = leptos_router::use_location();
|
|
let loc_path = loc.pathname.get();
|
|
let trailing = loc_path.split('/').last();
|
|
trailing.unwrap_or("/").to_owned()
|
|
};
|
|
|
|
let style = stylers::style! {
|
|
"Demo",
|
|
.analysis_bar {
|
|
display: grid;
|
|
grid-template-columns: auto auto;
|
|
column-gap: 20px;
|
|
|
|
background-color: #2d2d2d;
|
|
}
|
|
|
|
.analysis_selector {
|
|
display: inline-block;
|
|
}
|
|
|
|
span {
|
|
display: inline-block;
|
|
|
|
padding: 1vw 1vh;
|
|
color: #d5d5d5;
|
|
background-color: #4d4d4d;
|
|
}
|
|
.current {
|
|
background-color: #5d5d5d;
|
|
}
|
|
};
|
|
|
|
view! {class = style,
|
|
<h2>Demo - { id } - { map }</h2>
|
|
|
|
<div class="analysis_bar">
|
|
<div class="analysis_selector" class:current=move || selected_tab() == "scoreboard"><A href="scoreboard"><span>Scoreboard</span></A></div>
|
|
<div class="analysis_selector" class:current=move || selected_tab() == "perround"><A href="perround"><span>Per Round</span></A></div>
|
|
</div>
|
|
<div>
|
|
<Outlet/>
|
|
</div>
|
|
}
|
|
}
|
|
|
|
#[leptos::component]
|
|
pub fn scoreboard() -> impl leptos::IntoView {
|
|
view! {
|
|
<h2>Scoreboard</h2>
|
|
|
|
<div>
|
|
<h3>Team 1</h3>
|
|
<table>
|
|
<tr>
|
|
<th>Name</th>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
|
|
<div>
|
|
<h3>Team 2</h3>
|
|
<table>
|
|
<tr>
|
|
<th>Name</th>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
}
|
|
}
|
|
|
|
#[leptos::component]
|
|
pub fn per_round() -> impl leptos::IntoView {
|
|
view! {
|
|
<h3>Per Round</h3>
|
|
}
|
|
}
|