Improve precision & smoothness of hsluv/website/picker.js? about hsluv

[meksor]

Want!

[boronine]

@no-identd the behavior you're seeing can be explained more simply.

Moving the slider by 1 pixel will change the hue value by 360 / slider width (px) = 360 / 161 = 2.236. The reason it appears as "snapping" is that mouse events have a pixel-level precision, so we cannot detect a subpixel mouse move. Apparently Chrome is supposed to support subpixel precision [1], but at least on my machine it doesn't (MacOS 10.13, Chrome 64). In either case, picker.js treats mouse coordinates as doubles so the code is ready as soon as support is rolled out.

I could not reproduce the issue with zooming on my machine. Could you give me specific values you are seeing as well as the browser you are using?

It seems that the general issue here can be mitigated by making the sliders wider, which would involve a slight redesign of the picker layout.

(btw, I'd love to see an HSLuv picker similar to the Adobe color wheel, but won't have time to work on it myself)

[1] https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/clientX#Browser_compatibility

[boronine]

This should do it: http://www.hsluv.org/

[no-identd]

Update:
In fact, it seems like the case appears even worse, the sliders seem to exhibit some weird DPI dependency? The values it snaps to and the 'snap range' seems to change depending on the zoom level of the browser...

[no-identd]

I had a lengthy reply to this typed out, unfortunately it died. What it boiled down to:
Independent of the subpixel precision issue, changing the slider width to 180 should improve matters greatly without messing up the website design.