From cbe309b12304b25b5ac5b50bb5ae4b1bbce11214 Mon Sep 17 00:00:00 2001 From: "Ahmad K. Bawaneh" Date: Sun, 10 Nov 2024 16:01:59 +0300 Subject: [PATCH] fix #517 allow the slider to show the current value --- .../domino/ui/config/SlidersConfig.java | 8 +++ .../dominokit/domino/ui/sliders/Slider.java | 49 +++++++++++++++---- 2 files changed, 47 insertions(+), 10 deletions(-) diff --git a/domino-ui/src/main/java/org/dominokit/domino/ui/config/SlidersConfig.java b/domino-ui/src/main/java/org/dominokit/domino/ui/config/SlidersConfig.java index 253cf0f0d..c65bdfd82 100644 --- a/domino-ui/src/main/java/org/dominokit/domino/ui/config/SlidersConfig.java +++ b/domino-ui/src/main/java/org/dominokit/domino/ui/config/SlidersConfig.java @@ -27,4 +27,12 @@ public interface SlidersConfig extends ComponentConfig { default CssClass getDefaultSliderThumbStyle() { return SliderStyles.dui_slider_thumb_rounded; } + + /** + * @return a boolean to set if the slider thumb disappears or not after finishes dragging the + * slider + */ + default boolean autoHideThumb() { + return true; + } } diff --git a/domino-ui/src/main/java/org/dominokit/domino/ui/sliders/Slider.java b/domino-ui/src/main/java/org/dominokit/domino/ui/sliders/Slider.java index 5792dbb8d..9d9fa0dac 100644 --- a/domino-ui/src/main/java/org/dominokit/domino/ui/sliders/Slider.java +++ b/domino-ui/src/main/java/org/dominokit/domino/ui/sliders/Slider.java @@ -30,6 +30,8 @@ import elemental2.dom.HTMLDivElement; import java.util.HashSet; import java.util.Set; +import org.dominokit.domino.ui.config.HasComponentConfig; +import org.dominokit.domino.ui.config.SlidersConfig; import org.dominokit.domino.ui.elements.DivElement; import org.dominokit.domino.ui.elements.InputElement; import org.dominokit.domino.ui.elements.SpanElement; @@ -58,7 +60,7 @@ * @see BaseDominoElement */ public class Slider extends BaseDominoElement - implements HasChangeListeners, SliderStyles { + implements HasChangeListeners, SliderStyles, HasComponentConfig { private final DivElement root; private final InputElement input; private final SpanElement thumb; @@ -70,6 +72,7 @@ public class Slider extends BaseDominoElement private boolean changeListenersPaused; private SwapCssClass dui_thumb_style = SwapCssClass.of(DominoUIConfig.CONFIG.getUIConfig().getDefaultSliderThumbStyle()); + private boolean autoHideThumb = DominoUIConfig.CONFIG.getUIConfig().autoHideThumb(); /** * Creates a slider with a specified maximum value. @@ -128,13 +131,7 @@ public Slider(double max, double min, double value) { setValue(value); EventListener downEvent = mouseDownEvent -> { - this.oldValue = getValue(); - input.addCss(dui_active); - this.mouseDown = true; - if (withThumb) { - showThumb(); - evaluateThumbPosition(); - } + startSliding(); }; EventListener moveMouseListener = mouseMoveEvent -> { @@ -145,13 +142,20 @@ public Slider(double max, double min, double value) { } } }; - EventListener leaveMouseListener = evt -> hideThumb(); + EventListener leaveMouseListener = + evt -> { + if (isAutoHideThumb()) { + hideThumb(); + } + }; EventListener upEvent = mouseUpEvent -> { mouseDown = false; input.removeCss(dui_active); - hideThumb(); + if (isAutoHideThumb()) { + hideThumb(); + } }; input.addEventListener(change.getName(), evt -> triggerChangeListeners(oldValue, getValue())); @@ -170,6 +174,22 @@ public Slider(double max, double min, double value) { input.addEventListener(blur.getName(), leaveMouseListener); init(this); + onAttached( + mutationRecord -> { + if (!autoHideThumb) { + startSliding(); + } + }); + } + + private void startSliding() { + this.oldValue = getValue(); + input.addCss(dui_active); + this.mouseDown = true; + if (withThumb) { + showThumb(); + evaluateThumbPosition(); + } } /** @@ -408,6 +428,15 @@ public Slider setShowThumb(boolean withThumb) { return this; } + public Slider setAutoHideThumb(boolean autoHideThumb) { + this.autoHideThumb = autoHideThumb; + return this; + } + + public boolean isAutoHideThumb() { + return this.autoHideThumb; + } + /** * Returns the root HTML div element of the slider. *