varkor / quiver

A modern commutative diagram editor for the web.
https://q.uiver.app
MIT License
2.4k stars 79 forks source link

Dragging Vertices #9

Closed maxsnew closed 4 years ago

maxsnew commented 4 years ago

One of the nicest features of another tikz-cd graphical interface is that you can grab a vertex and drag it and the arrows that are pinned to it will be changed accordingly. For instance I might add an arrow from A to B but then realize it's too small so move B over one square and the arrow will stay going from A to B.

Playing with quiver, it seems like I can move the edge of an arrow, but not a vertex. Does this feature exist and I'm not aware of it? If it doesn't exist it's very convenient for me because often I make a square that's 1x1 and realize later I want to label the interior of the square and need to expand the grid to be 2x2.

varkor commented 4 years ago

Yes, if you click and drag on the outer half of a grid cell, you can move the vertex inside it (and the arrows connected to it will also be moved along with it). The cursor should change to a "move cursor" to indicate this. image

You can also use the arrow keys when a vertex is selected to move it around. This even works if multiple vertices are selected (as does dragging them).

I agree this is not as intuitive as it could be: I'm planning some tweaks to the interface that should make things clearer.

maxsnew commented 4 years ago

Great! Thanks. Yeah then I'd say the issue is that this wasn't very discoverable to me. I'll let you decide whether or not to close.

varkor commented 4 years ago

I'll close this issue, but I've opened https://github.com/varkor/quiver/issues/10 to keep track of this meta-issue in general. I plan to tackle this along with keyboard controls after https://github.com/varkor/quiver/issues/7 and https://github.com/varkor/quiver/issues/5.

dandavison commented 3 years ago

Yes, if you click and drag on the outer half of a grid cell, you can move the vertex inside it (and the arrows connected to it will also be moved along with it). The cursor should change to a "move cursor" to indicate this.

Am I right in thinking that currently this is only working on https://q.uiver.app/dev/?

On the main https://q.uiver.app/ the "move cursor" does appear but I wasn't managing to drag any vertex, and I noticed that an error was thrown while I was trying to drag.

ui.js:5127 Uncaught TypeError: Cannot read property 'delete' of undefined
    at Vertex.set_position (ui.js:5127)
    at ui.js:1248
    at HTMLBodyElement.<anonymous> (dom.js:66)
set_position @ ui.js:5127
(anonymous) @ ui.js:1248
(anonymous) @ dom.js:66

(I'm happy to create a new issue if that would help.)

varkor commented 3 years ago

@dandavison: this should work on the main site (if you just open a new diagram and try dragging a single vertex, I think you'll find that it works). However, there seems to be a bug, which was reported here: https://github.com/varkor/quiver/issues/53. That error trace helps, thanks! If you could figure out how to reproduce the error starting from a new diagram, that would be amazing!