glen/dyna3
1
0
Fork 0
Code Issues 11 Pull Requests 1 Actions Projects Releases 2 Wiki Activity

Application prototype #14

Merged
glen merged 101 commits from app-proto into main 2024-10-21 23:38:28 +00:00
Conversation 1 Commits 101 Files Changed 12 +31 -11
1 changed files with 31 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 78f8ef8215 - Show all commits

42
app-proto/sketch-outline/src/outline.rs
View File

@ -1,6 +1,6 @@
use itertools::Itertools; use itertools::Itertools;
use sycamore::{prelude::*, web::tags::div}; use sycamore::{prelude::*, web::tags::div};
use web_sys::KeyboardEvent; use web_sys::{KeyboardEvent, MouseEvent};
use crate::AppState; use crate::AppState;
@ -18,7 +18,12 @@ pub fn Outline() -> View {
}); });
view! { view! {
ul { ul(
on:click={
let state = use_context::<AppState>();
move |_| state.selection.update(|sel| sel.clear())
}
) {
Keyed( Keyed(
list=elements_sorted, list=elements_sorted,
view=|elt| { view=|elt| {
@ -46,23 +51,38 @@ pub fn Outline() -> View {
tabindex="0", tabindex="0",
on:click={ on:click={
let id = elt.id.clone(); let id = elt.id.clone();
move |_| { move |event: MouseEvent| {
state.selection.update(|sel| { if event.shift_key() {
if !sel.remove(&id) { state.selection.update(|sel| {
if !sel.remove(&id) {
sel.insert(id.clone());
}
});
} else {
state.selection.update(|sel| {
sel.clear();
sel.insert(id.clone()); sel.insert(id.clone());
} });
}); }
event.stop_propagation();
} }
}, },
on:keydown={ on:keydown={
let id = elt.id.clone(); let id = elt.id.clone();
move |event: KeyboardEvent| { move |event: KeyboardEvent| {
if event.key() == "Enter" { if event.key() == "Enter" {
state.selection.update(|sel| { if event.shift_key() {
if !sel.remove(&id) { state.selection.update(|sel| {
if !sel.remove(&id) {
sel.insert(id.clone());
}
});
} else {
state.selection.update(|sel| {
sel.clear();
sel.insert(id.clone()); sel.insert(id.clone());
} });
}); }
event.prevent_default(); event.prevent_default();
} }
} }