Zynh0722/nyazoom
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

askama: welcome view

Browse source
This commit is contained in:
Zynh Ludwig 2024-11-14 06:24:25 -08:00
parent 2a6d62d74b
commit c5185fdcbe
6 changed files with 75 additions and 54 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
src/main.rs
View file

@ -44,9 +44,8 @@ async fn main() -> io::Result<()> {
async fn welcome() -> impl IntoResponse {
let fact = views::get_cat_fact().await;
Html(ssr::render(move || {
leptos::view! { <WelcomePage fact /> }
}))
views::askama::WelcomeTemplate { fact }
}
async fn log_source(

13
src/views/askama.rs Normal file
View file

@ -0,0 +1,13 @@
use askama_axum::Template;
#[derive(Template)]
#[template(path = "welcome.html")]
pub struct WelcomeTemplate {
pub fact: String,
}
impl WelcomeTemplate {
pub fn new(fact: String) -> WelcomeTemplate {
WelcomeTemplate { fact }
}
}

3
src/views/mod.rs
View file

@ -1,13 +1,12 @@
use futures::TryFutureExt;
use serde::Deserialize;
pub mod askama;
pub mod base_page;
pub mod links;
pub mod welcome;
pub use base_page::*;
pub use links::*;
pub use welcome::*;
#[derive(Debug, Deserialize)]
pub struct CatFact {

49
src/views/welcome.rs
View file

@ -1,49 +0,0 @@
use leptos::{component, view, IntoView};
use crate::HtmxPage;
// {https://api.thecatapi.com/v1/images/search?size=small&format=src}
// {https://cataas.com/cat?width=250&height=250}
#[component]
pub fn WelcomePage(fact: String) -> impl IntoView {
view! {
<HtmxPage>
<div class="form-wrapper">
<WelcomeView fact />
</div>
</HtmxPage>
}
}
#[component]
pub fn WelcomeView(fact: String) -> impl IntoView {
view! {
<form
id="form"
hx-swap="outerHTML"
hx-post="/upload"
hx-encoding="multipart/form-data"
class="column-container"
>
<div class="cat-img-wrapper">
<img
class="cat-img"
src="https://api.thecatapi.com/v1/images/search?size=small&format=src"
/>
</div>
<input
type="file"
id="file"
name="file"
data-multiple-caption="{{count}} files selected"
multiple
/>
<label for="file">"Select Files"</label>
<input type="submit" value="Get Link~" />
<p id="cat-fact">{fact}</p>
<progress id="progress" class="htmx-indicator" value="0" max="100"></progress>
</form>
<script src="/scripts/loading_progress.js" />
}
}

21
templates/base.html Normal file
View file

@ -0,0 +1,21 @@
<!doctype html>
<html lang="en">
<head>
<title>Nyazoom</title>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link href="/css/main.css" rel="stylesheet" />
<link href="/css/link.css" rel="stylesheet" />
<script src="/scripts/file_label.js"></script>
<script src="/scripts/link.js"></script>
<script
src="https://unpkg.com/htmx.org@2.0.2"
integrity="sha384-Y7hw+L/jvKeWIRRkqWYfPcvVxHzVzn5REgzbawhxAuQGwX1XWe70vji+VSeHOThJ"
crossorigin="anonymous"
></script>
</head>
<body>
<h1>NyaZoom<sup>2</sup></h1>
{% block content %}{% endblock %}
</body>
</html>

38
templates/welcome.html Normal file
View file

@ -0,0 +1,38 @@
{% extends "base.html" %}
{% block content %}
<div class="form-wrapper">
<form
id="form"
hx-swap="outerHTML"
hx-post="/upload"
hx-encoding="multipart/form-data"
class="column-container"
>
<div class="cat-img-wrapper">
<img
class="cat-img"
src="https://api.thecatapi.com/v1/images/search?size=small&format=src"
/>
</div>
<input
type="file"
id="file"
name="file"
data-multiple-caption="{count} files selected"
multiple
/>
<label for="file">Select Files</label>
<input type="submit" value="Get Link~" />
<p id="cat-fact">{{ fact }}</p>
<progress
id="progress"
class="htmx-indicator"
value="0"
max="100"
></progress>
</form>
<script src="/scripts/loading_progress.js"></script>
</div>
{% endblock content %}