diff --git a/pgml-dashboard/src/components/inputs/range_group/mod.rs b/pgml-dashboard/src/components/inputs/range_group/mod.rs index d6e3a73a4..3164c89f2 100644 --- a/pgml-dashboard/src/components/inputs/range_group/mod.rs +++ b/pgml-dashboard/src/components/inputs/range_group/mod.rs @@ -1,5 +1,6 @@ use pgml_components::component; use sailfish::TemplateOnce; +use crate::components::stimulus::stimulus_target::StimulusTarget; #[derive(TemplateOnce, Default)] #[template(path = "inputs/range_group/template.html")] @@ -10,10 +11,11 @@ pub struct RangeGroup { pub max: i64, pub step: f32, pub initial_value: f64, - pub text_target: Option, - pub range_target: Option, + pub text_target: StimulusTarget, + pub range_target: StimulusTarget, pub cost_rate: Option, pub units: String, + pub group_target: StimulusTarget, } impl RangeGroup { @@ -25,10 +27,11 @@ impl RangeGroup { max: 100, step: 1.0, initial_value: 1.0, - text_target: None, - range_target: None, + text_target: StimulusTarget::new(), + range_target: StimulusTarget::new(), cost_rate: None, units: String::default(), + group_target: StimulusTarget::new(), } } @@ -49,13 +52,13 @@ impl RangeGroup { self } - pub fn text_target(mut self, target: &str) -> Self { - self.text_target = Some(target.to_owned()); + pub fn text_target(mut self, target: StimulusTarget) -> Self { + self.text_target = target; self } - pub fn range_target(mut self, target: &str) -> Self { - self.range_target = Some(target.to_owned()); + pub fn range_target(mut self, target: StimulusTarget) -> Self { + self.range_target = target.to_owned(); self } @@ -68,6 +71,11 @@ impl RangeGroup { self.units = units.to_owned(); self } + + pub fn group_target(mut self, target: StimulusTarget) -> Self { + self.group_target = target; + self + } } component!(RangeGroup); diff --git a/pgml-dashboard/src/components/inputs/range_group/range_group_controller.js b/pgml-dashboard/src/components/inputs/range_group/range_group_controller.js index a7bb025af..b67d8e833 100644 --- a/pgml-dashboard/src/components/inputs/range_group/range_group_controller.js +++ b/pgml-dashboard/src/components/inputs/range_group/range_group_controller.js @@ -5,10 +5,12 @@ export default class extends Controller { static targets = [ "range", "text", + "group" ] static values = { - bounds: Object + bounds: Object, + initial: Number } initialize() { @@ -17,6 +19,7 @@ export default class extends Controller { updateText(e) { this.textTarget.value = e.target.value + this.groupTarget.dispatchEvent(new Event("rangeInput")) } updateRange(e) { @@ -24,19 +27,22 @@ export default class extends Controller { || !e.target.value || !this.isNumeric(e.target.value)) { this.rangeTarget.value = this.boundsValue.min this.textTarget.value = this.boundsValue.min - return - } - - if( e.target.value > this.boundsValue.max) { + } else if( e.target.value > this.boundsValue.max) { this.rangeTarget.value = this.boundsValue.max this.textTarget.value = this.boundsValue.max - return + } else { + this.rangeTarget.value = e.target.value } - this.rangeTarget.value = e.target.value + this.groupTarget.dispatchEvent(new Event("rangeInput")) } isNumeric(n) { return !isNaN(parseFloat(n)) && isFinite(n); } + + reset() { + this.rangeTarget.value = this.initialValue + this.textTarget.value = this.initialValue + } } diff --git a/pgml-dashboard/src/components/inputs/range_group/template.html b/pgml-dashboard/src/components/inputs/range_group/template.html index 30dde71ad..6f48debb5 100644 --- a/pgml-dashboard/src/components/inputs/range_group/template.html +++ b/pgml-dashboard/src/components/inputs/range_group/template.html @@ -1,14 +1,19 @@ -

+ data-action="reset->inputs-range-group#reset">

<%- title %>

- <%- text_target.unwrap()%><% } %>> + <%- text_target %>>

<%- units %>

@@ -25,7 +30,7 @@

<%- title %>

value="<%- initial_value.to_string() %>" data-action="inputs-range-group#updateText" data-inputs-range-group-target="range" - <% if range_target.is_some() { %><%- range_target.unwrap() %><% } %>> + <%- range_target %>> <% if cost_rate.is_some() { %>

pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.

Alternative Proxies: