Surfingkeys is another Chrome extension that provides keyboard-based navigation and control of the web in the spirit of the VIM editor. But it's not for VIM users only, it's for anyone who just needs some more shortcuts to his own functions.

There are several Chrome extensions that provides similar functionalities. I used philc/vimium for almost one year, then I switched to 1995eaton/chromium-vim half a year ago.

Both are great extensions. What makes me create another wheel, is that I found so many changes that need to be done when I tried to add some functionalities to meet my own requirements. For example, some functions that I originally used some other extensions for,

• Search selected text with different kinds for search engine
• Double click on a word to get translation

Surfingkeys is created with all settings described in Javascript, so it's easy for anyone to map any keystrokes to his own defined Javascript function. For example,

mapkey('c-y', 'Show me the money', function() {
    alert('a well-known phrase uttered by characters in the 1996 film Jerry Maguire');
});

Reference for editing your own settings.

• All settings are set up within a javascript file, which makes it easy to create mapping to user customized function.
• A large cursor in visual mode, which makes visual mode better.
• My favorite feature -- search selected with, which works both in normal mode and visual mode.
• Help messages are automatically generated for mappings.
• * to search word under curson in visual mode.
• Scroll actions like page up/down (e d) work for not only top window both also scrollable DIV.
• w to switch frames if there is.

After you install the extension from Chrome Web Store, open a site you'd like. Then press u or Ctrl-i to take a quick look on the default mappings first. Press Esc to hide the usage popover.

Try some mappings described in the usage popover. For example, press e to scroll a page up, d to scroll a page down, se to open settings page.

Surfingkeys now have only two modes.

All mappings added with mapkey works in this mdoe.

All mappings added with vmapkey works in this mdoe, with some built-in mappings like those in VIM - j k h l b w``0 $ etc.

Press v to toggle visual mode. You'll see an indicator at bottom of current page - Caret or Range, and a large cursor on page. The cursor is made large for visibility, as sometimes it's not easy for human to locate a normal cursor on a web page.

Caret indicates that cursor is moved when you press jkhl, Range indicates that you'll select text when moving cursor.

Now here is a small practice,

1. press v you'll see Caret
2. use the VIM key bindings to move cursor to some where.
3. press v again, you'll see Range.
4. use the VIM key bindings to select some text.
5. press sg to see what will happen.
6. press v again to back to normal mode.

Find is not actually a mode, it just another way to enter visual mode. Press / to open find bar, which sits at almost the same position with Mode indicator, type something there. All occurrences of your input will be highlighted. Press Enter to finish the finding, and you're in Caret visual mode now, press n to find next, N to find previous.

My favorite feature from when I was using Firefox. For both Firefox and Chrome, the extensions make it through context menu. Surfingkeys makes it through key mappings. By default, when you press sg in normal mode, it will search selected text with google, if there is none selected, it will search text from system clipboard with google. In visual mode, it will search selected text with google.

The g in sg is a search alias for google, there are some other built-in search aliases -- like w for bing. So press sw to search selected with bing. Refer to Add search alias to omnibar to add your own search alias, especially those search engines for company inside.

mapkey(keystroke, help_string, action_code)

vmapkey(keystroke, help_string, action_code)

mapkey in visual mode

addSearchAlias(alias, prompt, search_url, suggestion_url, callback_to_parse_suggestion);

addSearchAliasX(alias, prompt, search_url, search_leader_key, suggestion_url, callback_to_parse_suggestion);

This version will create a mapping to search selected text with search_url on pressing search_leader_key followed by alias, except that it adds search alias to omnibar as the normal version. For example, below line

addSearchAliasX('s', 'stackoverflow', 'http://stackoverflow.com/search?q=', 'o');

works like

addSearchAlias('s', 'stackoverflow', 'http://stackoverflow.com/search?q=');
mapkey('os', 'Search Selected with stackoverflow',  'searchSelectedWith("http://stackoverflow.com/search?q=")');
vmapkey('os', 'Search Selected with stackoverflow',  'searchSelectedWith("http://stackoverflow.com/search?q=")');

OmnibarUtils.listWords(<array of words>)
OmnibarUtils.html(<any html snippets>)

Mini query differs from search engine by showing the query result in omnibar instead of openning a new page.

addMiniQuery(alias, prompt, search_url, callback_to_display_result);

MIT License