diff --git a/plate-tool-web/assets/scss/default_theme/components/_plate_container.scss b/plate-tool-web/assets/scss/default_theme/components/_plate_container.scss index 182bc24..7add8ef 100644 --- a/plate-tool-web/assets/scss/default_theme/components/_plate_container.scss +++ b/plate-tool-web/assets/scss/default_theme/components/_plate_container.scss @@ -2,6 +2,8 @@ @use "../variables" as *; div.plate_container { + position: relative; + display: flex; flex-direction: column; justify-content: space-evenly; @@ -38,4 +40,22 @@ div.plate_container { grid-row: 2; } } + + div.plate_container--heatmap-notice { + position: absolute; + top: 0.5em; + left: 0.5em; + + animation: 1s 1 attention_on_load; + } +} + +@keyframes attention_on_load { + from{ + color: $color-light; + transform: scale(1.05); + } + to { + color: inherit; + } } diff --git a/plate-tool-web/src/components/plates/plate_container.rs b/plate-tool-web/src/components/plates/plate_container.rs index 27232f9..cfe35e1 100644 --- a/plate-tool-web/src/components/plates/plate_container.rs +++ b/plate-tool-web/src/components/plates/plate_container.rs @@ -5,10 +5,12 @@ use yew::prelude::*; use plate_tool_lib::plate::PlateType; use plate_tool_lib::plate_instances::PlateInstance; +use yewdux::functional::use_store; // use super::destination_plate::DestinationPlate; // use super::source_plate::SourcePlate; use super::plate::Plate; +use crate::components::states::MainState; #[derive(Properties, PartialEq)] pub struct PlateContainerProps { @@ -18,6 +20,8 @@ pub struct PlateContainerProps { #[function_component] pub fn PlateContainer(props: &PlateContainerProps) -> Html { + let (main_state, _) = use_store::(); + let cell_height = { let height = web_sys::window() .unwrap() @@ -49,8 +53,15 @@ pub fn PlateContainer(props: &PlateContainerProps) -> Html { .set_onresize(Some(onresize.as_ref().unchecked_ref())); onresize.forget(); // Magic! + let heatmap_enabled = main_state.preferences.volume_heatmap; + html! {
+ if heatmap_enabled { +
+

{"Volume Heatmap Enabled"}

+
+ } if let Some(spi) = props.source_dims.clone() { if let Some(dpi) = props.destination_dims.clone() {