Vim Bindings for Glitch.com editor

glitch_vimify.js

// Load your Glitch project, paste this into the javascript console of chrome inspect
// Enjoy vim goodness!

(function () {
  var makeCursorFat = function() {
    var style = document.createElement('style');
    style.textContent =
    'div.CodeMirror div.CodeMirror-cursor { ' +
      'width: auto; ' +
      'border: 0; ' +
      'background: transparent; ' +
      'background: rgba(0, 200, 0, .4); ' +
    '} ';
    document.head.appendChild(style);
  }

  var addScript = function(callback) {
    var scr = document.createElement('script');
    scr.src = 'https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.22.0/keymap/vim.js';
    scr.onload = callback;
    document.head.appendChild(scr);
  }

  var retryInterval = 1000;

  var vimify = function () {
    var editorElement = document.querySelector('#text-editor > div.CodeMirror');

    if (editorElement) {
      editorElement.CodeMirror.options.keyMap = 'vim';
      editorElement.CodeMirror.options.showCursorWhenSelecting = 'vim';
      makeCursorFat();
      console.log('VIMification complete!');
    } else{
      retryInterval = retryInterval * 2;
      if (retryInterval < 20000) {
        console.log('Retrying to VIMify... ' + retriesLeft);
        window.setTimeout(vimify, retryInterval);
      }
      return;
    }
  };

  addScript(vimify);
}());

I found this here in the Gomix community forums, posted by user wolfascu
Thank you!

CodeMirror.Vim.map('jk', '', 'insert')

Thanks!
I had more luck with CodeMirror.Vim.map('jk', '<Esc>', 'insert') (stolen from here).

This is awesome, thanks. I recommend adding ; after the makeCursorFat and addScript definitions (lines 15 and 22). This prevents Unexpected token 'var' if made into a single line of code (for example, in a bookmarklet).