Feature/restricted range

[DanielReid]

Hi, we added a restricted range because we needed one, and this slider seemed the best starting point.

[codecov-io]

Codecov Report

Merging #583 into master will not change coverage.
The diff coverage is 100%.

@@          Coverage Diff          @@
##           master   #583   +/-   ##
=====================================
  Coverage     100%   100%           
=====================================
  Files           1      1           
  Lines         950    970   +20     
=====================================
+ Hits          950    970   +20

Impacted Files	Coverage Δ
src/rzslider.js	100% <100%> (ø)	⬆️

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update a1e69b0...53ddb8e. Read the comment docs.

[ValentinH]

Hi, thanks for this pull request!
Could you provide a demo (via JSFiddle for example) that show the new feature?

[DanielReid]

We updated the demo with a restricted range slider as well, so checkout should also work.

Here's a fiddle: https://jsfiddle.net/2hxm9cop/1/

[ValentinH]

This feature is really nice, well done!

I just have one small issue to raise:

In the above example, when I switch from 30 to 70, the slider handle only moves to 70 when I'm exactly at 70. A better behavior would be to move to 70 when the mouse is just after the middle of the restricted range (51). What do you think?

We already have the same behavior for large steps...

[DanielReid]

Thanks for the compliment (and the work maintaining this project!). Cool gif! That's a clever way to communicate these things.

For us this is intended behaviour because in our use case we wish to discourage moving from one side to the other. It could be an option, like restrictedRange.switchSidesAtMiddle perhaps?

[ValentinH]

For the GIF, I use this really nice tool: https://getkap.co

About the option, I don't really know how to approach this. I think the middle thing should be the default and we should add an option to address your use case. Do you have an idea of how we could design this option?

[DanielReid]

I've decided it's best to not overdesign this, and have changed it to switch in the middle instead. Extra checks can be done by consumers of the slider's model values anyway.

[DanielReid]

@ValentinH is there anything else you would like changed about this? We're currently thinking about allowing more than one restricted range, but that's probably best as a separate PR once this one's complete.

[ValentinH]

Hey,

It's been a long time! ^^ Just tried your last fiddle and it looks fine. Could you rebase your changes on top of master so I can review it?

Thanks by advance!

[DanielReid]

Hi, I made a new branch/PR as per request (#638)