Keyboard Shortcuts

[matthojo]

The Ghost editor should have a number of keyboard shortcuts to assist with writing tasks.

A good example of how this works can be seen in the Mou app, under the Actions menu. We need to research, when applying this to a browser based app: What are the keyboard shortcuts available to us that won't cause major conflicts with OS+browser native shortcuts? See also: List of common shortcuts - wikipedia

Proposed shortcuts:

• Zen Writing (fullscreen) Mode (Currently: Ctrl+Shift+Z)
  • TODO: Toggle off when shortcut is repeated
  • TODO: Toggle off when escape key is pressed
• Text formatting shortcuts (see Mou)
• Publishing action shortcuts (to change values of the publish button)

[JohnONolan]

Updated this to be the main issue for keyboard shortcuts - this needs lots of research about what shortcuts we can safely use (Cross-browser) and what actions we can perform on our Markdown using the CodeMirror API.

I would suggest that we try to replicate as many of the Mou formatting shortcuts as we can, to begin with, and see how it goes.

[matthojo]

Fo reference this is the Mou shortcuts;

Actions

• Copy HTML: Option + Cmd + C
• Strong: Select text, Cmd + B
• Emphasize: Select text, Cmd + I
• Inline Code: Select text, Cmd + K / Ctrl+Shift+K (Ctrl+K is reserved)
• Strikethrough: Select text, Cmd + U Ctrl+Alt+U
• Link: Select text, Control + Shift + L
• Image: Select text, Control + Shift + I
• Select Word: Control + Option + W
• Select Line: Shift + Cmd + L
• Select All: Cmd + A
• Deselect All: Cmd + D
• Convert to Uppercase: Select text, Control + U
• Convert to Lowercase: Select text, Control + Shift + U
• Convert to Titlecase: Select text, Control + Option + Shift + U
• Convert to List: Select lines, Control + L
• Convert to Blockquote: Select lines, Control + Q
• Convert to H1: Cmd + 1 Alt+1
• Convert to H2: Cmd + 2 Alt+2
• Convert to H3: Cmd + 3 Alt+3
• Convert to H4: Cmd + 4 Alt+4
• Convert to H5: Cmd + 5 Alt+5
• Convert to H6: Cmd + 6 Alt+6
• Convert Spaces to Tabs: Control + [
• Convert Tabs to Spaces: Control + ]
• Insert Current Date: Control + Shift + 1
• Insert Current Time: Control + Shift + 2
• Insert entity <: Control + Shift + ,
• Insert entity >: Control + Shift + .
• Insert entity &: Control + Shift + 7
• Insert entity Space: Control + Shift + Space
• Insert Scriptogr.am Header: Control + Shift + G
• Shift Line Left: Select lines, Cmd + [
• Shift Line Right: Select lines, Cmd + ]
• New Line: Cmd + Return
• Comment: Cmd + /
• Hard Linebreak: Control + Return

*If Cmd is specified, for Windows replace with Ctrl.

[matthojo]

I'll add Publishing action shortcuts in tomorrow to get this done.

[ErisDS]

Btw, the alt + 3 shortcut conflicts with making a hash on my macbook air. I thought alt+3 was the hash key on most macs (there's never a key like on normal keyboards).. this is incredibly confusing because every time I want to add a hash, I get 3 :(

[matthojo]

'tis true! Sorry about that. I'll change the shortcut to something more fitting, maybe Ctrl+Alt+number?

[JohnONolan]

maybe Ctrl+Alt+number?

👍

[matthojo]

Can this be closed?

[JohnONolan]

Definitely not - far from done. One thing I just noticed - adding a link via keyboard shortcut:

• Select word to turn into link
• Press Ctrl+Shft+L
• Turns into word

Expected behaviour: http:// is highlighted, so I can paste in my URL if I've got one ready (just like Mou)

Actual behaviour: the whole [word](http://) is highlighted.

[ErisDS]

Marking this as top priority as I think we need to ensure that we can do what we need to do with the current CodeMirror setup. If we can't this will act as an early warning that we need better (our own) tools.

[matthojo]

Does this issue need any more shortcuts adding @JohnONolan?

[JohnONolan]

Looks very good. Is there any way we can do the very first thing on the list? Copy/export HTML? I think it should be possible :)

[matthojo]

It is possible but to safely copy stuff to the clipboard you'd need Flash.

[JohnONolan]

Good point - can you have a look into this and report back on what the overhead and implications would be?

[JohnONolan]

Overhead and implications = filesize, pageload time, translation issues, compatibility with other components, implementation requirements, etc.

[matthojo]

Ok digging a little further, Github now uses (which seems the best option);

• Repo: https://github.com/zeroclipboard/ZeroClipboard
• Size: 11.709 kb
• Pageload increase: ~0.5s (max)
• Compatibility: Standalone so can be just implemented
• Implementation: Requires a button

This implementation problem with requiring a button will keep occurring, because Flash doesn't allow you to copy something to the clipboard unless it is focused (which we cant do) or unless it's clicked (the button).

[JohnONolan]

Roger that - any less reliable (progressive enhancement?) alternatives to using flash? HTML5 API or anything that we can make use of?

[matthojo]

Added rough implementation of Copy to HTML. (waiting on modals)