Sliders - the pop up value indication

Dashboard
1

I know there has been a bit of work on them lately. (Or I think there has)

But suddenly I now seem to have the little popup value indicator always there.

They are kind of obvious so I won't/haven't pointed to them.

Ok, nice when they are being moved, but after that I thought they were supposed to go away.

But as you may see on the second screen shot, there is a slider that doesn't have its popup indicator active.

Screenshot%20from%202019-06-01%2009-40-02
Screenshot from 2019-06-01 09-40-02.jpg1360Ă—768 319 KB

Screenshot%20from%202019-06-01%2009-43-05
Screenshot from 2019-06-01 09-43-05.jpg1360Ă—768 377 KB

2

yes, i have the same thoughts with you.
In my opinion, I like the way it automatically hides when we don't focus on it like before.

3

Set it to send continuously to not show the value, or "only on release"to show it.

4

Ah.

I have it set to "Only on release" to stop extraneous data being sent while sliding.

Drats. Seems I have a problem with how to get around this.

Just to check: This is a piccie of what I have on the node.

Screenshot%20from%202019-06-01%2018-10-59
Screenshot from 2019-06-01 18-10-59.png1360Ă—768 142 KB

5

How difficult would it be to make the presence of the value a separate option?

On sliders that are operating devices in the real world, I do not want to flood them with messages so I use the "only on release" option and I've been very happy with that. However, I personally don't want to clutter my dashboard with the values hovering over the slider.

I'd like to see this as a separate option. Unfortunately, I'm ignorant of CSS and it appears to me (please correct me if I'm wrong) that this is all done in CSS.

If someone could point me in the right direction here, I'd be willing to take a crack at it if there is interest in decoupling the appearance of the slider from its mode of operation.

6

Over a year later, and still I run into the same problem !
Has anyone found a solution/workaround yet ??

7

use a trigger node to block sending of the data until after it has stopped moving for x mS ?

1 Like
8

I personally just use a template node to change the behaviour of the "output only on release" on CSS basis, works very well on pointer-based interaction, touch-based is a bit off (I think there is still some things I could improve, I don't know much about HTML states on touch yet)

/* Hide value popups unless hovered */
div.md-slider-wrapper div.md-sign,
div.md-slider-wrapper div.md-sign *
{
    opacity: 0 !important;
    transition-property: opacity !important;
    transition-duration: 0.3s !important;
}
div.md-slider-wrapper div.md-sign::after
{
    opacity: 0 !important;
    transition-property: opacity !important;
    transition-duration: 0.3s !important;
}
div.md-slider-wrapper:hover div.md-sign,
div.md-slider-wrapper:hover div.md-sign *
{
   opacity: 1 !important;
    transition-property: opacity !important;
    transition-duration: 0.3s !important;
}
div.md-slider-wrapper:hover div.md-sign::after
{
    opacity: 1 !important;
    transition-property: opacity !important;
    transition-duration: 0.3s !important;
}

/* Hide Sign Space for Sliders */
md-slider
{
    margin-top: 0px !important;
}
/*more CSS goes here*/

obviously this will, by default, affect all sliders on the entire dashboard, but that can easily be changed by setting some IDs (eg #uigroupname and #uigroupname-cards)