Some minor restructuring and improvements
This commit is contained in:
@@ -5,4 +5,8 @@ edition = "2021"
|
||||
|
||||
[dependencies]
|
||||
leptos = { version = "0.6", features = ["csr", "nightly"] }
|
||||
leptos_router = { version = "0.6", features = ["csr"] }
|
||||
reqwasm = "0.5.0"
|
||||
stylers = { version = "0.3" }
|
||||
|
||||
common = { path = "../common/" }
|
||||
|
||||
4
frontend/Trunk.toml
Normal file
4
frontend/Trunk.toml
Normal file
@@ -0,0 +1,4 @@
|
||||
[[hooks]]
|
||||
stage = "post_build"
|
||||
command = "sh"
|
||||
command_arguments = ["-c", "cp ../target/stylers/main.css $TRUNK_STAGING_DIR/"]
|
||||
@@ -1,5 +1,7 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head></head>
|
||||
<head>
|
||||
<link rel="stylesheet" href="/main.css">
|
||||
</head>
|
||||
<body></body>
|
||||
</html>
|
||||
|
||||
17
frontend/src/demo.rs
Normal file
17
frontend/src/demo.rs
Normal file
@@ -0,0 +1,17 @@
|
||||
use leptos::*;
|
||||
|
||||
#[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();
|
||||
dbg!(res.text().await);
|
||||
0
|
||||
});
|
||||
|
||||
view! {
|
||||
<h2>Demo - {id}</h2>
|
||||
}
|
||||
}
|
||||
107
frontend/src/lib.rs
Normal file
107
frontend/src/lib.rs
Normal file
@@ -0,0 +1,107 @@
|
||||
use leptos::*;
|
||||
use leptos_router::A;
|
||||
|
||||
mod demo;
|
||||
pub use demo::Demo;
|
||||
|
||||
#[leptos::component]
|
||||
pub fn demo_list_entry(demo: common::BaseDemoInfo) -> impl leptos::IntoView {
|
||||
view! {
|
||||
<li>
|
||||
<A href=format!("/demo/{}", demo.id)>Demo: {demo.id}</A>
|
||||
</li>
|
||||
}
|
||||
}
|
||||
|
||||
#[leptos::component]
|
||||
pub fn steam_login(height: &'static str, width: &'static str) -> impl leptos::IntoView {
|
||||
view! {
|
||||
<a href="/api/steam/login">
|
||||
<img src="https://community.akamai.steamstatic.com/public/images/signinthroughsteam/sits_01.png" alt="Steam Login" style=format!("height: {height}; width: {width}") />
|
||||
</a>
|
||||
}
|
||||
}
|
||||
|
||||
#[leptos::component]
|
||||
pub fn upload_demo() -> impl leptos::IntoView {
|
||||
use leptos_router::Form;
|
||||
|
||||
view! {
|
||||
<div>
|
||||
<Form action="/api/demos/upload" method="post" enctype="multipart/form-data".to_string()>
|
||||
<p> Select File to upload </p>
|
||||
<input type="file" name="demo" id="demo"></input>
|
||||
<input type="submit" value="Upload Image" name="submit"></input>
|
||||
</Form>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
|
||||
#[leptos::component]
|
||||
pub fn top_bar() -> impl leptos::IntoView {
|
||||
let style = stylers::style! {
|
||||
"TopBar",
|
||||
.bar {
|
||||
width: 100%;
|
||||
height: 4vh;
|
||||
padding-top: 0.5vh;
|
||||
padding-bottom: 0.5vh;
|
||||
|
||||
background-color: #28282f;
|
||||
color: #d5d5d5;
|
||||
}
|
||||
|
||||
.group {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.elem {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.logo {
|
||||
color: #d5d5d5;
|
||||
}
|
||||
};
|
||||
|
||||
view! {class = style,
|
||||
<div class="bar">
|
||||
<A href="/" class="group">
|
||||
<p class="logo">Knifer</p>
|
||||
</A>
|
||||
|
||||
<div class="group" style="float: right">
|
||||
<div class="elem">
|
||||
Upload Demo
|
||||
</div>
|
||||
|
||||
<div class="elem">
|
||||
<SteamLogin height="4vh" width="auto" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
|
||||
#[leptos::component]
|
||||
pub fn homepage() -> impl leptos::IntoView {
|
||||
let demo_data = create_resource(|| (), |_| async move {
|
||||
let res = reqwasm::http::Request::get("/api/demos/list").send().await.unwrap();
|
||||
let demos: Vec<common::BaseDemoInfo> = res.json().await.unwrap();
|
||||
demos
|
||||
});
|
||||
|
||||
view! {
|
||||
<div>
|
||||
<div>
|
||||
<h2>Demos</h2>
|
||||
<UploadDemo />
|
||||
</div>
|
||||
<ul>
|
||||
{ move || demo_data.get().unwrap_or_default().into_iter().map(|demo| crate::DemoListEntry(DemoListEntryProps {
|
||||
demo
|
||||
})).collect::<Vec<_>>() }
|
||||
</ul>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
@@ -1,11 +1,13 @@
|
||||
use leptos::*;
|
||||
use leptos::prelude::*;
|
||||
use leptos_router::*;
|
||||
|
||||
async fn load_demos() -> usize {
|
||||
use frontend::{UploadDemo, TopBar, Homepage, Demo};
|
||||
|
||||
async fn load_demos() -> Vec<common::BaseDemoInfo> {
|
||||
let res = reqwasm::http::Request::get("/api/demos/list").send().await.unwrap();
|
||||
dbg!(res);
|
||||
let demos: Vec<common::BaseDemoInfo> = res.json().await.unwrap();
|
||||
|
||||
0
|
||||
demos
|
||||
}
|
||||
|
||||
fn main() {
|
||||
@@ -14,16 +16,16 @@ fn main() {
|
||||
});
|
||||
|
||||
mount_to_body(move || view! {
|
||||
<p>"Hello, world!"</p>
|
||||
<a href="/api/steam/login">Steam Login</a> { move || match async_data.get() {
|
||||
None => 123,
|
||||
Some(v) => v,
|
||||
} }
|
||||
|
||||
<form action="/api/demos/upload" method="post" enctype="multipart/form-data">
|
||||
Select File to upload
|
||||
<input type="file" name="demo" id="demo"></input>
|
||||
<input type="submit" value="Upload Image" name="submit"></input>
|
||||
</form>
|
||||
<Router>
|
||||
<nav>
|
||||
<TopBar />
|
||||
</nav>
|
||||
<main>
|
||||
<Routes>
|
||||
<Route path="/" view=Homepage />
|
||||
<Route path="/demo/:id" view=Demo />
|
||||
</Routes>
|
||||
</main>
|
||||
</Router>
|
||||
})
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user