mirror of
https://github.com/TryGhost/Ghost.git
synced 2025-02-24 23:48:13 -05:00
Koenig - Ctrl/Cmd+K shortcut has same behaviour as toolbar link button
no issue - override mobiledoc-kit's default <kbd>Ctrl/Cmd+K</kbd> shortcut to trigger our own link editing component
This commit is contained in:
parent
483ab830b0
commit
1a2e345957
4 changed files with 56 additions and 24 deletions
|
@ -20,6 +20,7 @@ import {camelize, capitalize} from '@ember/string';
|
||||||
import {computed} from '@ember/object';
|
import {computed} from '@ember/object';
|
||||||
import {copy} from '@ember/object/internals';
|
import {copy} from '@ember/object/internals';
|
||||||
import {getContentFromPasteEvent} from 'mobiledoc-kit/utils/parse-utils';
|
import {getContentFromPasteEvent} from 'mobiledoc-kit/utils/parse-utils';
|
||||||
|
import {getLinkMarkupFromRange} from '../utils/markup-utils';
|
||||||
import {run} from '@ember/runloop';
|
import {run} from '@ember/runloop';
|
||||||
|
|
||||||
const UNDO_DEPTH = 50;
|
const UNDO_DEPTH = 50;
|
||||||
|
@ -242,7 +243,7 @@ export default Component.extend({
|
||||||
// set up key commands and text expansions (MD conversion)
|
// set up key commands and text expansions (MD conversion)
|
||||||
// TODO: this will override any passed in options, we should allow the
|
// TODO: this will override any passed in options, we should allow the
|
||||||
// default behaviour to be overridden by addon consumers
|
// default behaviour to be overridden by addon consumers
|
||||||
registerKeyCommands(editor);
|
registerKeyCommands(editor, this);
|
||||||
registerTextExpansions(editor, this);
|
registerTextExpansions(editor, this);
|
||||||
|
|
||||||
editor.registerKeyCommand({
|
editor.registerKeyCommand({
|
||||||
|
@ -427,7 +428,10 @@ export default Component.extend({
|
||||||
// component renders it will re-select when finished which should
|
// component renders it will re-select when finished which should
|
||||||
// trigger the normal toolbar
|
// trigger the normal toolbar
|
||||||
editLink(range) {
|
editLink(range) {
|
||||||
|
let linkMarkup = getLinkMarkupFromRange(range);
|
||||||
|
if ((!range.isCollapsed || linkMarkup) && range.headSection.isMarkerable) {
|
||||||
this.set('linkRange', range);
|
this.set('linkRange', range);
|
||||||
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
cancelEditLink() {
|
cancelEditLink() {
|
||||||
|
|
|
@ -2,6 +2,7 @@ import Component from '@ember/component';
|
||||||
import layout from '../templates/components/koenig-link-input';
|
import layout from '../templates/components/koenig-link-input';
|
||||||
import {TOOLBAR_MARGIN} from './koenig-toolbar';
|
import {TOOLBAR_MARGIN} from './koenig-toolbar';
|
||||||
import {computed} from '@ember/object';
|
import {computed} from '@ember/object';
|
||||||
|
import {getLinkMarkupFromRange} from '../utils/markup-utils';
|
||||||
import {htmlSafe} from '@ember/string';
|
import {htmlSafe} from '@ember/string';
|
||||||
import {run} from '@ember/runloop';
|
import {run} from '@ember/runloop';
|
||||||
|
|
||||||
|
@ -144,14 +145,11 @@ export default Component.extend({
|
||||||
// if we have a single link or a slice of a single link selected, grab the
|
// if we have a single link or a slice of a single link selected, grab the
|
||||||
// href and adjust our linkRange to encompass the whole link
|
// href and adjust our linkRange to encompass the whole link
|
||||||
_getHrefFromMarkup() {
|
_getHrefFromMarkup() {
|
||||||
let {headMarker, tailMarker} = this._linkRange;
|
let linkMarkup = getLinkMarkupFromRange(this._linkRange);
|
||||||
if (headMarker === tailMarker || headMarker.next === tailMarker) {
|
|
||||||
let linkMarkup = tailMarker.markups.findBy('tagName', 'a');
|
|
||||||
if (linkMarkup) {
|
if (linkMarkup) {
|
||||||
this.set('href', linkMarkup.attributes.href);
|
this.set('href', linkMarkup.attributes.href);
|
||||||
this._linkRange = this._linkRange.expandByMarker(marker => !!marker.markups.includes(linkMarkup));
|
this._linkRange = this._linkRange.expandByMarker(marker => !!marker.markups.includes(linkMarkup));
|
||||||
}
|
}
|
||||||
}
|
|
||||||
},
|
},
|
||||||
|
|
||||||
_replaceLink(href, postEditor) {
|
_replaceLink(href, postEditor) {
|
||||||
|
|
|
@ -1,10 +1,10 @@
|
||||||
|
import Browser from 'mobiledoc-kit/utils/browser';
|
||||||
|
|
||||||
// Key commands will run any time a particular key or key combination is pressed
|
// Key commands will run any time a particular key or key combination is pressed
|
||||||
// https://github.com/bustlelabs/mobiledoc-kit#configuring-hot-keys
|
// https://github.com/bustlelabs/mobiledoc-kit#configuring-hot-keys
|
||||||
|
|
||||||
export default function (editor) {
|
export const DEFAULT_KEY_COMMANDS = [{
|
||||||
let softReturnKeyCommand = {
|
|
||||||
str: 'SHIFT+ENTER',
|
str: 'SHIFT+ENTER',
|
||||||
|
|
||||||
run(editor) {
|
run(editor) {
|
||||||
if (!editor.range.headSection.isMarkerable) {
|
if (!editor.range.headSection.isMarkerable) {
|
||||||
return;
|
return;
|
||||||
|
@ -15,6 +15,30 @@ export default function (editor) {
|
||||||
postEditor.insertMarkers(editor.range.head, [softReturn]);
|
postEditor.insertMarkers(editor.range.head, [softReturn]);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
};
|
}, {
|
||||||
editor.registerKeyCommand(softReturnKeyCommand);
|
str: 'CTRL+K',
|
||||||
|
run(editor, koenig) {
|
||||||
|
if (Browser.isWin()) {
|
||||||
|
return koenig.send('editLink', editor.range);
|
||||||
|
}
|
||||||
|
|
||||||
|
// default behaviour for Mac is delete to end of section
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
}, {
|
||||||
|
str: 'META+K',
|
||||||
|
run(editor, koenig) {
|
||||||
|
return koenig.send('editLink', editor.range);
|
||||||
|
}
|
||||||
|
}];
|
||||||
|
|
||||||
|
export default function registerKeyCommands(editor, koenig) {
|
||||||
|
DEFAULT_KEY_COMMANDS.forEach((keyCommand) => {
|
||||||
|
editor.registerKeyCommand({
|
||||||
|
str: keyCommand.str,
|
||||||
|
run() {
|
||||||
|
keyCommand.run(editor, koenig);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
|
@ -0,0 +1,6 @@
|
||||||
|
export function getLinkMarkupFromRange(range) {
|
||||||
|
let {headMarker, tailMarker} = range;
|
||||||
|
if (headMarker === tailMarker || headMarker.next === tailMarker) {
|
||||||
|
return tailMarker.markups.findBy('tagName', 'a');
|
||||||
|
}
|
||||||
|
}
|
Loading…
Add table
Reference in a new issue