IText should support additional text manipulation shortcut key combinations

[markerikson]

IText editing currently feels a bit unnatural, as several typical text manipulation shortcut keys do not work. In particular, Home and End do not go to the start/end of the line, and CTRL-Home/End do not go to the start/end of the textbox. Looking at the IText implementation, it looks like these should be relatively straightforward to implement, given the existing selection/cursor manipulation functions.

Here's a list of common shortcut key combinations that would useful to implement, pulled from http://www.howtogeek.com/115664/42-text-editing-keyboard-shortcuts-that-work-almost-everywhere/ . Some of these are already implemented, but I'm pasting in all of these for completeness:

Working With Words
Ctrl+Left Arrow – Move cursor to beginning of previous word.
Ctrl+Right Arrow – Move cursor to beginning of next word
Ctrl+Backspace – Delete previous word.
Ctrl+Delete – Delete next word.
Ctrl+Up Arrow – Move cursor to beginning of paragraph.
Ctrl+Down Arrow – Move cursor to end of paragraph.
Mac Users: Use the Option key instead of the Ctrl key.

Moving the Cursor
The Ctrl key can also be combined with the Home and End keys.
Home – Move cursor to beginning of current line.
End – Move cursor to end of current line.
Ctrl+Home – Move cursor to top of the text entry field.
Ctrl+End – Move cursor to bottom of the text entry field.
Page Up – Move cursor up a frame.
Page Down – Move cursor down a frame.

Selecting Text
All of the above shortcuts can be combined with the Shift key to select text.
Shift+Left or Right Arrow Keys – Select characters one at a time.
Shift+Up or Down Arrow Keys – Select lines one at a time.
Shift+Ctrl+Left or Right Arrow Keys – Select words – keep pressing the arrow keys to select additional words.
Shift+Ctrl+Up or Down Arrow Keys – Select paragraphs.
Shift+Home – Select the text between the cursor and the beginning of the current line.
Shift+End – Select the text between the cursor and the end of the current line.
Shift+Ctrl+Home – Select the text between the cursor and the beginning of the text entry field.
Shift+Ctrl+End – Select the text between the cursor and the end of the text entry field
Shift+Page Down – Select a frame of text below the cursor.
Shift+Page Up – Select a frame of text above the cursor.
Ctrl+A – Select all text.

Want to back this issue? Post a bounty on it! We accept bounties via Bountysource.

[kangax]

Here's what we currently support:

Supported key combinations:

  Move cursor:                    left, right, up, down
  Select character:               shift + left, shift + right
  Select text vertically:         shift + up, shift + down
  Move cursor by word:            alt + left, alt + right
  Select words:                   shift + alt + left, shift + alt + right
  Move cursor to line start/end:  cmd + left, cmd + right
  Select till start/end of line:  cmd + shift + left, cmd + shift + right
  Jump to start/end of text:      cmd + up, cmd + down
  Select till start/end of text:  cmd + shift + up, cmd + shift + down
  Delete character:               backspace
  Delete word:                    alt + backspace
  Delete line:                    cmd + backspace
  Forward delete:                 delete
  Copy text:                      ctrl/cmd + c
  Paste text:                     ctrl/cmd + v
  Cut text:                       ctrl/cmd + x

Supported mouse/touch combination

  Position cursor:                click/touch
  Create selection:               click/touch & drag
  Create selection:               click & shift + click
  Select word:                    double click
  Select line:                    triple click

These are probably more mac-oriented since that's what I used to develop it. I did test iText on windows, but missed some things (home/end, for example).

[kangax]

Oh, support for "Ctrl/Cmd + a" we already have. Forgot to list it.

[asturur]

pr #1616 add some of the missing keys.
PgDown and PgUp are used like ctrl Home and Ctrl End, not having text frames.

[inssein]

@kangax @asturur isn't moving cursor by words supposed to be ctrl + left or ctrl + right? Perhaps its an OSX thing, but as a developer on windows, it has always been ctrl.

[kangax]

@inssein I believe we support both cmd (os x behavior) and ctrl (windows behavior) for all the commands — moving to start/end of line, start/end of text, etc.

[inssein]

@kangax ctrl + (shortcut) doesn't work on the fabric.js itext demo: http://fabricjs.com/test/misc/itext.html

Not sure what the right solution is, but probably need to find a way to switch the shortcuts depending on the OS.

[asturur]

we should wait after we switch to onInput event.

[inssein]

@asturur is that a PR you are waiting to submit? I see an issue related to it (#2051) but no PR.

[asturur]

there is no pr yet.

[asturur]

We support more than enough shortcut combination i think.

[dieterwang]

Ctrl + Left/Right to jump to previous/next word still doesn't work on windows/linux, any chance this will be picked up again?

[asturur]

is it in the docs and not working on linux/windows or is actually a feature request?

[dieterwang]

Just checked, according to the docs its with Alt + Left/Right to move to previous/next word. This works.

But isn't this rather unusual? In every other textfield in browsers or editors it's with Ctrl. This had been mentioned in @kangax's earlier comment.

@kangax @asturur isn't moving cursor by words supposed to be ctrl + left or ctrl + right? Perhaps its an OSX thing, but as a developer on windows, it has always been ctrl.

I suppose this is a feature request then?