Hacker News Reader

Comment by asdsa5325 | Hacker News Reader

Looks nice, but I have a bug: The sliders don't work properly, when trying to move them they will always start back at 0. (I'm using Firefox 60).

View on HN

Yep sliders aren't quite baked yet. Should work on chrome. Thanks for reporting. https://github.com/wiredjs/wired-slider/issues/3

FYI, the slider doesn't work at all on Chrome Android.

Same on Safari iOS

Slider is fixed now.

There are still minor issues. The roughness slider disappeared when I slid it all the way to the right (on Firefox 60).

But good work anyway, the results are really nice!

Can confirm, thanks!

Yep not very touch friendly at the moment. Bug filed

The fact that your designs "don't work" is very disconcerting - given that we've spent 20 years trying to separate function from design. Does this mean that after 20 years that we still don't have a good clean separation?

Not knocking the design in any way. Just expressing frustration and sadness that you've even have to think about function.

This library is great, although I don't understand your frustration. An interactive mockup library with broken interaction is a bug, no?

I think the point is that if the function and design were actually separate, a non functioning element would also be non functioning in plain HTML (no/little design). That would be much easier to spot, and wouldn't even really be the designers problem.

It's understandable why it happens here, the browser can't easily provide this design with pure HTML and CSS, so javascript and SVG are likely carrying some of the load, and bugs there are causing problems.

That said, one of the main benefits of separating function and design is that this stuff isn't supposed to happen, or be much more rare at least, so it is sad that to utilize this we have to introduce those problems again.

Another comment in this thread mentioned a similar project, a Swing "napkin" theme, which managed a rough look as normal styling. So I guess Swing did something better than HTML/CSS - from skimming the comments i gathered that this library had to reimplement everything from scratch using SVG/Canvas.

Web components are still trying to catch up with the components market that native apps enjoy since the 90's.

I guess we still need a few more years of catching up.

Also on Firefox (in Debian). It's not exactly that the slider starts at zero. It's that, when you grab it, the starting position becomes a pointer offset. You can set it wherever you like, accounting for the offset. It reminds me of capture failure in VMs.

It's actually related to where the slider control is located relative to the page. Chrome and Firefox return different coordinates for SVG node bounds when the node is transformed. Need to find an alternate calculation that works on all browsers. https://github.com/wiredjs/wired-slider/issues/3

Slider is fixed now.

Same on iOS. Otherwise great job! I can easily see his being used for rapid prototyping so give clients the feel that the UI is not set. Would be good to use the awesome font at the front as actual font face in text controls. Or perhaps some fixed width / typewriter font.

the controls inherit the font. So the person using the components can set them to whichever they want. I use 'Gloria Hallelujah' from google fonts' handwritten set on the website.

Same issue on mobile Chrome.

Reply on news.ycombinator.com