Koenig - Implement full set of text editing shortcuts

refs https://github.com/TryGhost/Ghost/issues/9724
- <kbd>Ctrl+Alt+1</kbd> - Togggle heading level 1
- <kbd>Ctrl+Alt+2</kbd> - Togggle heading level 2
- <kbd>Ctrl+Alt+3</kbd> - Togggle heading level 3
- <kbd>Ctrl+Alt+4</kbd> - Togggle heading level 4
- <kbd>Ctrl+Alt+5</kbd> - Togggle heading level 5
- <kbd>Ctrl+Alt+6</kbd> - Togggle heading level 6
- <kbd>Ctrl/Cmd+H</kbd> - Cycle through heading levels 2-6
- <kbd>Ctrl+Q</kbd> - Toggle blockquote
- <kbd>Ctrl+L</kbd> - Toggle unordered list
- <kbd>Ctrl/Cmd+K</kbd> - Toggle link
- <kbd>Ctrl/Cmd+B</kbd> - Toggle bold
- <kbd>Ctrl/Cmd+I</kbd> - Toggle italic
- <kbd>Ctrl/Cmd+U</kbd> - Toggle underline
- <kbd>Ctrl+Alt+U</kbd> - Toggle strikethrough
- <kbd>Ctrl/Cmd+Shift+K</kbd> - Toggle code
This commit is contained in:
Kevin Ansfield 2018-07-20 13:24:48 +01:00
parent 4d826fa004
commit 0bfe190bb3

View File

@ -8,6 +8,46 @@ import {
// Key commands will run any time a particular key or key combination is pressed
// https://github.com/bustlelabs/mobiledoc-kit#configuring-hot-keys
const setHeader = function setHeader(headerTag, editor, koenig) {
if (!editor.activeSection.isMarkerable) {
return;
}
let range = editor.range;
let canKeepRange = !editor.activeSection.isListItem;
editor.run((postEditor) => {
koenig.send('toggleHeaderSection', headerTag, postEditor, {force: true});
if (canKeepRange) {
postEditor.setRange(range);
}
});
};
// cycle through H2-H6. Starts with H2 so that heirarchy with the story title is
// kept. H1 should be explicitly selected with CTRL+ALT+1 or using `#` text expansion
const cycleHeaderLevel = function cycleHeaderLevel(editor, koenig) {
if (!editor.activeSection.isMarkerable) {
return;
}
let headerMatch = editor.activeSection.tagName.match(/^h(\d)$/i);
let headerTag = 'h2';
if (headerMatch) {
let newLevel = parseInt(headerMatch[1]) + 1;
if (newLevel > 6) {
// remove header tag before starting the cycle again
headerTag = headerMatch[0];
} else {
headerTag = `h${newLevel}`;
}
}
setHeader(headerTag, editor, koenig);
};
export const DEFAULT_KEY_COMMANDS = [{
str: 'ENTER',
run(editor, koenig) {
@ -242,6 +282,80 @@ export const DEFAULT_KEY_COMMANDS = [{
return false;
}
}, {
str: 'CTRL+ALT+1',
run(editor, koenig) {
return setHeader('h1', editor, koenig);
}
}, {
str: 'CTRL+ALT+2',
run(editor, koenig) {
return setHeader('h2', editor, koenig);
}
}, {
str: 'CTRL+ALT+3',
run(editor, koenig) {
return setHeader('h3', editor, koenig);
}
}, {
str: 'CTRL+ALT+4',
run(editor, koenig) {
return setHeader('h4', editor, koenig);
}
}, {
str: 'CTRL+ALT+5',
run(editor, koenig) {
return setHeader('h5', editor, koenig);
}
}, {
str: 'CTRL+ALT+6',
run(editor, koenig) {
return setHeader('h6', editor, koenig);
}
}, {
str: 'CTRL+H',
run(editor, koenig) {
if (!Browser.isMac()) {
return cycleHeaderLevel(editor, koenig);
}
return false;
}
}, {
str: 'META+H',
run(editor, koenig) {
if (Browser.isMac()) {
return cycleHeaderLevel(editor, koenig);
}
return false;
}
}, {
str: 'CTRL+Q',
run(editor, koenig) {
if (!editor.activeSection.isMarkerable) {
return;
}
let range = editor.range;
let canKeepRange = !editor.activeSection.isListItem;
editor.run((postEditor) => {
koenig.send('toggleSection', 'blockquote', postEditor);
if (canKeepRange) {
postEditor.setRange(range);
}
});
}
}, {
str: 'CTRL+L',
run(editor, koenig) {
if (!editor.activeSection.isMarkerable) {
return;
}
koenig.send('toggleSection', 'ul');
}
}, {
str: 'CTRL+K',
run(editor, koenig) {
@ -257,6 +371,29 @@ export const DEFAULT_KEY_COMMANDS = [{
run(editor, koenig) {
return koenig.send('editLink', editor.range);
}
}, {
str: 'CTRL+ALT+U',
run(editor, koenig) {
return koenig.send('toggleMarkup', 's');
}
}, {
str: 'CTRL+SHIFT+K',
run(editor, koenig) {
if (!Browser.isMac()) {
return koenig.send('toggleMarkup', 'code');
}
return false;
}
}, {
str: 'META+SHIFT+K',
run(editor, koenig) {
if (Browser.isMac()) {
return koenig.send('toggleMarkup', 'code');
}
return false;
}
}];
export default function registerKeyCommands(editor, koenig) {