p5.js-web-editor icon indicating copy to clipboard operation
p5.js-web-editor copied to clipboard

Feature Request: Vim Mode

Open cesardeazevedo opened this issue 2 years ago • 0 comments

Nature of issue?

  • New feature request

New feature details:

This feature request together with a working implementation proposes a new user preference to enable Vim Mode on p5 Codemirror editor.

I did some search about any discussion related to Vim on p5 web editor, but I couldn't find any, so I ended up with a working implementation which wasn't that difficult as I thought, since Codemirror already supports Vim Keymap, I just had to change the Keymap from codemirror/keymap/sublime to codemirror/keymap/vim and add a preference option to the UI.

Screen Shot 2021-11-26 at 02 03 33

One small concern is the slightly increase on the bundle size, since codemirror/keymap/vim is about 220 KB, (although I ended up with 4.2MB on my app.[hash].js on my local build and 4.1MB without keymap/vim, but on the live p5 editor is just 1.1MB, I am a bit confused 🧐).

Another concern to keep in mind is with underlying issues with Codemirror Vim Keymap implementation itself, which apparently does not have an active maintainer, although I didn't had any problems.

I am not sure if this is a such demanded feature, but would love to hear some feedback.

Code: https://github.com/cesardeazevedo/p5.js-web-editor/commit/03fe75b3d60c5f52375758993e565441929ebfa7 Implementation: https://p5-vim.herokuapp.com/ (I don't know how to fix the PREVIEW_URL) Codemirror vim issues: https://github.com/codemirror/codemirror/issues?q=is%3Aissue+is%3Aopen+label%3Avim

cesardeazevedo avatar Nov 26 '21 10:11 cesardeazevedo