Ctrl-J / Ctrl-K Hotkey for navigation within command palette and quick switcher

Feature requests
,
1

1. Have you searched for an existing request?

like this:

2. Use case or problem

for workaround of wrong operatoin, I use some commands without shortcut key. so, I use command palette, and need to move right hand for taking a command.

3. Proposed solution

I hope:
ctrl+j: move down in command palette
ctrl+k: move up in commadn palette
enter: to use the command
ctrl+[: dismiss

with these shotcut key, I’m sure to feel so happy.
my hands, too.

4. Current workaround (optional)

move my right hand to arrow keys.

5. Related feature requests (optional)

22 Likes
2

I didn’t know I wanted this!

3 Likes
3

In a obsidian, I hope to any operation without mouse, with arrow keys a little.
I imagine my operations for vim-mode, and know others imagine them for emacs-mode.
so, It would be imagined what hot-key is changed to.

4

I was about to make a separate post, but I think I can tag it here cos it seems similar.

I’ve wanted to have ctrl+j/k in the popup for link suggestions in addition to the palette. It’s pretty standard in Vim, Spacemacs and VSCodeVim as well.

So I guess it’s a related feature request? Enter and ctrl+[ work the same way too.

2 Likes
5

I really hope this feature will come soon. I use CTRL-J and CTRL-K everywhere I can to scroll in suggestions.

5 Likes
6

Fully agree. Probably should be customized depending on your preferences (Emacs style or vim style).

Personally, I always try Ctrl-J and Ctrl-K every time I open the command palette, before realizing I cannot do that.

2 Likes
7

I use Karabiner to map ctrl-n and ctrl-p to down and up arrows respectively. In Karabiner, you can set the mapping only while Obsidian is active.

If any one wants to try, here is mapping in my karabiner.json.

3 Likes
8

I’d love to see this!

9

Any update? Obsidian v0.15.6 already supports using “ctrl-n/p” to navigate, will “ctrl-j/k” to be possible?

10

I made it work by calling this JS code at obsidian startup. You can do this with various plugins or by making your own plugin.


    document.addEventListener('keydown',(e) =>{
        if (e.code == "KeyN" && e.ctrlKey && !e.shiftKey && !e.metaKey){
            document.dispatchEvent(new KeyboardEvent("keydown",{"key":"ArrowDown","code":"ArrowDown"}))
        }
    });

    document.addEventListener('keydown',(e) =>{
        if (e.code == "KeyP" && e.ctrlKey && !e.shiftKey && !e.metaKey){
            document.dispatchEvent(new KeyboardEvent("keydown",{"key":"ArrowUp","code":"ArrowUp"}))
        }
    });

This code listens for Ctrl+N and Ctrl+P key press events and creates a new ArrowDown/ArrowUp event.

It could be made more specific by attaching the event listener to the specific DOM elements where you want this functionality.

11

Just building off of anotherroot’s response you can check to see what the active element is, not sure if you can add the listener to the suggester element since it doesn’t exist when obsidian is first loaded.

I also added e.preventDefault() so my other hotkeys weren’t trying to run and swapped metaKey and ctrlKey since I’m on mac.

document.addEventListener('keydown',(e) =>{
	if (document.activeElement && document.activeElement.hasClass('prompt-input') && e.code == "KeyJ" && e.metaKey && !e.shiftKey && !e.ctrlKey){
		e.preventDefault();
		document.dispatchEvent(new KeyboardEvent("keydown",{"key":"ArrowDown","code":"ArrowDown"}))
	}
});
document.addEventListener('keydown',(e) =>{
	if (document.activeElement && document.activeElement.hasClass('prompt-input') && e.code == "KeyK" && e.metaKey && !e.shiftKey && !e.ctrlKey){
		e.preventDefault();
		document.dispatchEvent(new KeyboardEvent("keydown",{"key":"ArrowUp","code":"ArrowUp"}))
	}
});
12

@nick_s where do you place the code snippet?

13

I managed to make it work by creating a plugin using this guide: Create your first plugin | Obsidian Plugin Developer Docs.

I then replaced main.ts with the contents below:

1 Like
14

Want this so much!!!

15

I want this as well. I was expecting it to be customizable but it seems to be not!

/happy vim user

17

For anyone looking into this, I use this a lot in VS Code and applied it for obsidian in the same way for the default quick switcher and command menu:

  1. Changed quick switcher hotkey to cmd + p
  2. command menu => cmd + shift + p
  3. to go to the next option in either one => cmd + p
  4. to go to the prev option => cmd + shift + p
  5. cmd key up => open selected option, menu keeps open with cmd pressed

I followed the guide to create a small plugin and edited the main.ts to this:

import {App, Editor, MarkdownView, Modal, Notice, Plugin, PluginSettingTab, Setting} from 'obsidian';

// Remember to rename these classes and interfaces!

interface MyPluginSettings {
	mySetting: string;
}

const DEFAULT_SETTINGS: MyPluginSettings = {
	mySetting: 'default'
}

function isKeyRelevant(document: HTMLDocument, event: KeyboardEvent, isSuggesting: boolean) {

	if (!document.activeElement || !event.metaKey) {

		return false;
	}
	const el = document.activeElement;
	const isInOmniSearch = el.closest(".omnisearch-modal");
	const isInAutoCompleteFile = el.closest(".cm-content")
	// The OmniSearch plugin already maps Ctrl-J and Ctrl-K and we don't want to duplicate the
	// effort and jump twice.
	return (!isInOmniSearch && el.hasClass('prompt-input')) || isInAutoCompleteFile || isSuggesting;
}

export default class MyPlugin extends Plugin {
	settings: MyPluginSettings;
	private arrowKeyPressed = false;

	async onload() {
		await this.loadSettings();
		// Down event - Cmd+P
		document.addEventListener('keydown', (e) => {
			if (isKeyRelevant(document, e, app.workspace.editorSuggest.currentSuggest) && e.code == "KeyP" && e.metaKey && !e.shiftKey) {
				e.preventDefault();
				this.arrowKeyPressed = true;
				document.dispatchEvent(new KeyboardEvent("keydown", {"key": "ArrowDown", "code": "ArrowDown"}))
			}
		});
		// Up event - Cmd+Shift+P
		document.addEventListener('keydown', (e) => {
			if (isKeyRelevant(document, e, app.workspace.editorSuggest.currentSuggest) && e.code == "KeyP" && e.metaKey && e.shiftKey) {
				e.preventDefault();
				this.arrowKeyPressed = true;
				document.dispatchEvent(new KeyboardEvent("keydown", {"key": "ArrowUp", "code": "ArrowUp"}))
			}
		});
		
		// Trigger Enter on Command key release only if no arrow keys were pressed
		document.addEventListener('keyup', (e) => {
			if ((e.code === "MetaLeft" || e.code === "MetaRight") && this.arrowKeyPressed) {
				document.dispatchEvent(new KeyboardEvent("keydown", {"key": "Enter", "code": "Enter"}))
			}
			// Reset the flag when Command key is released
			if (e.code === "MetaLeft" || e.code === "MetaRight") {
				this.arrowKeyPressed = false;
			}
		});
	}

	onunload() {

	}

	async loadSettings() {
		this.settings = Object.assign({}, DEFAULT_SETTINGS, await this.loadData());
	}

	async saveSettings() {
		await this.saveData(this.settings);
	}
}

class SampleModal extends Modal {
	constructor(app: App) {
		super(app);
	}

	onOpen() {
		const {contentEl} = this;
		contentEl.setText('Woah!');
	}

	onClose() {
		const {contentEl} = this;
		contentEl.empty();
	}
}

class SampleSettingTab extends PluginSettingTab {
	plugin: MyPlugin;

	constructor(app: App, plugin: MyPlugin) {
		super(app, plugin);
		this.plugin = plugin;
	}

	display(): void {
		const {containerEl} = this;

		containerEl.empty();

		containerEl.createEl('h2', {text: 'Settings for my awesome plugin.'});

		new Setting(containerEl)
			.setName('Setting #1')
			.setDesc('It\'s a secret')
			.addText(text => text
				.setPlaceholder('Enter your secret')
				.setValue(this.plugin.settings.mySetting)
				.onChange(async (value) => {
					console.log('Secret: ' + value);
					this.plugin.settings.mySetting = value;
					await this.plugin.saveSettings();
				}));
	}
}
18

My simple script that’s a bit different than other workarounds in this thread since it doesn’t add EventListeners to the entire document:
Adding Vim-like Ctrl+J and Ctrl+K navigation to quick switcher - Share & showcase - Obsidian Forum