Allow selection of plates in tree

This commit is contained in:
Emilia Allison 2023-05-24 11:20:12 -04:00
parent 85f3fbd113
commit 5be70675ee
Signed by: emilia
GPG Key ID: 7A3F8997BFE894E0
8 changed files with 72 additions and 17 deletions

View File

@ -34,6 +34,9 @@ div.tree {
div.tree li {
user-select: none;
}
div.tree li.selected {
background: rgba(0,0,150,0.2);
}
div.transfer_menu {
grid-column: left / left;

View File

@ -70,6 +70,8 @@ pub fn DestinationPlate(props: &DestinationPlateProps) -> Html {
if let Some(br) = *m_end_handle {
if let Ok(rd) = RegionDisplay::try_from((ul.0, ul.1, br.0, br.1)) {
dispatch.set(NewTransferState {
source_id: current.source_id,
destination_id: current.destination_id,
source_region: current.source_region.clone(),
destination_region: rd,
interleave_x: current.interleave_x,

View File

@ -1,5 +1,8 @@
#![allow(non_snake_case)]
use yew::prelude::*;
use yewdux::prelude::*;
use super::super::states::MainState;
use super::source_plate::SourcePlate;
use super::destination_plate::DestinationPlate;
@ -11,6 +14,8 @@ pub struct PlateContainerProps {
#[function_component]
pub fn PlateContainer(props: &PlateContainerProps) -> Html {
let (state, dispatch) = use_store::<MainState>();
html! {
<div class="plate_container">
<SourcePlate width={props.source_dims.0} height={props.source_dims.1} />

View File

@ -70,6 +70,8 @@ pub fn SourcePlate(props: &SourcePlateProps) -> Html {
if let Some(br) = *m_end_handle {
if let Ok(rd) = RegionDisplay::try_from((ul.0, ul.1, br.0, br.1)) {
dispatch.set(NewTransferState {
source_id: current.source_id,
destination_id: current.destination_id,
source_region: rd,
destination_region: current.destination_region.clone(),
interleave_x: current.interleave_x,

View File

@ -10,6 +10,8 @@ use crate::data::plate::*;
#[derive(Debug, Default, Clone, PartialEq, Serialize, Deserialize, Store)]
#[store(storage = "session")]
pub struct NewTransferState {
pub source_id: Uuid,
pub destination_id: Uuid,
pub source_region: RegionDisplay,
pub destination_region: RegionDisplay,
pub interleave_x: u8,

View File

@ -25,6 +25,8 @@ pub fn TransferMenu() -> Html {
if let Some(input) = input {
if let Ok(rd) = RegionDisplay::try_from(input.value()) {
dispatch.set( NewTransferState {
source_id: state.source_id,
destination_id: state.destination_id,
source_region: rd,
destination_region: state.destination_region.clone(),
interleave_x: state.interleave_x,
@ -48,6 +50,8 @@ pub fn TransferMenu() -> Html {
if let Some(input) = input {
if let Ok(rd) = RegionDisplay::try_from(input.value()) {
dispatch.set( NewTransferState {
source_id: state.source_id,
destination_id: state.destination_id,
source_region: state.source_region.clone(),
destination_region: rd,
interleave_x: state.interleave_x,

View File

@ -8,7 +8,7 @@ use yewdux::prelude::*;
use crate::data::{plate_instances::PlateInstance, transfer::Transfer};
use crate::data::plate::*;
use crate::components::states::MainState;
use crate::components::states::{MainState, NewTransferState};
#[derive(PartialEq, Properties)]
pub struct TreeProps {
@ -17,11 +17,12 @@ pub struct TreeProps {
#[function_component]
pub fn Tree(props: &TreeProps) -> Html {
let (state, dispatch) = use_store::<MainState>();
let plate_menu_id: UseStateHandle<Option<Uuid>> = use_state(|| {None});
let (main_state, main_dispatch) = use_store::<MainState>();
let (selection_state, selection_dispatch) = use_store::<NewTransferState>();
let plate_modal_id: UseStateHandle<Option<Uuid>> = use_state(|| {None});
let open_plate_info_callback = {
let plate_menu_id =plate_menu_id.clone();
let plate_menu_id =plate_modal_id.clone();
Callback::from(move |e: MouseEvent| {
let target: Option<EventTarget> = e.target();
let li = target.and_then(|t| t.dyn_into::<HtmlElement>().ok());
@ -33,14 +34,14 @@ pub fn Tree(props: &TreeProps) -> Html {
})
};
let plate_info_close_callback = {
let plate_menu_id =plate_menu_id.clone();
let plate_menu_id =plate_modal_id.clone();
Callback::from(move |_| {
plate_menu_id.set(None);
})
};
let plate_info_delete_callback = {
let dispatch = dispatch.clone();
let plate_menu_id =plate_menu_id.clone();
let dispatch = main_dispatch.clone();
let plate_menu_id = plate_modal_id.clone();
Callback::from(move |_| {
if let Some(id) = *plate_menu_id {
dispatch.reduce_mut(|state| {
@ -49,16 +50,52 @@ pub fn Tree(props: &TreeProps) -> Html {
}
})
};
let source_plate_select_callback = {
let dispatch = selection_dispatch.clone();
Callback::from(move |e: MouseEvent| {
let target: Option<EventTarget> = e.target();
let li = target.and_then(|t| t.dyn_into::<HtmlElement>().ok());
if let Some(li) = li {
if let Ok(id) = u128::from_str_radix(li.id().as_str(), 10) {
dispatch.reduce_mut(|state| state.source_id = Uuid::from_u128(id))
}
}
})
};
let destination_plate_select_callback = {
let dispatch = selection_dispatch.clone();
Callback::from(move |e: MouseEvent| {
let target: Option<EventTarget> = e.target();
let li = target.and_then(|t| t.dyn_into::<HtmlElement>().ok());
if let Some(li) = li {
if let Ok(id) = u128::from_str_radix(li.id().as_str(), 10) {
dispatch.reduce_mut(|state| state.destination_id = Uuid::from_u128(id))
}
}
})
};
let source_plates = state.source_plates.iter()
let source_plates = main_state.source_plates.iter()
.map(|spi| {
html!{ <li id={spi.get_uuid().as_u128().to_string()}
ondblclick={open_plate_info_callback.clone()}> {String::from(spi)} </li> }
ondblclick={open_plate_info_callback.clone()}
onclick={source_plate_select_callback.clone()}
class={classes!(
Some(if spi.get_uuid() == selection_state.source_id {Some("selected")}
else {None})
)}>
{String::from(spi)}
</li> }
}).collect::<Html>();
let dest_plates = state.destination_plates.iter()
.map(|spi| {
html!{ <li id={spi.get_uuid().as_u128().to_string()}
ondblclick={open_plate_info_callback.clone()}> {String::from(spi)} </li> }
let dest_plates = main_state.destination_plates.iter()
.map(|dpi| {
html!{ <li id={dpi.get_uuid().as_u128().to_string()}
ondblclick={open_plate_info_callback.clone()}
onclick={destination_plate_select_callback.clone()}
class={classes!(
Some(if dpi.get_uuid() == selection_state.destination_id {Some("selected")}
else {None})
)}> {String::from(dpi)} </li> }
}).collect::<Html>();
@ -81,7 +118,7 @@ pub fn Tree(props: &TreeProps) -> Html {
<ul>
</ul>
</div>
if let Some(id) = *plate_menu_id {
if let Some(id) = *plate_modal_id {
<PlateInfoModal id={id} dialog_close_callback={plate_info_close_callback}
delete_button_callback={plate_info_delete_callback}/>
}

View File

@ -8,7 +8,7 @@ use super::plate_instances::*;
pub struct Transfer {
pub source_id: Uuid,
pub dest_id: Uuid,
pub transfer: TransferRegion,
pub transfer_region: TransferRegion,
}
impl Transfer {
@ -16,7 +16,7 @@ impl Transfer {
Self {
source_id: source.get_uuid(),
dest_id: dest.get_uuid(),
transfer: tr
transfer_region: tr
}
}
}