
Show HN: Noodel.js – User interface for beautiful, dynamic content trees - zlu883
https://github.com/zlu883/Noodel
======
zenojevski
I used a similar (but not identical) multi-column drill-down navigation
technique in my Unnamed Gopher Client[0].

However, instead of coding my own scroll gestures, I delegated to CSS Scroll
Snap, which works beautifully, even in complicated scrolling scenarios, and
scrolls natively.

You can see here how accurate scrolling is:
[https://i.imgur.com/m9MBo4N.mp4](https://i.imgur.com/m9MBo4N.mp4)

The main issue is detecting when scrolls end, but that can be addressed with a
bit of cleverness.

I highly recommend giving Scroll-snap a try if you can.

[0]: [https://github.com/zenoamaro/unnamed-gopher-
client](https://github.com/zenoamaro/unnamed-gopher-client)

~~~
zlu883
Thank you for your advice. I would very much like to depend on native
scrolling for managing positions, except that I ran into some roadblocks early
on and resorted to javascript. But I will look into CSS scroll snap for this.

------
076ae80a-3c97-4
Horrendous experience on mobile. The lag due to scroll hijacking is terrible.

~~~
zlu883
I agree some aspects of the mobile experience is suboptimal so far. I hope it
can be improved in the future :)

------
jwilber
Cool library. I’m not sure if the name adds any value (something more tree-
based would make more sense?), but if you’re going to use it you should make a
logo with noodles or something.

GitHub readme needs some images.

------
cateye
The problem that I always have with these structures is that often, many-to-
many relationships are needed.

Being forced to have only one-to-one relationships is too limiting for any
real life modeling.

~~~
zlu883
That's quite true. It's not meant to be a panacea, but I hope it can be useful
in situations where tree-like relationships are pervasive (like comment
sections, for example).

------
hazz99
I love this! Could be a really interesting form of note-taking client.

I also think this has the potential to be amazing on mobile. Reminds me of
notes.andymatuschak.org/

~~~
zlu883
Thanks! This is indeed originally intended as a note-taking tool. After a
prototype for that I realized its potential to become a generic UI framework,
so I worked towards this library instead.

At some point I'll probably link it back to the original tool, so keep watch
if you're interested.

------
egfx
I like it on desktop. My only gripe is that when you mouse-over a scrollable
list on the expanded noodle and scroll then it should scroll the list your
mousing over instead of the list that opened it.

------
greatNespresso
Some great ideas here. I confirm the other comment complaining about the
experience on mobile. Still, it looks promising

------
mmgutz
The navigation reminds me of ranger terminal file browser, which navigates
dirs and files in the same way except it uses Vim keys.

------
artex_xh
actually it is really great for device with limited control keys, e.g. gaming
pad.

------
manx
interesting idea to provide this as a library. It reminds me of
[https://gingkoapp.com](https://gingkoapp.com) (for writing)

------
lloydatkinson
Nice but the animation is not as smooth as it could be.

------
livealife
Similar to file browser in OS X

