2025-05-27 20:36:57 +03:00
|
|
|
/**
|
|
|
|
|
* https://github.com/TriliumNext/Notes/issues/1002
|
|
|
|
|
*/
|
|
|
|
|
|
2025-05-29 13:24:32 +03:00
|
|
|
import { Command, DocumentSelection, Element, Node, Plugin } from 'ckeditor5';
|
2025-05-27 20:36:57 +03:00
|
|
|
|
|
|
|
|
export default class MoveBlockUpDownPlugin extends Plugin {
|
|
|
|
|
|
|
|
|
|
init() {
|
|
|
|
|
const editor = this.editor;
|
|
|
|
|
editor.config.define('moveBlockUp', {
|
2025-05-27 20:39:52 +03:00
|
|
|
keystroke: ['ctrl+arrowup', 'alt+arrowup'],
|
2025-05-27 20:36:57 +03:00
|
|
|
});
|
|
|
|
|
editor.config.define('moveBlockDown', {
|
2025-05-27 20:39:52 +03:00
|
|
|
keystroke: ['ctrl+arrowdown', 'alt+arrowdown'],
|
2025-05-27 20:36:57 +03:00
|
|
|
});
|
|
|
|
|
|
|
|
|
|
editor.commands.add('moveBlockUp', new MoveBlockUpCommand(editor));
|
|
|
|
|
editor.commands.add('moveBlockDown', new MoveBlockDownCommand(editor));
|
|
|
|
|
|
2025-05-27 20:39:52 +03:00
|
|
|
for (const keystroke of editor.config.get('moveBlockUp.keystroke') ?? []) {
|
|
|
|
|
editor.keystrokes.set(keystroke, 'moveBlockUp');
|
|
|
|
|
}
|
|
|
|
|
for (const keystroke of editor.config.get('moveBlockDown.keystroke') ?? []) {
|
|
|
|
|
editor.keystrokes.set(keystroke, 'moveBlockDown');
|
|
|
|
|
}
|
2025-05-27 20:36:57 +03:00
|
|
|
}
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
abstract class MoveBlockUpDownCommand extends Command {
|
|
|
|
|
|
2025-05-29 13:24:32 +03:00
|
|
|
abstract getSibling(selectedBlock: Element): Node | null;
|
2025-05-27 20:36:57 +03:00
|
|
|
abstract get offset(): "before" | "after";
|
|
|
|
|
|
2025-05-29 13:22:38 +03:00
|
|
|
override execute() {
|
2025-05-27 20:36:57 +03:00
|
|
|
const model = this.editor.model;
|
|
|
|
|
const selection = model.document.selection;
|
|
|
|
|
const selectedBlocks = this.getSelectedBlocks(selection);
|
2025-06-08 16:30:10 +08:00
|
|
|
const isEnabled = selectedBlocks.length > 0
|
|
|
|
|
&& selectedBlocks.every(block => !!this.getSibling(block));
|
|
|
|
|
|
|
|
|
|
if (!isEnabled) {
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const movingBlocks = this.offset === 'before'
|
|
|
|
|
? selectedBlocks
|
|
|
|
|
: [...selectedBlocks].reverse();
|
|
|
|
|
|
|
|
|
|
// Store selection offsets
|
|
|
|
|
const offsets = [
|
|
|
|
|
model.document.selection.getFirstPosition()?.offset,
|
|
|
|
|
model.document.selection.getLastPosition()?.offset
|
|
|
|
|
];
|
2025-05-27 20:36:57 +03:00
|
|
|
|
|
|
|
|
model.change((writer) => {
|
2025-06-08 16:30:10 +08:00
|
|
|
// Move blocks
|
|
|
|
|
for (const block of movingBlocks) {
|
|
|
|
|
const sibling = this.getSibling(block);
|
2025-05-27 20:36:57 +03:00
|
|
|
if (sibling) {
|
2025-06-08 16:30:10 +08:00
|
|
|
const range = model.createRangeOn(block);
|
2025-05-27 20:36:57 +03:00
|
|
|
writer.move(range, sibling, this.offset);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
2025-06-08 16:30:10 +08:00
|
|
|
// Restore selection to all items if many have been moved
|
|
|
|
|
const range = writer.createRange(
|
|
|
|
|
writer.createPositionAt(selectedBlocks[0], offsets[0]),
|
|
|
|
|
writer.createPositionAt(
|
|
|
|
|
selectedBlocks[selectedBlocks.length - 1], offsets[1]));
|
|
|
|
|
writer.setSelection(range);
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
2025-05-27 20:36:57 +03:00
|
|
|
getSelectedBlocks(selection: DocumentSelection) {
|
|
|
|
|
return [...selection.getSelectedBlocks()];
|
|
|
|
|
}
|
2025-06-08 16:30:10 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
|
|
class MoveBlockUpCommand extends MoveBlockUpDownCommand {
|
2025-05-27 20:36:57 +03:00
|
|
|
|
|
|
|
|
getSibling(selectedBlock: Element) {
|
|
|
|
|
return selectedBlock.previousSibling;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
get offset() {
|
|
|
|
|
return "before" as const;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
class MoveBlockDownCommand extends MoveBlockUpDownCommand {
|
|
|
|
|
|
|
|
|
|
/** @override */
|
|
|
|
|
getSibling(selectedBlock: Element) {
|
|
|
|
|
return selectedBlock.nextSibling;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/** @override */
|
|
|
|
|
get offset() {
|
|
|
|
|
return "after" as const;
|
|
|
|
|
}
|
|
|
|
|
}
|