Hide one label when they have the same value

[apitts]

Is there an easy way to do this? Basically, instead of getting 'x - x' when x===x it would be nice to just get 'x'.

[apitts]

I have dug into the code a bit more and, correct me if I'm wrong, there isn't currently a toggle for the close label behaviour. What do you think about adding such a toggle, e.g. a boolean called rz-slider-hide-close-label? The advantage would be that you could use CSS to position the right-hand-side label below the slider (once an additional class was added to the template) and so you don't face that confusing moment when the labels cross on drag and one keeps going. So the left-hand-side label would be top and the right-hand-side label bottom if this toggle was true and once you drag past a min/max it's clearer what is happening because of the top/bottom label split. Just a thought!

[ValentinH]

I guess you are talking about range labels. Currently there is no way to do such a thing...

What toggle are you talking about for the close label behaviour? Could you provide the line number pls?
Moreover, I don't see what you find confusing on the current version when the 2 values are close to each other...

[apitts]

Yes, range labels.

I'm talking about a toggle that doesn't currently exist but that I suggest may be helpful. Since, it doesn't exist a line number isn't really relevant.

It's a UX thing...basically as it is when you drag a range slider thumb through the other thumb it's not apparent to the user that you are switching thumbs. One way to make it apparent would be to differentiate the labels - one at the top and one at the bottom. If that were the case then as the user drags through the other slider they can tell what is happening because they start to drag a thumb with a differently positioned label. An alternative would be to stop the drag so it is not possible. Hope that makes sense!

I've been able to implement the above (labels not the stopping option) in a forked version but in quite a hacky way so not worthy of a pull request I think. It's not consistent with the quality of the rest of the codebase, which I think is high.

[ValentinH]

In my opinion, switching low and high toggles is convenient since it is more logic to always have the min value on the left and the max on the right.

Stopping the drag when the 2 values are the same can be an option. However, once the two toggles have the same value it will lead to weird behaviour because you don't really know which one you will drag when clicking on it. So if you think it is the min while it is the actually the max, you will try to drag it on the left but it will be blocked. I can create an example of such a feature next week to discuss it with more concrete material (in holidays right now).

[apitts]

Thanks @ValentinH! Yes, I understand what you are saying re not knowing which is on the top. I agree they should be switched, it's just a question of how that switching is communicated to the user in that split second...right now I think it's confusing.

Enjoy the break!

[ValentinH]

I'm too enthusiast... There you go: http://jsfiddle.net/ps62brdb/ ;)

This is just a first POC and if you drag too fast it will stop before the toggles overlap. If we add such a feature, it will be better ;)

[apitts]

Looks good! I would definitely use that feature!

[apitts]

I see it can get 'stuck' if at the extreme and the wrong thumb is on the top...we would need to find a solution for that. Something like: drag the min thumb if you drag left or drag the right thumb if you drag right, i.e. the direction of drag determines which thumb you are dragging.

[ValentinH]

noSwitching option has been added in 2.6.0 and it does what was described in this issue.