editable.js icon indicating copy to clipboard operation
editable.js copied to clipboard

Feature: add a “move” event?

Open jenstroeger opened this issue 4 years ago • 13 comments

I think it would be useful (at least for my use case) to have a “move” event, similar to the current switch event. It fires when the user holds e.g. the Alt key together with the arrow up/down key at the top/bottom of the element, thus indicating that the element should be moved up or down.

If you’re open to that, then I’d supply a PR.

jenstroeger avatar Jun 23 '21 10:06 jenstroeger

It fires when the user holds e.g. the Alt key together with the arrow up/down key

Is this inspired from some other tool where you can move elements this way? I'm not familiar with this combo.

But generally we're open to the idea.

There is a PR on the way regarding the switch event to allow for some more natural cursor interaction when switching between blocks. It probably makes sense to build your work from that or wait until we merge it in the coming days.

peyerluk avatar Jun 28 '21 08:06 peyerluk

Is this inspired from some other tool where you can move elements this way? I'm not familiar with this combo.

It’s not.

I’m just looking for a comfortable way to move paragraphs in a document up/down. Click-and-drag works already, but the grip icon doesn’t seem to work for users. Holding Alt seems nice and unintrusive, although the actual key should probably be configured (even disabled in the default config, in which case the “move” event wouldn’t fire).

There is a PR on the way regarding the switch event […]

Do you have an ETA for that PR? It would probably make sense for me to wait and build on top of that?

jenstroeger avatar Jun 28 '21 09:06 jenstroeger

Do you have an ETA for that PR? It would probably make sense for me to wait and build on top of that?

It's merged now :)

peyerluk avatar Jun 28 '21 16:06 peyerluk

It's merged now :)

Great, thank you!

Also, I just noticed that the 'move' event is already added but doesn’t seem to be used anywhere? Is that a relic from previous versions?

https://github.com/livingdocsIO/editable.js/blob/8e477fa3cd188dbcbb9ee03f3fd0fcee3e73002c/src/core.js#L511-L514

jenstroeger avatar Jun 29 '21 07:06 jenstroeger

Yes. That's a relic.

peyerluk avatar Jun 30 '21 10:06 peyerluk

Lucky me, I’ve repurposed it for now 👍🏼

jenstroeger avatar Jun 30 '21 10:06 jenstroeger

the Alt key together with the arrow up/down key at the top/bottom of the element, thus indicating that the element should be moved up or down.

Actually, vscode is using ALT + ⬆️ or ALT + ⬇️ to move text around. But its' slightly unintuitive because ALT + ⬅️ and ALT + ➡️ are shortcut to move the cursor one word to the left and right.

marcbachmann avatar Oct 05 '21 12:10 marcbachmann

I guess we can close this for now

marcbachmann avatar Oct 05 '21 12:10 marcbachmann

Actually, vscode is using ALT + ⬆️ or ALT + ⬇️ to move text around.

Dang, I didn’t know! (Well, I barely use VS Code anyway.) But yes, just tried it out and that’s exactly how ALT + ⬆️ or ALT + ⬇️ work on my site 👍🏼

I wouldn’t say it’s unintuitive — I got used to it quickly 😉

I guess we can close this for now

Bummer. Well, I’ll just keep it in my fork… But in that case, you might want to remove the "move" string above?

jenstroeger avatar Oct 05 '21 12:10 jenstroeger

Oh, we could implement if you really want to. But at the moment it's also conflicting with jumping to the end of a block.

I'm not really a fan to change the default behavior.

marcbachmann avatar Oct 05 '21 12:10 marcbachmann

I'd rather bind CMD + ALT + ⬆️

marcbachmann avatar Oct 05 '21 12:10 marcbachmann

@marcbachmann, well if you want I can create a PR from my local change and you can take a look. If it’s too invasive and not too useful we can always close later…

I'd rather bind CMD + ALT + ⬆️

And on Windows that’d be CTRL + ALT + ⬆️?

jenstroeger avatar Oct 05 '21 12:10 jenstroeger

And on Windows that’d be CTRL + ALT + ⬆️?

yes

marcbachmann avatar Oct 05 '21 12:10 marcbachmann