CODEWITHSUNDEEP
ace-editor
Rick Strahl
Rick Strahl

Reputation: 17671

How to detect Vim Insert Mode in Ace Editor

In my editor implementation I need to detect when people move up and down in the editor with keyboard navigation. I can easily do this in 'default' ACE edit mode by capturing the up and down keys.

With VIM however this is more complicated as the vim navigation keys should be captured only in navigation mode. I can check to see whether the editor is using Vim mode, but I can't figure out how detect what mode VIM is in.

Here is what I have at this point for the key navigation trapping:

$("pre[lang]").on("keyup", function(event) {
  updateDocument();

  // up and down handling - force a preview refresh
  if (event.keyCode === 38 || event.keyCode === 40)
    te.previewRefresh();
  else if (te.lastStyle.keyboardHandler === "vim") {
       var vim = require("ace/keyboard/vim").Vim;  
      // How to get active Vim mode in document?
      //
      // if (vim is in navigation mode)
      //    te.previewRefresh();
  }
});

Any help would be appreciated.

Maybe there's a better way to trap keyboard navigation when the row changes. I've played around with the editor change event and deltas but that looked even more complex and unreliable than the key trapping. Any suggestions on something I might have missed would be useful.

Upvotes: 1

Views: 299

Answers (1)

Rick Strahl
Rick Strahl

Reputation: 17671

Looks I found my answer right after posting (of course). Posting here for others to see.

ACE actually keeps track of vim and its configured state and there's a state object attached to editor.state with an insertMode (and others) that can be checked.

The following lets me detect navigation keys and take action on it.

// up and down handling - force a preview refresh
if (event.keyCode === 38 || event.keyCode === 40)      
  previewRefresh();

else if (te.editor.$keybindingId === "ace/keyboard/vim"
  && (event.keyCode === 74 || event.keyCode == 75)) {
  if (!te.editor.state.cm.state.vim.insertMode)
    previewRefresh();
}

Upvotes: 2

Related Questions