I had a brief play around with the example, and pretty quickly came across bugs and unimplemented commands (for example: 'b', 'e' and 'O' are missing, but 'o' acts like 'O'). I like the way the cursor changes colour to hint at the current mode.
However, what I'd really love would be a bookmarklet I could click to Vi-ify every <textarea> on the current page. I've got "It's All Text" set up in Firefox to open <textearea>s in gvim, but it's still clunkier than editing right there in the page.
The Pentadactyl plugin for Firefox (http://dactyl.sourceforge.net/pentadactyl/), which is a better-maintained fork of the well-known Vimperator, allows you to hit <C-T> in any textarea or text input to enable Vim-style keybindings inline. <C-I> opens the text for editing in an actual Vim instance, like the plugin you mentioned.
Of course, Pentadactyl changes a lot about how the browser works beyond just text editing, so it may not be for everyone.
javascript:(function(){var d=document;var s=d.createElement('script');var t=d.getElementsByTagName('textarea');s.setAttribute('src','http://webvi.googlecode.com/svn/trunk/lib/webvi.js);d.body.appendChild(s);for(var i in t){if(typeof t[i]=='object')t[i].setAttribute('class','webvi');}webvi_init();})();
I had to make some changes to get it working on my machine:
javascript:(function() {var d=document;var t=d.getElementsByTagName('textarea');for(var i in t){if(typeof t[i]=='object') t[i].setAttribute('class','webvi');}var s=d.createElement('script');s.async=false;s.setAttribute('src','http://webvi.googlecode.com/svn/trunk/lib/webvi.js');d.body.appendChild(s);webvi_init();})();
In particular, you missed a ' in the .setAttribute() call, and I had to set .async=false on the script element so that it would load and execute it before trying to call webvi_init().
EDIT: No, that doesn't work either. It runs in Firebug if I paste it into the console and remove the "javascript:" prefix, but it doesn't run as a bookmarklet: it just complains about webvi_init() not being defined, even though the async flag is cleared. :(((
I got it working on Chrome by executing webvi_init() on s.onload():
javascript:(function(){var d=document;var t=d.getElementsByTagName('textarea');for(var i in t){if(typeof t[i]=='object') t[i].setAttribute('class','webvi');} var s=d.createElement('script');s.setAttribute('src','http://webvi.googlecode.com/svn/trunk/lib/webvi.js');d.body.appendChild(s);s.onload=function(){webvi_init();};})();
Then I tried to write a comment in HN using WebVi in the reply box, and after I hit 'Submit', the comment that actually got posted was just 'M' instead of what I (thought I) wrote. Ah well, early days yet. :)
I use Pentadactyl with Firefox. It allows you to use familiar vim commands to navigate the web completely without mouse. It's really fast way to search for things and lookup information (which I do a lot), but it also supports limited set of VIM commands in text areas, about 60 or so commands. It's useful when you don't want to edit in external VIM process (which you can do as well, this is configured out of the box).
The one thing that most vi-mode implementations don't get is that vi(m) is really about the possibility to configure every keystroke. Its not about "j" is "up" and "dd" deletes the current line.
But in seriousness, although I agree about the importance of configurability, I still find that things like "j is down" and "dd deletes the current line" are an important, integral part of the vi-philosophy.
Placing the most common tasks behind the easiest key-bindings for maximum efficiency and ergonomy is the idea that got me to try out vim in the first place.
I like that someone (Bill Joy and Bram Molenaar) has solved the most common issues in editor-usage in a great way leaving me to configure only some special cases.
I'm rather skeptical about text editors implemented on top of the canvas element. Mozilla has already tried that with Bespin project and it failed miserably (huge code base, poor performance, limited accessibility).
Wouldn't it be easier to just use div element with contentEditable attribute? Currently contentEditable has limited API and a lot of inconstancies across browsers, but in the longer run it seems to be the way to go: http://ehsanakhgari.org/blog/2011-08-31/future-editing-web
contentEditable isn't very cross-platform, comes with its own set of keybindings, and it's difficult to decorate the text you're working on as you type without glitching things.
I'm also skeptical about canvas, so when I implemented my own jsvi years ago (at http://src.internetconnection.net/vi and now at http://geocar.sdf1.org/vi ) I didn't use canvas. It works everywhere but chrome (which won't let me capture escape), and it produces the same results all the way back to MSIE6.
In retrospect, I would've had an easier time overriding keystrokes on a textarea.
Second that. With my belgian-french keyboard, some keys are correct, some aren't. I can't even refer to an online picture of a qwerty keyboard. Very confusing.
I also tried switching to a qwerty keyboard layout on my computer, but then I'm told that ':' is not a valid command (this might have to do with my lack of vi-savyness, so I'm taking tips - but using ':' to enter some commands is how it works on my linux box anyway).
What disappoints me about all these implementations is the absence of text objects, though. I love getting edition words or parentheses using commands such as caw and ci"
However, what I'd really love would be a bookmarklet I could click to Vi-ify every <textarea> on the current page. I've got "It's All Text" set up in Firefox to open <textearea>s in gvim, but it's still clunkier than editing right there in the page.