rustpad icon indicating copy to clipboard operation
rustpad copied to clipboard

Feature Request: Vim key bindings

Open zkirby opened this issue 1 year ago • 3 comments

Certain companies have started to use Rustpad in their interview loop. Vim keybindings are essential to any developer that uses Vim day-to-day.

zkirby avatar Jul 02 '24 17:07 zkirby

Seems reasonable! I'll look into it when I have time.

ekzhang avatar Jul 24 '24 04:07 ekzhang

I created a custom tampermonkey script that identifies the editor rustpad uses (monaco), and enables vim mode on it:

// ==UserScript==
// @name         Rustpad Vim Mode
// @namespace    http://tampermonkey.net/
// @version      2.0
// @description  Enable vim mode for rustpad.io
// @author       You
// @match        https://rustpad.io/*
// @grant        none
// @run-at       document-end
// ==/UserScript==

(function() {
    'use strict';
    
    const initVim = () => {
        if (!window.monaco || !monaco.editor.getEditors().length) {
            setTimeout(initVim, 100);
            return;
        }
        
        // Configure Monaco's loader to find monaco-vim
        if (window.require && window.require.config) {
            require.config({
                paths: {
                    'monaco-vim': 'https://unpkg.com/[email protected]/dist/monaco-vim'
                }
            });
        }
        
        // Now try to load it
        if (window.require) {
            require(['monaco-vim'], function(MonacoVim) {
                const editor = monaco.editor.getEditors()[0];
                const statusNode = document.createElement('div');
                statusNode.style.cssText = 'position: fixed; bottom: 0; left: 0; right: 0; background: #1e1e1e; color: #d4d4d4; padding: 4px 8px; font-family: monospace; font-size: 12px; z-index: 9999;';
                document.body.appendChild(statusNode);
                
                const vimMode = MonacoVim.initVimMode(editor, statusNode);
                console.log('✅ Vim mode enabled!');
            }, function(err) {
                console.error('Failed to load monaco-vim:', err);
                // Fallback: try loading without AMD
                tryDirectLoad();
            });
        } else {
            tryDirectLoad();
        }
    };
    
    const tryDirectLoad = () => {
        console.log('Trying direct load...');
        // Temporarily break AMD
        const oldDefine = window.define;
        const oldRequire = window.require;
        delete window.define;
        delete window.require;
        
        const script = document.createElement('script');
        script.src = 'https://unpkg.com/[email protected]/dist/monaco-vim.js';
        script.onload = () => {
            setTimeout(() => {
                // Restore AMD
                window.define = oldDefine;
                window.require = oldRequire;
                
                if (window.MonacoVim) {
                    const editor = monaco.editor.getEditors()[0];
                    const statusNode = document.createElement('div');
                    statusNode.style.cssText = 'position: fixed; bottom: 0; left: 0; right: 0; background: #1e1e1e; color: #d4d4d4; padding: 4px 8px; font-family: monospace; font-size: 12px; z-index: 9999;';
                    document.body.appendChild(statusNode);
                    
                    window.vimMode = window.MonacoVim.initVimMode(editor, statusNode);
                    console.log('✅ Vim mode enabled (direct load)!');
                }
            }, 200);
        };
        document.head.appendChild(script);
    };
    
    initVim();
})();

Steps:

  • Install tampermonkey extension
  • create a new user script
  • paste the above script and save
  • reload rustpad.io

Hopefully it enables vim mode like it did for me.

ArvindParekh avatar Oct 23 '25 20:10 ArvindParekh

Any chance of moving this into Rustpad (Toggle switch underneath Dark Mode)? Would you accept a patch?

muellerj avatar Nov 20 '25 12:11 muellerj