Feature Suggestion: The ability to zoom in and out of the visual editor ladder diagram

[Kcits970]

For very long sequences of patterns, the ladder diagram gets quite cramped with the nodes. This makes it difficult to modify certain parts of the sequence, since there are so many nodes on display. (I usually end up editing the wrong node by misclicking.)

For example:

I think it would be useful if the visual editor could be zoomed in and out.

[jkboyce]

Hi @Kcits970 , thanks for the suggestion! This is a good one. I've encountered this issue too where the events in the ladder diagram are too closely-spaced to be usable.

The UI could be a vertical scroll bar on the right that becomes visible when you zoom in. Controlling the zoom level is a question. Using the mouse scroll wheel would be straightforward but not very discoverable. Alternatively many desktop apps (like video editors) have a horizontal slider control at the top or bottom to control zoom level. Potentially that zoom control would only appear in patterns longer than, say, 5 seconds.

[Kcits970]

I think the zoom control should be necessary for patterns of any delay. Even if the pattern only lasted 1 second, it's still possible to position enough events within that 1 second to completely fill up the ladder diagram.

The vertical scroll bar seems to be very useful. I think it would be even more useful if I could mark certain events with a marker as well.

Example:

If I wanted to mark certain events with the name "transition", I could do something like this. That way, I can effectively mark certain events and find them more easily, especially if there are a lot of them that I want to edit.

[hapiel]

Potentially that zoom control would only appear in patterns longer than, say, 5 seconds.

Rather than 5 seconds I'd say it could appear if there are more than a certain amount of nodes, for example 8 nodes on one horizontal line. Alternatively, a toggle could be hidden in the right click menu. But I'd do those things on top of a scroll to zoom, that would be the way I'd most likely interact with it anyway.

[jkboyce]

@Kcits970 Regarding your suggestion to label events in the ladder, that is a partial duplicate of #101. The idea would be to have the siteswap parser put default labels on key events (throws, maybe catches), which could then be edited using the ladder diagram's popup menu.

A key UI question is how to show these labels in the space available on screen. One solution would be a label that truncates to a certain number of characters, and the entire label is revealed in a mouseover tooltip.

[Kcits970]

@jkboyce I like that solution! I originally had the idea that maybe the ladder diagram could use a horizontal scrollbar to display all the labels in their entirety, but the tooltip would eliminate the need for that!

I also thought about making the ladder diagram horizonal. Most video editing programs have their timelines positioned horizontally, so the labels of the markers are placed parallel to the timeline. Juggling Lab could do the same, but I think the tooltip solution is the best one yet.