Compare commits

..

No commits in common. "ff53f33d565655b2427bac693ea0727b591fc4fb" and "77e31d9ffff8dae008dd75b7fc455d22cc05dfa7" have entirely different histories.

2 changed files with 22 additions and 35 deletions

View file

@ -5,7 +5,6 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>dyesub-tool</title> <title>dyesub-tool</title>
<link data-trunk rel="css" href="missing.min.css"> <!-- 1.0.9 --> <link data-trunk rel="css" href="missing.min.css"> <!-- 1.0.9 -->
<style>:root { cursor: inherit } button, input[type="submit"] { cursor: pointer }</style>
</head> </head>
<body> <body>
<main> <main>

View file

@ -3,12 +3,12 @@
mod render; mod render;
pub mod svg; pub mod svg;
use class_list::class_list;
use derive_more::From; use derive_more::From;
use leptos::{ev::SubmitEvent, html::Input, *}; use leptos::{ev::SubmitEvent, html::Input, *};
use strum_macros::IntoStaticStr; use strum_macros::IntoStaticStr;
use wasm_bindgen::{JsCast, JsValue}; use wasm_bindgen::{JsCast, JsValue};
use web_sys::File; use web_sys::File;
use class_list::class_list;
#[derive(Clone)] #[derive(Clone)]
struct ResultMessageData { struct ResultMessageData {
@ -35,24 +35,12 @@ enum Colorway {
#[component] #[component]
fn ResultMessage(cx: Scope, message: ReadSignal<Option<ResultMessageData>>) -> impl IntoView { fn ResultMessage(cx: Scope, message: ReadSignal<Option<ResultMessageData>>) -> impl IntoView {
let (open, set_open) = create_signal(cx, true); move || message().map(|ResultMessageData { title, message, colorway }| view! { cx,
create_effect(cx, move |_| { <div class=class_list!["box", <Colorway as Into<&str>>::into(colorway)]>
message.track(); <h3>{title}</h3>
set_open(true); <p>{message}</p>
}); </div>
move || { })
view! { cx,
<Show when=move || open() fallback=|_| ()>
{move || message().map(|ResultMessageData { title, message, colorway }| view! { cx,
<div class=class_list!["box", <Colorway as Into<&str>>::into(colorway)] style="position: relative">
<strong class="block titlebar">{title}</strong>
<button class="iconbutton" on:click=move |_| set_open(false) style="position: absolute; bottom: 0.5em; right: 0.5em">"×"</button>
<p>{message}</p>
</div>
})}
</Show>
}
}
} }
#[derive(From, IntoStaticStr)] #[derive(From, IntoStaticStr)]
@ -106,7 +94,8 @@ fn KeyboardFromFile(
let file_input = create_node_ref::<Input>(cx); let file_input = create_node_ref::<Input>(cx);
let (file, set_file) = create_signal(cx, Option::<File>::None); let (file, set_file) = create_signal(cx, Option::<File>::None);
let (result_message, set_result_message) = create_signal(cx, Option::<ResultMessageData>::None); let (result_message, set_result_message) = create_signal(cx, Option::<ResultMessageData>::None);
let on_submit = move || { let on_submit = move |e: SubmitEvent| {
e.prevent_default();
spawn_local(async move { spawn_local(async move {
match read_kle_from_file(&file).await { match read_kle_from_file(&file).await {
Ok(keyboard) => { Ok(keyboard) => {
@ -120,35 +109,34 @@ fn KeyboardFromFile(
})); }));
set_keyboard(Some(keyboard)); set_keyboard(Some(keyboard));
} }
Err(err) => { Err(err) => set_result_message(Some(ResultMessageData {
set_result_message(Some(ResultMessageData { message: view! { cx,
message: view! { cx, {
{ err.to_string()
err.to_string()
}
} }
.into_view(cx), }
title: <ReadKleError as Into<&str>>::into(err).to_string(), .into_view(cx),
colorway: Colorway::Bad, title: <ReadKleError as Into<&str>>::into(err).to_string(),
})); colorway: Colorway::Bad,
file_input().unwrap().set_value(""); })),
}
} }
}); });
}; };
view! { cx, view! { cx,
<h3>"Load KLE JSON from file"</h3> <h3>"Load KLE JSON from file"</h3>
<ResultMessage message=result_message /> <ResultMessage message=result_message />
<form class="f-row align-items:center"> <form class="f-row align-items:center" on:submit=on_submit>
<input <input
type="file" type="file"
accept="application/json" accept="application/json"
node_ref=file_input node_ref=file_input
on:change=move |_| { on:change=move |_| {
set_file(file_input().unwrap().files().map(|files| files.get(0)).flatten()); set_file(file_input().unwrap().files().map(|files| files.get(0)).flatten());
on_submit();
} }
/> />
<Show when=move || file().is_some() fallback=move |_| {}>
<input type="submit" value="Load" />
</Show>
</form> </form>
} }
} }