mirror of
https://github.com/heyman/heynote.git
synced 2025-06-28 05:21:48 +02:00
Add descriptions and categories to commands
Use the descriptions and categories in the Command palette and Settings dialog
This commit is contained in:
parent
bcaa2d3006
commit
a080b627e0
@ -52,9 +52,20 @@
|
|||||||
]),
|
]),
|
||||||
|
|
||||||
commands() {
|
commands() {
|
||||||
return Object.keys(HEYNOTE_COMMANDS).map(cmd => ({
|
const commands = Object.entries(HEYNOTE_COMMANDS)
|
||||||
name: cmd,
|
// sort array first by category, then by description
|
||||||
cmd: cmd,
|
commands.sort((a, b) => {
|
||||||
|
const aCategory = a[1].category || ""
|
||||||
|
const bCategory = b[1].category || ""
|
||||||
|
if (aCategory === bCategory) {
|
||||||
|
return a[1].description.localeCompare(b[1].description)
|
||||||
|
} else {
|
||||||
|
return aCategory.localeCompare(bCategory)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
return commands.map(([cmdKey, cmd]) => ({
|
||||||
|
name: `${cmd.category}: ${cmd.description}`,
|
||||||
|
cmd: cmdKey,
|
||||||
isCommand: true,
|
isCommand: true,
|
||||||
}))
|
}))
|
||||||
},
|
},
|
||||||
|
@ -1,4 +1,6 @@
|
|||||||
<script>
|
<script>
|
||||||
|
import { HEYNOTE_COMMANDS } from '@/src/editor/commands'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
props: [
|
props: [
|
||||||
"keys",
|
"keys",
|
||||||
@ -14,6 +16,14 @@
|
|||||||
window.heynote.platform.isMac ? "⌘" : "Ctrl",
|
window.heynote.platform.isMac ? "⌘" : "Ctrl",
|
||||||
)
|
)
|
||||||
},
|
},
|
||||||
|
|
||||||
|
commandLabel() {
|
||||||
|
const cmd = HEYNOTE_COMMANDS[this.command]
|
||||||
|
if (cmd) {
|
||||||
|
return `${cmd.category}: ${cmd.description}`
|
||||||
|
}
|
||||||
|
return HEYNOTE_COMMANDS[this.command]?.description ||this.command
|
||||||
|
},
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
@ -29,8 +39,7 @@
|
|||||||
</template>
|
</template>
|
||||||
</td>
|
</td>
|
||||||
<td class="command">
|
<td class="command">
|
||||||
<span v-if="!command" class="unbound">Unbound</span>
|
<span class="command-name">{{ commandLabel }}</span>
|
||||||
<span class="command-name">{{ command }}</span>
|
|
||||||
</td>
|
</td>
|
||||||
<td class="actions">
|
<td class="actions">
|
||||||
<template v-if="!isDefault">
|
<template v-if="!isDefault">
|
||||||
@ -54,12 +63,7 @@
|
|||||||
&.key
|
&.key
|
||||||
//letter-spacing: 1px
|
//letter-spacing: 1px
|
||||||
&.command
|
&.command
|
||||||
.command-name
|
//
|
||||||
font-family: monospace
|
|
||||||
margin-right: 10px
|
|
||||||
.unbound
|
|
||||||
font-style: italic
|
|
||||||
color: #999
|
|
||||||
&.drag-handle
|
&.drag-handle
|
||||||
width: 24px
|
width: 24px
|
||||||
padding: 0
|
padding: 0
|
||||||
@ -69,10 +73,13 @@
|
|||||||
background-repeat: no-repeat
|
background-repeat: no-repeat
|
||||||
background-position: center center
|
background-position: center center
|
||||||
background-image: url(@/assets/icons/drag-vertical-light.svg)
|
background-image: url(@/assets/icons/drag-vertical-light.svg)
|
||||||
|
|
||||||
+dark-mode
|
+dark-mode
|
||||||
background-color: rgba(0,0,0, 0.08)
|
background-color: rgba(0,0,0, 0.08)
|
||||||
background-image: url(@/assets/icons/drag-vertical-dark.svg)
|
background-image: url(@/assets/icons/drag-vertical-dark.svg)
|
||||||
|
&:hover
|
||||||
|
background-color: rgba(0,0,0, 0.05)
|
||||||
|
+dark-mode
|
||||||
|
background-color: rgba(0,0,0, 0.25)
|
||||||
button
|
button
|
||||||
padding: 0 10px
|
padding: 0 10px
|
||||||
height: 22px
|
height: 22px
|
||||||
|
@ -88,11 +88,11 @@
|
|||||||
<h2>Keyboard Bindings</h2>
|
<h2>Keyboard Bindings</h2>
|
||||||
<table>
|
<table>
|
||||||
<tr>
|
<tr>
|
||||||
<th></th>
|
|
||||||
<th>Source</th>
|
<th>Source</th>
|
||||||
<th>Key</th>
|
<th>Key</th>
|
||||||
<th>Command</th>
|
<th>Command</th>
|
||||||
<th></th>
|
<th></th>
|
||||||
|
<th></th>
|
||||||
</tr>
|
</tr>
|
||||||
<draggable
|
<draggable
|
||||||
v-model="keymap"
|
v-model="keymap"
|
||||||
|
@ -62,26 +62,79 @@ const nothing = (view) => {
|
|||||||
return true
|
return true
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const cmd = (f, category, description) => ({
|
||||||
|
run: f,
|
||||||
|
name: f.name,
|
||||||
|
description: description,
|
||||||
|
category: category,
|
||||||
|
})
|
||||||
|
|
||||||
|
const cmdLessContext = (f, category, description) => ({
|
||||||
|
run: (editor) => f,
|
||||||
|
name: f.name,
|
||||||
|
description: description,
|
||||||
|
category: category,
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
const HEYNOTE_COMMANDS = {
|
const HEYNOTE_COMMANDS = {
|
||||||
//undo,
|
addNewBlockAfterCurrent: cmd(addNewBlockAfterCurrent, "Block", "Add new block after current block"),
|
||||||
//redo,
|
addNewBlockBeforeCurrent: cmd(addNewBlockBeforeCurrent, "Block", "Add new block before current block"),
|
||||||
|
addNewBlockAfterLast: cmd(addNewBlockAfterLast, "Block", "Add new block after last block"),
|
||||||
|
addNewBlockBeforeFirst: cmd(addNewBlockBeforeFirst, "Block", "Add new block before first block"),
|
||||||
|
insertNewBlockAtCursor: cmd(insertNewBlockAtCursor, "Block", "Insert new block at cursor"),
|
||||||
|
deleteBlock: cmd(deleteBlock, "Block", "Delete block"),
|
||||||
|
deleteBlockSetCursorPreviousBlock: cmd(deleteBlockSetCursorPreviousBlock, "Block", "Delete block and set cursor to previous block"),
|
||||||
|
cursorPreviousBlock: cmd(cursorPreviousBlock, "Cursor", "Move cursor to previous block"),
|
||||||
|
cursorNextBlock: cmd(cursorNextBlock, "Cursor", "Move cursor to next block"),
|
||||||
|
cursorPreviousParagraph: cmd(cursorPreviousParagraph, "Cursor", "Move cursor to previous paragraph"),
|
||||||
|
cursorNextParagraph: cmd(cursorNextParagraph, "Cursor", "Move cursor to next paragraph"),
|
||||||
|
toggleSelectionMarkMode: cmd(toggleSelectionMarkMode, "Cursor", "Toggle selection mark mode"),
|
||||||
|
selectionMarkModeCancel: cmd(selectionMarkModeCancel, "Cursor", "Cancel selection mark mode"),
|
||||||
|
openLanguageSelector: cmd(openLanguageSelector, "Block", "Select block language"),
|
||||||
|
openBufferSelector: cmd(openBufferSelector, "Buffer", "Buffer selector"),
|
||||||
|
openCommandPalette: cmd(openCommandPalette, "Editor", "Open command palette"),
|
||||||
|
openMoveToBuffer: cmd(openMoveToBuffer, "Block", "Move block to another buffer"),
|
||||||
|
openCreateNewBuffer: cmd(openCreateNewBuffer, "Buffer", "Create new buffer"),
|
||||||
|
cut: cmd(cutCommand, "Clipboard", "Cut selection"),
|
||||||
|
copy: cmd(copyCommand, "Clipboard", "Copy selection"),
|
||||||
|
|
||||||
addNewBlockAfterCurrent, addNewBlockBeforeCurrent, addNewBlockAfterLast, addNewBlockBeforeFirst, insertNewBlockAtCursor,
|
// commands without editor context
|
||||||
cursorPreviousBlock, cursorNextBlock,
|
paste: cmdLessContext(pasteCommand, "Clipboard", "Paste from clipboard"),
|
||||||
cursorPreviousParagraph, cursorNextParagraph,
|
selectAll: cmdLessContext(selectAll, "Selection", "Select all"),
|
||||||
deleteBlock, deleteBlockSetCursorPreviousBlock,
|
moveLineUp: cmdLessContext(moveLineUp, "Edit", "Move line up"),
|
||||||
|
moveLineDown: cmdLessContext(moveLineDown, "Edit", "Move line down"),
|
||||||
|
deleteLine: cmdLessContext(deleteLine, "Edit", "Delete line"),
|
||||||
|
formatBlockContent: cmdLessContext(formatBlockContent, "Block", "Format block content"),
|
||||||
|
newCursorAbove: cmdLessContext(newCursorAbove, "Cursor", "Add cursor above"),
|
||||||
|
newCursorBelow: cmdLessContext(newCursorBelow, "Cursor", "Add cursor below"),
|
||||||
|
selectPreviousParagraph: cmdLessContext(selectPreviousParagraph, "Selection", "Select to previous paragraph"),
|
||||||
|
selectNextParagraph: cmdLessContext(selectNextParagraph, "Selection", "Select to next paragraph"),
|
||||||
|
selectPreviousBlock: cmdLessContext(selectPreviousBlock, "Selection", "Select to previous block"),
|
||||||
|
selectNextBlock: cmdLessContext(selectNextBlock, "Selection", "Select to next block"),
|
||||||
|
nothing: cmdLessContext(nothing, "Misc", "Do nothing"),
|
||||||
|
|
||||||
toggleSelectionMarkMode,
|
// directly from CodeMirror
|
||||||
selectionMarkModeCancel,
|
undo: cmdLessContext(undo, "Edit", "Undo"),
|
||||||
|
redo: cmdLessContext(redo, "Edit", "Redo"),
|
||||||
openLanguageSelector,
|
indentMore: cmdLessContext(indentMore, "Edit", "Indent more"),
|
||||||
openBufferSelector,
|
indentLess: cmdLessContext(indentLess, "Edit", "Indent less"),
|
||||||
openCommandPalette,
|
foldCode: cmdLessContext(foldCode, "Edit", "Fold code"),
|
||||||
openMoveToBuffer,
|
unfoldCode: cmdLessContext(unfoldCode, "Edit", "Unfold code"),
|
||||||
openCreateNewBuffer,
|
selectNextOccurrence: cmdLessContext(selectNextOccurrence, "Cursor", "Select next occurrence"),
|
||||||
|
deleteCharBackward: cmdLessContext(deleteCharBackward, "Edit", "Delete character backward"),
|
||||||
cut: cutCommand,
|
deleteCharForward: cmdLessContext(deleteCharForward, "Edit", "Delete character forward"),
|
||||||
copy: copyCommand,
|
deleteGroupBackward: cmdLessContext(deleteGroupBackward, "Edit", "Delete group backward"),
|
||||||
|
deleteGroupForward: cmdLessContext(deleteGroupForward, "Edit", "Delete group forward"),
|
||||||
|
deleteLineBoundaryBackward: cmdLessContext(deleteLineBoundaryBackward, "Edit", "Delete from start of wrapped line"),
|
||||||
|
deleteLineBoundaryForward: cmdLessContext(deleteLineBoundaryForward, "Edit", "Delete to end of wrapped line"),
|
||||||
|
deleteToLineEnd: cmdLessContext(deleteToLineEnd, "Edit", "Delete to end of line"),
|
||||||
|
deleteToLineStart: cmdLessContext(deleteToLineStart, "Edit", "Delete from start of line"),
|
||||||
|
simplifySelection: cmdLessContext(simplifySelection, "Cursor", "Simplify selection"),
|
||||||
|
splitLine: cmdLessContext(splitLine, "Edit", "Split line"),
|
||||||
|
transposeChars: cmdLessContext(transposeChars, "Edit", "Transpose characters"),
|
||||||
|
insertNewlineAndIndent: cmdLessContext(insertNewlineAndIndent, "Edit", "Insert newline and indent"),
|
||||||
|
insertNewlineContinueMarkup: cmdLessContext(insertNewlineContinueMarkup, "Markdown", "Insert newline and continue markup"),
|
||||||
}
|
}
|
||||||
|
|
||||||
// selection mark-mode:ify all cursor/select commands from CodeMirror
|
// selection mark-mode:ify all cursor/select commands from CodeMirror
|
||||||
@ -97,39 +150,18 @@ for (let commandSuffix of [
|
|||||||
"SubwordBackward", "SubwordForward",
|
"SubwordBackward", "SubwordForward",
|
||||||
"LineBoundaryBackward", "LineBoundaryForward",
|
"LineBoundaryBackward", "LineBoundaryForward",
|
||||||
]) {
|
]) {
|
||||||
HEYNOTE_COMMANDS[`cursor${commandSuffix}`] = markModeMoveCommand(codeMirrorCommands[`cursor${commandSuffix}`], codeMirrorCommands[`select${commandSuffix}`])
|
HEYNOTE_COMMANDS[`cursor${commandSuffix}`] = {
|
||||||
HEYNOTE_COMMANDS[`select${commandSuffix}`] = (editor) => codeMirrorCommands[`select${commandSuffix}`]
|
run: markModeMoveCommand(codeMirrorCommands[`cursor${commandSuffix}`], codeMirrorCommands[`select${commandSuffix}`]),
|
||||||
}
|
name: `cursor${commandSuffix}`,
|
||||||
|
description: `cursor${commandSuffix}`,
|
||||||
const NON_EDITOR_CONTEXT_COMMANDS = {
|
category: "Cursor",
|
||||||
selectAll,
|
}
|
||||||
moveLineUp, moveLineDown,
|
HEYNOTE_COMMANDS[`select${commandSuffix}`] = {
|
||||||
deleteLine,
|
run: (editor) => codeMirrorCommands[`select${commandSuffix}`],
|
||||||
formatBlockContent,
|
name: `select${commandSuffix}`,
|
||||||
newCursorAbove, newCursorBelow,
|
description: `select${commandSuffix}`,
|
||||||
selectPreviousParagraph, selectNextParagraph,
|
category: "Cursor",
|
||||||
selectPreviousBlock, selectNextBlock,
|
}
|
||||||
paste: pasteCommand,
|
|
||||||
nothing,
|
|
||||||
|
|
||||||
// directly from CodeMirror
|
|
||||||
undo, redo,
|
|
||||||
indentMore, indentLess,
|
|
||||||
foldCode, unfoldCode,
|
|
||||||
selectNextOccurrence,
|
|
||||||
deleteCharBackward, deleteCharForward,
|
|
||||||
deleteGroupBackward, deleteGroupForward,
|
|
||||||
deleteLineBoundaryBackward, deleteLineBoundaryForward,
|
|
||||||
deleteToLineEnd, deleteToLineStart,
|
|
||||||
simplifySelection,
|
|
||||||
splitLine,
|
|
||||||
transposeChars,
|
|
||||||
insertNewlineAndIndent,
|
|
||||||
insertNewlineContinueMarkup,
|
|
||||||
}
|
|
||||||
|
|
||||||
for (const [key, cmCommand] of Object.entries(NON_EDITOR_CONTEXT_COMMANDS)) {
|
|
||||||
HEYNOTE_COMMANDS[key] = (editor) => cmCommand
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export { HEYNOTE_COMMANDS }
|
export { HEYNOTE_COMMANDS }
|
||||||
|
@ -431,7 +431,7 @@ export class HeynoteEditor {
|
|||||||
console.error(`Command not found: ${command}`)
|
console.error(`Command not found: ${command}`)
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
cmd(this)(this.view)
|
cmd.run(this)(this.view)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -140,7 +140,7 @@ function keymapFromSpec(specs, editor) {
|
|||||||
console.error(`Command not found: ${spec.command} (${spec.key})`)
|
console.error(`Command not found: ${spec.command} (${spec.key})`)
|
||||||
return false
|
return false
|
||||||
}
|
}
|
||||||
return command(editor)(view)
|
return command.run(editor)(view)
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
}))
|
}))
|
||||||
|
Loading…
x
Reference in New Issue
Block a user