Mouse-wheel actions for Zoom and Scroll aren't contextual, happen simultaneously

[3noneTwo]

Simple little bug/quality-of-life feature. If a node has enough text in it, a scrollbar will appear while the mouse is hovering over the node. But if you use your mouse-wheel to scroll through the text field, it'll also zoom in/out.

It'd be nice if Yarn didn't zoom while the mouse is hovering over a scrollable text field.

[ghost]

Hm, yes, it looks a bit weird. I'm not sure we can simply turn off the zoom though.

Let's say you zoomed out and now want to zoom in to a specific card. In order to do that, you're going to hover over a scrollable text field, even though you don't mean to scroll it.

It's not obvious what's the best solution here from the UX perspective.

[Zinggy]

Could remove the scrollable nature of the node. Not sure how useful it is to be able to view the entire text of a node prior to opening it up.

[3noneTwo]

@Zinggy I'd want to be able to look through nodes at a glance. Having to open every node to see what's inside would be a nightmare in itself.

@clexit One solution would be to allow the user to zoom in and out while the mouse is hovering over a node's title, and disable zooming while hovering over the text field. The scrollbar doesn't appear unless the mouse is hovering over the text field anyway, so it'd work out.

[ghost]

@Zinggy, yeah, I was thinking the same thing, but apparently 3noneTwo needs this feature.

@3noneTwo, I'd say it's a bit confusing, at least to me. You can try it here: https://cdn.rawgit.com/clexit/Yarn/issue_40/app/index.html

What about scrolling by dragging the scrollbar? We can use the mouse wheel for zooming and still allow scrolling by dragging the thumb. (UPD: but the implementation might be a bit hacky)

[3noneTwo]

@3noneTwo, I'd say it's a bit confusing, at least to me. You can try it here: https://cdn.rawgit.com/clexit/Yarn/issue_40/app/index.html

This is exactly the behavior I was expecting, but experimenting with it has highlighted the zooming issue you were talking about earlier.

The biggest reason why I'd err against clicking and dragging the scrollbar, is that it adds a click and an element of precision to the user experience. When using a mouse, the precision is a small inconvenience, though the clicks will rack up as Yarn scripts become more complex. When using a laptop with a trackpad: If you've experienced clicking and dragging a scrollbar on a laptop touchpad, you'll know that any sort of precision task can be a pain.

Similarly, it's why I'm against removing the ability to scroll nodes altogether. Two clicks to open a node and a third click to close it. If you're glancing through multiple nodes, this routine becomes super repetitive.

Anything that takes precision or additional clicks out of the equation is good for the user.

That said, I can see how zooming is affected by this change. After zooming out, node titles become too small to easily hover the cursor over (precision), so the ability to zoom in on a specific node is hindered. The user can place the cursor to an empty space next to a node before zooming in/out, but this can be counter-intuitive.

How about making it so text fields can only be scrolled while holding a modifier key? Shift+Wheel? More often than not, a user's hand is going to be within reach of a shift key, so the act of pressing a key before scrolling isn't a big deal. And the majority of Yarn's UI is blank space, so it makes sense for Zoom to be the default mouse wheel action.

[ghost]

I added scrolling with Alt (Shift is a standard key for horizontal scrolling and Ctrl is already used for something). You can play with the new version here. If it's OK, maybe it would make sense to make a PR.

[3noneTwo]

Alt+scroll feels nice enough! Takes very little effort to move the thumb from the spacebar to the Alt key, so it's an easy habit to learn.

That said: In most programs on Windows, Alt is used to select the top-menu for keyboard navigation, requiring the user to press Alt a second time or click somewhere in Yarn in order to deselect the top-menu. This might not be a problem in builds that use Node, but it definitely affects general browser use.

There also seems to be a slight issue with zooming immediately after using Alt+scrollwheel. The scrollwheel input is "ignored" (stored, but not applied) for a second or two, and then immediately applies scrollwheel input afterwards. Weirdly, Yarn itself doesn't hang during this period, and you can interact with anything else. It'll simply snap to the correct zoom level after those few seconds.

Does Yarn actually make use of Shift+scroll anywhere? I know of its standard use as a shortcut for horizontal scrolling as you mentioned, but it seems to do nothing in Yarn. (Besides inducing several seconds of input lag for the scrollwheel for whatever reason. Weird.)

[ghost]

Ah, Windows. It looks like there are not a lot of options here. Ctrl is used for zoom in browser and Shift and Alt are used by the OS. Maybe Q then, since WASD is already used for navigation anyway, so gamers should be able to learn Q quickly.

Does Yarn actually make use of Shift+scroll anywhere?

It's not used in Yarn, but nodes are scrolled only horizontally then, because it's a system shortcut.

There also seems to be a slight issue with zooming

Ah, Windows again. I'm not sure at the moment what's causing it, I'll need to check.