diff --git a/src/components/plate.css b/src/components/plate.css index f387310..0d6c976 100644 --- a/src/components/plate.css +++ b/src/components/plate.css @@ -10,9 +10,9 @@ td.plate_cell { border: 2px solid black; } td.plate_cell:hover { - background: black; + background: black !important; } td.current_select { - background: lightblue; + background: lightblue !important; } diff --git a/src/components/source_plate.rs b/src/components/source_plate.rs index b67f9d5..dceba24 100644 --- a/src/components/source_plate.rs +++ b/src/components/source_plate.rs @@ -25,7 +25,8 @@ pub fn SourcePlate(cx: Scope) -> Element { style { vec![STYLE].into_iter().map(|s| rsx!{s}) // This is stupid } - PlateSelectionIndicator {} + SourcePlateSelectionIndicator {} + SourcePlateSelectionController {} table { draggable: "false", for i in 1..=cx.props.height { @@ -41,7 +42,7 @@ pub fn SourcePlate(cx: Scope) -> Element { } #[inline_props] -fn SourcePlateCell(cx: Scope, i: u8, j: u8) -> Element { +fn SourcePlateCell(cx: Scope, i: u8, j: u8, color: Option) -> Element { let selection_state = use_shared_state::(cx).unwrap(); let selected = in_square( selection_state.read().m_start, @@ -52,11 +53,16 @@ fn SourcePlateCell(cx: Scope, i: u8, j: u8) -> Element { true => "current_select", false => "", }; + let color_string = match color { + Some(c) => c.clone(), + None => "None".to_string() + }; cx.render(rsx! { td { class: "plate_cell {selected_class}", draggable: "false", + style: "background: {color_string}", onmousedown: move |_| { selection_state.write().m_start = Some((*i,*j)); selection_state.write().m_end = None; @@ -85,7 +91,8 @@ fn in_square(corner1: Option<(u8, u8)>, corner2: Option<(u8, u8)>, pt: (u8, u8)) } } -fn PlateSelectionIndicator(cx: Scope) -> Element { +// This is a dummy component for design purposes only +fn SourcePlateSelectionIndicator(cx: Scope) -> Element { let selection_state = use_shared_state::(cx).unwrap(); let start_str = match selection_state.read().m_start { Some(start) => format!("{},{}", start.0, start.1), @@ -100,3 +107,13 @@ fn PlateSelectionIndicator(cx: Scope) -> Element { p { start_str ", and " end_str } }) } + +fn SourcePlateSelectionController(cx: Scope) -> Element { + cx.render(rsx! { + div { + button { + "Select" + } + } + }) +}