From 083ed4dc8282de961e1733e1d98a792d79befc5f Mon Sep 17 00:00:00 2001
From: Phil Crosby
Date: Sat, 5 May 2012 20:15:27 -0700
Subject: Put content scripts and background scripts in separate directories,
 so the purpose and execution mode are more clear.

Sorry if you had patches in your local copies and this breaks them -- these renames were
a long time coming, and now is better than later.
---
 background/settings.js             |   81 ---
 background_page.html               |    6 +-
 background_scripts/commands.js     |  252 ++++++++
 background_scripts/completion.js   |  626 +++++++++++++++++++
 background_scripts/settings.js     |   81 +++
 commands.js                        |  252 --------
 content_scripts/link_hints.js      |  552 +++++++++++++++++
 content_scripts/vimium_frontend.js | 1182 ++++++++++++++++++++++++++++++++++++
 content_scripts/vomnibar.js        |  232 +++++++
 lib/completion.js                  |  626 -------------------
 lib/domUtils.js                    |  121 ----
 lib/dom_utils.js                   |  121 ++++
 lib/keyboardUtils.js               |   66 --
 lib/keyboard_utils.js              |   66 ++
 linkHints.js                       |  552 -----------------
 manifest.json                      |   10 +-
 options.html                       |    8 +-
 test_harnesses/automated.html      |    8 +-
 vimiumFrontend.js                  | 1182 ------------------------------------
 vomnibar.js                        |  232 -------
 20 files changed, 3128 insertions(+), 3128 deletions(-)
 delete mode 100644 background/settings.js
 create mode 100644 background_scripts/commands.js
 create mode 100644 background_scripts/completion.js
 create mode 100644 background_scripts/settings.js
 delete mode 100644 commands.js
 create mode 100644 content_scripts/link_hints.js
 create mode 100644 content_scripts/vimium_frontend.js
 create mode 100644 content_scripts/vomnibar.js
 delete mode 100644 lib/completion.js
 delete mode 100644 lib/domUtils.js
 create mode 100644 lib/dom_utils.js
 delete mode 100644 lib/keyboardUtils.js
 create mode 100644 lib/keyboard_utils.js
 delete mode 100644 linkHints.js
 delete mode 100644 vimiumFrontend.js
 delete mode 100644 vomnibar.js

diff --git a/background/settings.js b/background/settings.js
deleted file mode 100644
index a00317b0..00000000
--- a/background/settings.js
+++ /dev/null
@@ -1,81 +0,0 @@
-/*
- * Used by everyone to manipulate localStorage.
- */
-var settings = {
-
-  defaults: {
-    scrollStepSize: 60,
-    linkHintCharacters: "sadfjklewcmpgh",
-    filterLinkHints: false,
-    hideHud: false,
-    userDefinedLinkHintCss:
-      "div > .vimiumHintMarker {" + "\n" +
-      "/* linkhint boxes */ " + "\n" +
-      "background-color: yellow;" + "\n" +
-      "border: 1px solid #E3BE23;" + "\n" +
-      "}" + "\n\n" +
-      "div > .vimiumHintMarker span {" + "\n" +
-      "/* linkhint text */ " + "\n" +
-      "color: black;" + "\n" +
-      "font-weight: bold;" + "\n" +
-      "font-size: 12px;" + "\n" +
-      "}" + "\n\n" +
-      "div > .vimiumHintMarker > .matchingCharacter {" + "\n" +
-      "}",
-    excludedUrls: "http*://mail.google.com/*\n" +
-                  "http*://www.google.com/reader/*\n",
-
-    // NOTE : If a page contains both a single angle-bracket link and a double angle-bracket link, then in
-    // most cases the single bracket link will be "prev/next page" and the double bracket link will be
-    // "first/last page", so we put the single bracket first in the pattern string so that it gets searched
-    // for first.
-
-    // "\bprev\b,\bprevious\b,\bback\b,<,←,«,≪,<<"
-    previousPatterns: "prev,previous,back,<,\u2190,\xab,\u226a,<<",
-    // "\bnext\b,\bmore\b,>,→,»,≫,>>"
-    nextPatterns: "next,more,>,\u2192,\xbb,\u226b,>>",
-  },
-
-  init: function() {
-    // settingsVersion was introduced in v1.31, and is used to coordinate data migration. We do not use
-    // previousVersion as it is used to coordinate the display of the upgrade message, and is not updated
-    // early enough when the extension loads.
-    // 1.31 was also the version where we converted all localStorage values to JSON.
-    if (!this.has("settingsVersion")) {
-      for (var key in localStorage) {
-        // filterLinkHints' checkbox state used to be stored as a string
-        if (key == "filterLinkHints")
-          localStorage[key] = localStorage[key] === "true" ? true : false;
-        else
-          localStorage[key] = JSON.stringify(localStorage[key]);
-      }
-      this.set("settingsVersion", utils.getCurrentVersion());
-    }
-  },
-
-  get: function(key) {
-    if (!(key in localStorage))
-      return this.defaults[key];
-    else
-      return JSON.parse(localStorage[key]);
-  },
-
-  set: function(key, value) {
-    // don't store the value if it is equal to the default, so we can change the defaults in the future
-    if (value === this.defaults[key])
-      this.clear(key);
-    else
-      localStorage[key] = JSON.stringify(value);
-  },
-
-  clear: function(key) {
-    delete localStorage[key];
-  },
-
-  has: function(key) {
-    return key in localStorage;
-  },
-
-};
-
-settings.init();
diff --git a/background_page.html b/background_page.html
index e4b3e915..2c6f8e22 100644
--- a/background_page.html
+++ b/background_page.html
@@ -1,10 +1,10 @@
 <html>
 <head>
 <script type="text/javascript" src="lib/utils.js"></script>
-<script type="text/javascript" src="commands.js"></script>
+<script type="text/javascript" src="background_scripts/commands.js"></script>
 <script type="text/javascript" src="lib/clipboard.js"></script>
-<script type="text/javascript" src="background/settings.js"></script>
-<script type="text/javascript" src="lib/completion.js"></script>
+<script type="text/javascript" src="background_scripts/settings.js"></script>
+<script type="text/javascript" src="background_scripts/completion.js"></script>
 <script type="text/javascript" charset="utf-8">
   var currentVersion = utils.getCurrentVersion();
 
diff --git a/background_scripts/commands.js b/background_scripts/commands.js
new file mode 100644
index 00000000..83ef050f
--- /dev/null
+++ b/background_scripts/commands.js
@@ -0,0 +1,252 @@
+var availableCommands    = {};
+var keyToCommandRegistry = {};
+
+/*
+ * Registers a command, making it available to be optionally bound to a key.
+ * options:
+ *   - background: whether this command needs to be run against the background page.
+ *   - passCountToFunction: true if this command should have any digits which were typed prior to the
+ *     command passed to it. This is used to implement e.g. "closing of 3 tabs".
+ */
+function addCommand(command, description, options) {
+  if (availableCommands[command]) {
+    console.log(command, "is already defined! Check commands.js for duplicates.");
+    return;
+  }
+
+  options = options || {};
+  availableCommands[command] = { description: description,
+                                 isBackgroundCommand: options.background,
+                                 passCountToFunction: options.passCountToFunction
+                               };
+}
+
+function mapKeyToCommand(key, command) {
+  if (!availableCommands[command]) {
+    console.log(command, "doesn't exist!");
+    return;
+  }
+
+  keyToCommandRegistry[key] = { command: command,
+                                isBackgroundCommand: availableCommands[command].isBackgroundCommand,
+                                passCountToFunction: availableCommands[command].passCountToFunction
+                              };
+}
+
+function unmapKey(key) { delete keyToCommandRegistry[key]; }
+
+/* Lower-case the appropriate portions of named keys.
+ *
+ * A key name is one of three forms exemplified by <c-a> <left> or <c-f12>
+ * (prefixed normal key, named key, or prefixed named key). Internally, for
+ * simplicity, we would like prefixes and key names to be lowercase, though
+ * humans may prefer other forms <Left> or <C-a>.
+ * On the other hand, <c-a> and <c-A> are different named keys - for one of
+ * them you have to press "shift" as well.
+ */
+function normalizeKey(key) {
+    return key.replace(/<[acm]-/ig, function(match){ return match.toLowerCase(); })
+              .replace(/<([acm]-)?([a-zA-Z0-9]{2,5})>/g, function(match, optionalPrefix, keyName){
+                  return "<" + ( optionalPrefix ? optionalPrefix : "") + keyName.toLowerCase() + ">";
+              });
+}
+
+function parseCustomKeyMappings(customKeyMappings) {
+  lines = customKeyMappings.split("\n");
+
+  for (var i = 0; i < lines.length; i++) {
+    if (lines[i][0] == "\"" || lines[i][0] == "#") { continue }
+    split_line = lines[i].split(/\s+/);
+
+    var lineCommand = split_line[0];
+
+    if (lineCommand == "map") {
+      if (split_line.length != 3) { continue; }
+      var key = normalizeKey(split_line[1]);
+      var vimiumCommand = split_line[2];
+
+      if (!availableCommands[vimiumCommand]) { continue }
+
+      console.log("Mapping", key, "to", vimiumCommand);
+      mapKeyToCommand(key, vimiumCommand);
+    }
+    else if (lineCommand == "unmap") {
+      if (split_line.length != 2) { continue; }
+
+      var key = normalizeKey(split_line[1]);
+
+      console.log("Unmapping", key);
+      unmapKey(key);
+    }
+    else if (lineCommand == "unmapAll") {
+      keyToCommandRegistry = {};
+    }
+  }
+}
+
+function clearKeyMappingsAndSetDefaults() {
+  keyToCommandRegistry = {};
+
+  var defaultKeyMappings = {
+    "?": "showHelp",
+    "j": "scrollDown",
+    "k": "scrollUp",
+    "h": "scrollLeft",
+    "l": "scrollRight",
+    "gg": "scrollToTop",
+    "G": "scrollToBottom",
+    "zH": "scrollToLeft",
+    "zL": "scrollToRight",
+    "<c-e>": "scrollDown",
+    "<c-y>": "scrollUp",
+
+    "d": "scrollPageDown",
+    "u": "scrollPageUp",
+    "r": "reload",
+    "gs": "toggleViewSource",
+
+    "i": "enterInsertMode",
+
+    "H": "goBack",
+    "L": "goForward",
+    "gu": "goUp",
+
+    "gi": "focusInput",
+
+    "f":     "linkHints.activateMode",
+    "F":     "linkHints.activateModeToOpenInNewTab",
+    "<a-f>": "linkHints.activateModeWithQueue",
+
+    "/": "enterFindMode",
+    "n": "performFind",
+    "N": "performBackwardsFind",
+
+    "[[": "goPrevious",
+    "]]": "goNext",
+
+    "yy": "copyCurrentUrl",
+    "yf": "linkHints.activateModeToCopyLinkUrl",
+
+    "p": "openCopiedUrlInCurrentTab",
+    "P": "openCopiedUrlInNewTab",
+
+    "K": "nextTab",
+    "J": "previousTab",
+    "gt": "nextTab",
+    "gT": "previousTab",
+    "g0": "firstTab",
+    "g$": "lastTab",
+
+    "t": "createTab",
+    "x": "removeTab",
+    "X": "restoreTab",
+
+    "o": "vomnibar.activate",
+    "O": "vomnibar.activateWithCurrentUrl",
+
+    "T": "vomnibar.activateTabSelection",
+
+    "gf": "nextFrame",
+  };
+
+  for (var key in defaultKeyMappings)
+    mapKeyToCommand(key, defaultKeyMappings[key]);
+}
+
+// This is a mapping of: commandIdentifier => [description, options].
+var commandDescriptions = {
+  // Navigating the current page
+  showHelp: ["Show help", { background: true }],
+  scrollDown: ["Scroll down"],
+  scrollUp: ["Scroll up"],
+  scrollLeft: ["Scroll left"],
+  scrollRight: ["Scroll right"],
+  scrollToTop: ["Scroll to the top of the page"],
+  scrollToBottom: ["Scroll to the bottom of the page"],
+  scrollToLeft: ["Scroll all the way to the left"],
+
+  scrollToRight: ["Scroll all the way to the right"],
+  scrollPageDown: ["Scroll a page down"],
+  scrollPageUp: ["Scroll a page up"],
+  scrollFullPageDown: ["Scroll a full page down"],
+  scrollFullPageUp: ["Scroll a full page up"],
+
+  reload: ["Reload the page"],
+  toggleViewSource: ["View page source"],
+
+  copyCurrentUrl: ["Copy the current URL to the clipboard"],
+  'linkHints.activateModeToCopyLinkUrl': ["Copy a link URL to the clipboard"],
+  openCopiedUrlInCurrentTab: ["Open the clipboard's URL in the current tab", { background: true }],
+  openCopiedUrlInNewTab: ["Open the clipboard's URL in a new tab", { background: true }],
+
+  enterInsertMode: ["Enter insert mode"],
+
+  focusInput: ["Focus the first (or n-th) text box on the page", { passCountToFunction: true }],
+
+  'linkHints.activateMode': ["Open a link in the current tab"],
+  'linkHints.activateWithCurrentUrl': ["Open a link in a new tab"],
+  'linkHints.activateModeWithQueue': ["Open multiple links in a new tab"],
+
+  enterFindMode: ["Enter find mode"],
+  performFind: ["Cycle forward to the next find match"],
+  performBackwardsFind: ["Cycle backward to the previous find match"],
+
+  goPrevious: ["Follow the link labeled previous or <"],
+  goNext: ["Follow the link labeled next or >"],
+
+  // Navigating your history
+  goBack: ["Go back in history", { passCountToFunction: true }],
+  goForward: ["Go forward in history", { passCountToFunction: true }],
+
+  // Navigating the URL hierarchy
+  goUp: ["Go up the URL hierarchy", { passCountToFunction: true }],
+
+  // Manipulating tabs
+  nextTab: ["Go one tab right", { background: true }],
+  previousTab: ["Go one tab left", { background: true }],
+  firstTab: ["Go to the first tab", { background: true }],
+  lastTab: ["Go to the last tab", { background: true }],
+  createTab: ["Create new tab", { background: true }],
+  removeTab: ["Close current tab", { background: true }],
+  restoreTab: ["Restore closed tab", { background: true }],
+
+  "vomnibar.activate": ["Open URL, bookmark, or history entry"],
+  "vomnibar.activateWithCurrentUrl": ["Open URL, bookmark, history entry, starting with the current URL"],
+  "vomnibar.activateTabSelection": ["Search through your open tabs"],
+
+  nextFrame: ["Cycle forward to the next frame on the page", { background: true, passCountToFunction: true }]
+};
+
+for (var command in commandDescriptions)
+  addCommand(command, commandDescriptions[command][0], commandDescriptions[command][1]);
+
+
+// An ordered listing of all available commands, grouped by type. This is the order they will
+// be shown in the help page.
+var commandGroups = {
+  pageNavigation:
+    ["scrollDown", "scrollUp", "scrollLeft", "scrollRight",
+     "scrollToTop", "scrollToBottom", "scrollToLeft", "scrollToRight", "scrollPageDown",
+     "scrollPageUp", "scrollFullPageUp", "scrollFullPageDown",
+     "reload", "toggleViewSource", "copyCurrentUrl", "linkHints.activateModeToCopyLinkUrl",
+     "openCopiedUrlInCurrentTab", "openCopiedUrlInNewTab", "goUp",
+     "enterInsertMode", "focusInput",
+     "linkHints.activateMode", "linkHints.activateModeToOpenInNewTab", "linkHints.activateModeWithQueue",
+     "vomnibar.activate", "vomnibar.activateWithCurrentUrl", "vomnibar.activateTabSelection",
+     "goPrevious", "goNext", "nextFrame"],
+  findCommands: ["enterFindMode", "performFind", "performBackwardsFind"],
+  historyNavigation:
+    ["goBack", "goForward"],
+  tabManipulation:
+    ["nextTab", "previousTab", "firstTab", "lastTab", "createTab", "removeTab", "restoreTab"],
+  misc:
+    ["showHelp"]
+};
+
+// Rarely used commands are not shown by default in the help dialog or in the README. The goal is to present
+// a focused, high-signal set of commands to the new and casual user. Only those truly hungry for more power
+// from Vimium will uncover these gems.
+var advancedCommands = [
+    "scrollToLeft", "scrollToRight",
+    "goUp", "focusInput", "linkHints.activateModeWithQueue",
+    "goPrevious", "goNext"];
diff --git a/background_scripts/completion.js b/background_scripts/completion.js
new file mode 100644
index 00000000..b31c4918
--- /dev/null
+++ b/background_scripts/completion.js
@@ -0,0 +1,626 @@
+/*
+ * This contains the definition of the completers used for the Vomnibox's suggestion UI. A complter will take
+ * a query (whatever the user typed into the Vomnibox) and return a list of matches, e.g. bookmarks, domains,
+ * URLs from history.
+ *
+ * The Vomnibox frontend script makes a "filterCompleter" request to the background page, which in turn calls
+ * filter() on each these completers.
+ *
+ * A completer is a class which has two functions:
+ * - refresh(): refreshes the completer's data source (e.g. refetches the list of bookmarks from Chrome).
+ * - filter(query, callback): "query" will be whatever the user typed into the Vomnibox. "callback" is a
+ *   function which will be invoked with a list of LazyCompletionResults as its first argument.
+ *
+ * A completer's filter() function returns a list of LazyCompletionResults. This contains a relevancy score
+ * for the result, as well as a function to build the full result (e.g. the HTML representing this result).
+ *
+ * The MultiCompleter collects a big list of LazyCompletionResults from many completers by calling each of
+ * their filter functions in turn, sorts the results by relevancy, and then calls build() on the top N
+ * results. This allows us to avoid generating HTML for all of the results we're not going to use.
+ * The objects returned from build() are sent to the Vomnibox frontend script to be shown in the UI.
+ */
+var completion = (function() {
+
+  /*
+   * An object which contains a relevancy score for the given completion, and a function which can be
+   * invoked to build its HTML.
+   * Calling build() should return an object of the form:
+   *   { html: "", action: { functionName: "", args: [] } }
+   * This object is eventually sent back to the Vomnibox frontend script. "action" contains the action to
+   * be performed by the frontend script if this result is chosen (user selects it and hits enter).
+   * "action" includes the function the frontendScript should execute (e.g. "navigateToUrl") along with any
+   * arguments (like the URL).
+   * "html" is the HTML representation of this result, with some characters emphasized to higlight the query.
+   *
+   * This is called "lazy" because it takes in a function to lazily compute a result's html. That operation
+   * can be kind of expensive, so you only want to do it to the top completion results, after you've sorted
+   * them by relevancy.
+   */
+  var LazyCompletionResult = function(relevancy, buildFunction) {
+    this.relevancy = relevancy;
+    this.build = buildFunction;
+  }
+
+  /*
+   * A completer which takes in a list of keyword commands (like "wiki" for "search wikipedia") and will
+   * decide if your query is a command, a URL that you want to visit, or a search term.
+   */
+  var SmartKeywordCompleter = Class.extend({
+    /*
+     * - commands: a list of commands of the form: { keyword: [title, url] }, e.g.:
+     *   { "wiki ": ["Wikipedia (en)", "http://en.wikipedia.org/wiki/%s" ]
+     */
+    init: function(commands) {
+      this.commands = commands || {};
+      this.commandKeys = Object.keys(commands);
+    },
+
+    refresh: function() { },
+
+      /** Returns the suggestions matching the user-defined commands */
+    getCommandSuggestions: function(query, suggestions) {
+      return this.commandKeys.filter(function(cmd) { return query.indexOf(cmd) == 0 }).map(function(cmd) {
+        var term = query.slice(cmd.length);
+        var desc = this.commands[cmd][0];
+        var pattern = this.commands[cmd][1];
+        var url = (typeof pattern == "function") ? pattern(term) : pattern.replace(/%s/g, term);
+
+        // this will appear even before the URL/search suggestion
+        return new LazyCompletionResult(-2, function() {
+          return {
+            html:   createCompletionHtml(desc, term),
+            action: { functionName: "navigateToUrl", args: [utils.createFullUrl(url)] },
+          }})
+      }.proxy(this));
+    },
+
+    /** Checks if the input is a URL. If yes, returns a suggestion to visit it. If no, returns a suggestion
+     * to start a web search. */
+    getUrlOrSearchSuggestion: function(query, suggestions) {
+      // trim query
+      query = query.replace(/^\s+|\s+$/g, '');
+      var isUrl = utils.isUrl(query);
+      return new LazyCompletionResult(-1, function() {
+        return {
+            html: createCompletionHtml(isUrl ? "goto" : "search", query),
+            action: { functionName: "navigateToUrl",
+                args: isUrl ? [utils.createFullUrl(query)] : [utils.createSearchUrl(query)] }
+        }});
+    },
+
+    filter: function(query, callback) {
+      suggestions = this.getCommandSuggestions(query);
+      suggestions.push(this.getUrlOrSearchSuggestion(query));
+      callback(suggestions);
+    }
+  });
+
+  /*
+   * A generic asynchronous completer which is used by completers which have asynchronous data sources,
+   * like history or bookmarks.
+   */
+  var AsyncCompleter = Class.extend({
+    init: function() {
+      this.id = utils.createUniqueId();
+      this.reset();
+      this.resultsReady = this.fallbackReadyCallback = function(results) { this.completions = results; }
+    },
+
+    reset: function() {
+      fuzzyMatcher.invalidateFilterCache(this.id);
+      this.completions = null;
+    },
+
+    /*
+     * This creates an intermediate representation of a completion which will later be called with a specific
+     * query.
+     * - type: the type of item we're completing against, e.g. "bookmark", "history", "tab".
+     * - item: the item itself. This should include a url and title property (bookmark, history and tab
+     *   objects include both of these).
+     * - action: the action to take in the Vomnibox frontend 
+     *
+     * It's used to save us work -- we call this on every bookmark in your bookmarks list when we first fetch
+     * them, for instance, and we don't want to do some the same work again every time a new query is
+     * processed.
+     *
+     * TODO(philc): It would be nice if this could be removed; it's confusing.
+     * */
+    createUnrankedCompletion: function(type, item, action) {
+      var url = item.url;
+      var parts = [type, url, item.title];
+      var str = parts.join(" ");
+      action = action || { functionName: "navigateToUrl", args: [url] };
+
+      function createLazyCompletion(query) {
+        var relevancy = url.length / fuzzyMatcher.calculateRelevancy(query, str)
+        return new LazyCompletionResult(relevancy, function() {
+          return {
+            html:   renderFuzzy(query, createCompletionHtml.apply(null, parts)),
+            action: action,
+          }});
+      }
+
+      // add one more layer of indirection: For filtering, we only need the string to match.
+      // Only after we reduced the number of possible results, we call :bind on them to get
+      // an actual completion object
+      return {
+        completionString: parts.join(" "),
+        createLazyCompletion: createLazyCompletion,
+      }
+    },
+
+    processResults: function(query, results) {
+      results = fuzzyMatcher.filter(query, results,
+          function(match) { return match.completionString }, this.id);
+      return results.map(function(result) { return result.createLazyCompletion(query); });
+    },
+
+    filter: function(query, callback) {
+      var handler = function(results) { callback(this.processResults(query, results)); }.proxy(this);
+
+      // are the results ready?
+      if (this.completions !== null) {
+        // yes: call the callback synchronously
+        handler(this.completions);
+      } else {
+        // no: register the handler as a callback
+        this.resultsReady = function(results) {
+          handler(results);
+          this.resultsReady = this.fallbackReadyCallback;
+          this.resultsReady(results);
+        }.proxy(this);
+      }
+    }
+  });
+
+  var FuzzyBookmarkCompleter = Class.extend({
+    init: function() { this.asyncCompleter = new AsyncCompleter(); },
+    filter: function(query, callback) { return this.asyncCompleter.filter(query, callback); },
+
+    // Traverses the bookmark hierarhcy and retuns a list of all bookmarks in the tree.
+    traverseBookmarkTree: function(bookmarks) {
+      var results = [];
+      var toVisit = bookmarks;
+      while (toVisit.length > 0) {
+        var bookmark = toVisit.shift();
+        results.push(bookmark);
+        if (bookmark.children)
+          toVisit.push.apply(toVisit, bookmark.children);
+      }
+      return results;
+    },
+
+    refresh: function() {
+      this.asyncCompleter.reset();
+      chrome.bookmarks.getTree(function(bookmarks) {
+        var results = this.traverseBookmarkTree(bookmarks);
+        var validResults = results.filter(function(b) { return b.url !== undefined; });
+        var matches = validResults.map(function(bookmark) {
+          return this.asyncCompleter.createUnrankedCompletion("bookmark", bookmark);
+        }.proxy(this));
+        this.asyncCompleter.resultsReady(matches);
+      }.proxy(this));
+    }
+  });
+
+  var FuzzyHistoryCompleter = Class.extend({
+    init: function(maxResults) {
+      this.asyncCompleter = new AsyncCompleter();
+      this.maxResults = maxResults;
+    },
+
+    filter: function(query, callback) { return this.asyncCompleter.filter(query, callback); },
+
+    refresh: function() {
+      this.asyncCompleter.reset();
+
+      historyCache.use(function(history) {
+        this.asyncCompleter.resultsReady(history.slice(-this.maxResults).map(function(item) {
+          return this.asyncCompleter.createUnrankedCompletion("history", item);
+        }.proxy(this)));
+      }.proxy(this));
+    }
+  });
+
+  var FuzzyTabCompleter = Class.extend({
+    init: function() { this.asyncCompleter = new AsyncCompleter(); },
+
+    filter: function(query, callback) { return this.asyncCompleter.filter(query, callback); },
+
+    refresh: function() {
+      this.asyncCompleter.reset();
+      chrome.tabs.getAllInWindow(null, function(tabs) {
+        this.asyncCompleter.resultsReady(tabs.map(function(tab) {
+          return this.asyncCompleter.createUnrankedCompletion("tab", tab,
+              { functionName: "switchToTab", args: [tab.id] });
+        }.proxy(this)));
+      }.proxy(this));
+    }
+  });
+
+  /*
+   * A completer which matches only domains from sites in your history with the current query.
+   */
+  var DomainCompleter = Class.extend({
+    // A mapping of doamin => useHttps, where useHttps is a boolean.
+    domains: null,
+
+    withDomains: function(callback) {
+      var self = this;
+      function buildResult() {
+        return Object.keys(self.domains).map(function(dom) {
+          return [dom, self.domains[dom]];
+        });
+      }
+      if (self.domains !== null)
+        return callback(buildResult());
+
+      self.domains = {};
+
+      function processDomain(domain, https) {
+        // non-www version is preferrable, so check if we have it already
+        if (domain.indexOf('www.') == 0 && self.domains.hasOwnProperty(domain.slice(4)))
+          domain = domain.slice(4);
+
+        // HTTPS is preferrable
+        https = https || self.domains[domain] || self.domains['www.' + domain];
+
+        self.domains[domain] = !!https;
+        delete self.domains['www.' + domain];
+      }
+
+      function processUrl(url) {
+        parts = url.split('/');
+        processDomain(parts[2], parts[0] == 'https:');
+      }
+
+      historyCache.use(function(history) {
+        history.forEach(function(item) { processUrl(item.url); });
+      });
+
+      chrome.history.onVisited.addListener(function(item) { processUrl(item.url); });
+
+      callback(buildResult());
+    },
+
+    refresh: function() { },
+
+    filter: function(query, callback) {
+      var best = null;
+      this.withDomains(function(domains) {
+        var bestOffset = 1000;
+        domains.forEach(function(result) {
+          var domain = result[0];
+          var protocol = result[1] ? 'https' : 'http';
+
+          var offset = domain.indexOf(query);
+          if (offset < 0 || offset >= bestOffset)
+            return;
+
+          // found a new optimum
+          bestOffset = offset;
+          best = new LazyCompletionResult(-1.5, function() {
+            return {
+              html:   createCompletionHtml("site", domain),
+              action: { functionName: "navigateToUrl", args: [protocol + "://" + domain] },
+            }});
+        });
+      });
+      callback(best ? [best] : []);
+    }
+  });
+
+  /** A meta-completer that delegates queries and merges and sorts the results of a collection of other
+   * completer instances given in :sources. The optional argument :queryThreshold determines how long a
+   * query has to be to trigger a search. */
+  var MultiCompleter = Class.extend({
+    init: function(sources, queryThreshold) {
+      if (queryThreshold === undefined)
+        queryThreshold = 1; // default
+      this.sources = sources;
+      this.queryThreshold = queryThreshold;
+    },
+
+    refresh: function() { this.sources.forEach(function(source) { source.refresh(); }); },
+
+    filter: function(query, maxResults, callback) {
+      if (query.length < this.queryThreshold) {
+        callback([]);
+        return;
+      }
+
+      var allResults = [];
+      var counter = this.sources.length;
+
+      this.sources.forEach(function(source) {
+        source.filter(query, function(results) {
+          allResults = allResults.concat(results);
+          if (--counter > 0)
+            return;
+
+          // all sources have provided results by now, so we can sort and return
+          allResults.sort(function(a,b) { return a.relevancy - b.relevancy; });
+          // evalulate lazy completions for the top n results
+          callback(allResults.slice(0, maxResults).map(function(result) { return result.build(); }));
+        });
+      });
+    }
+  });
+
+  /** Singleton object that provides helpers and caching for fuzzy completion. */
+  var fuzzyMatcher = (function() {
+    var self = {};
+
+    self.timeToClean = 0;
+    self.cacheSize = 1000;
+    self.regexNonWord = /[\W_]/ig;
+
+    // cache generated regular expressions
+    self.regexpCache = {};
+    // cache filtered results from recent queries
+    self.filterCache = {};
+    self.normalizationCache = {};
+
+    /** Normalizes the string specified in :query. Strips any non-word characters and converts
+     * to lower case. */
+    self.normalize = function(query) {
+      if (!(query in self.normalizationCache))
+        self.normalizationCache[query] = query.replace(self.regexNonWord, '').toLowerCase();
+      return self.normalizationCache[query];
+    }
+
+    /** Returns the non-matching and matching string parts, in alternating order (starting with a
+     * non-matching part) or null, if the string doesn't match the query.
+     *
+     * Sample: match("codecodec","code.google.com/codec") would yield ["", "code", ".google.com/", "codec"]
+     *
+     * Note that this function matches the longest possible parts of a string and is therefore not very
+     * efficient. There it falls back to a more performant, but less accurate regex matching if the
+     * normalized query is longer than 10 characters.
+     *
+     * _Don't use this to check if a string matches a query_. Use `getRegexp(query).test(str)` instead.
+     */
+    self.getMatchGroups = function(query, str) {
+      query = self.normalize(query);
+      if (query.length == 0)
+        return str.length ? [str] : [];
+      if (query.length > 15) {
+        // for long query strings, the method is much too inefficient, so fall
+        // back to the less accurate regex matching
+        return self.getRegexp(query).exec(str).slice(1);
+      }
+
+      for (var i = query.length; i >= 1; --i) {
+        var part = query.slice(0, i);
+        var partOffset = str.toLowerCase().indexOf(part);
+        if (partOffset < 0)
+          continue;
+
+        // we use recursive backtracking here, this is why it's slow.
+        rest = self.getMatchGroups(query.slice(i), str.slice(partOffset + i));
+        if (!rest) continue;
+
+        return [
+          str.slice(0, partOffset),
+          part,
+        ].concat(rest);
+      }
+      return null;
+    }
+
+    /** Calculates a very simple similarity value between a :query and a :string */
+    self.calculateRelevancy = function(query, str) {
+      query = self.normalize(query);
+      str   = self.normalize(str);
+      var sum = 0;
+
+      // only iterate over slices of the query starting at an offset up to 10 to save resources
+      for (var start = 0; start < 20 && start < query.length; ++start) {
+        for (var i = query.length; i >= start; --i) {
+          if (str.indexOf(query.slice(start, i)) >= 0) {
+            var length = i - start;
+            sum += length * length;
+            break;
+          }
+        }
+      }
+      return sum * sum * sum;
+    }
+
+    /** Trims the size of the caches to the configured size using a FIFO algorithm. */
+    self.cleanCache = function() {
+      // remove old cached regexes
+      Object.keys(self.regexpCache).slice(self.cacheSize).forEach(function(query) {
+        delete self.regexpCache[query];
+      });
+      // remove old cached normalization results
+      Object.keys(self.normalizationCache).slice(self.cacheSize).forEach(function(query) {
+        delete self.normalizationCache[query];
+      });
+    }
+
+    /** Returns a regex that matches a string using a fuzzy :query. Example: The :query "abc" would result
+     * in a regex like /^([^a])*(a)([^b])*(b)([^c])*(c)(.*)$/
+     */
+    self.getRegexp = function(query) {
+      query = self.normalize(query);
+      if (!(query in self.regexpCache)) {
+        // build up a regex for fuzzy matching. This is the fastest method I checked (faster than:
+        // string building, splice, concat, multi-level join)
+        var regex = ['^'];
+        for (var i = 0; i < query.length; ++i) {
+          regex.push('([^');
+          regex.push(query[i]);
+          regex.push(']*)(');
+          regex.push(query[i]);
+          regex.push(')');
+        }
+        regex.push('(.*)$');
+        self.regexpCache[query] = new RegExp(regex.join(''), 'i');
+      }
+      return self.regexpCache[query];
+    }
+
+    /** Clear the cache for the given source, e.g. for refreshing */
+    self.invalidateFilterCache = function(id) {
+      self.filterCache[id] = {};
+    }
+
+    /** Filters a collection :source using fuzzy matching against an input string :query. If a query with
+     * a less specific query was issued before (e.g. if the user added a letter to the query), the cached
+     * results of the last filtering are used as a starting point, instead of :source.
+     */
+    self.filter = function(query, source, getValue, id) {
+      if (!(id in self.filterCache))
+        self.filterCache[id] = {};
+
+      // find the most narrow list of results in the cache
+      var optSpecificity = source.length;
+      var specificity;
+      for (key in self.filterCache[id]) {
+        if (!self.filterCache[id].hasOwnProperty(key))
+          continue;
+
+        if ((query.indexOf(key) != 0 && key.indexOf(query) != 0) || key.length > query.length) {
+          // cache entry no longer needed
+          delete self.filterCache[id][key];
+          continue;
+        }
+
+        // is this a plausible result set to use as a source?
+        if (query.indexOf(key) < 0)
+          continue;
+
+        // is this cache entry the most specific so far?
+        specificity = self.filterCache[id][key].length;
+        if (specificity < optSpecificity) {
+          source = self.filterCache[id][key];
+          optSpecificity = specificity;
+        }
+      }
+
+      // don't clean up the caches every iteration
+      if (++self.timeToClean > 100) {
+        self.timeToClean = 0;
+        self.cleanCache();
+      }
+
+      var regexp = self.getRegexp(query);
+      var filtered = source.filter(function(x) { return regexp.test(getValue(x)) });
+      self.filterCache[id][query] = filtered;
+      return filtered;
+    }
+
+    return self;
+  })();
+
+  var htmlRegex = /<[^>]*>|&[a-z]+;/gi;
+
+  /** Strips HTML tags and entities using a naive regex replacement. Optionally, saves the stripped
+   * HTML tags in a dictionary indexed by the position where the tag should be reinserted. */
+  function stripHtmlTags(str, positions) {
+    if (!positions)
+      return str.replace(htmlRegex, '');
+
+    var match = str.match(htmlRegex);
+    if (!match) return;
+    match.reverse();
+    var split = str.split(htmlRegex);
+    var offset = 0;
+    var i = 0;
+    split.forEach(function(text) {
+      if (match.length > 0)
+        positions[offset += text.length] = match.pop();
+    });
+
+    return split.join('');
+  }
+
+  /** Creates an file-internal representation of a URL match with the given paramters */
+  function createCompletionHtml(type, str, title) {
+    title = title || '';
+    // sanitize input, it could come from a malicious web site
+    title = title.length > 0 ? ' <span class="title">' + utils.escapeHtml(title) + '</span>' : '';
+    return '<em>' + type + '</em> ' + utils.escapeHtml(str) + title;
+  }
+
+  /** Renders a completion by marking fuzzy-matched parts. */
+  function renderFuzzy(query, html) {
+    // we want to match the content in HTML tags, but not the HTML tags themselves, so we remove the
+    // tags and reinsert them after the matching process
+    var htmlTags = {};
+    var groups = fuzzyMatcher.getMatchGroups(query, stripHtmlTags(html, htmlTags));
+
+    html = [];
+    var htmlOffset = 0;
+
+    // this helper function adds the HTML generated _for one single character_ to the HTML output
+    // and reinserts HTML tags stripped before, if they were at this position
+    function addToHtml(str) {
+      if (htmlOffset in htmlTags)
+        html.push(htmlTags[htmlOffset]);
+      html.push(str);
+      ++htmlOffset;
+    }
+
+    function addCharsWithDecoration(str, before, after) {
+      before = before || '';
+      after = after || '';
+      for (var i = 0; i < str.length; ++i)
+        addToHtml(before + str[i] + after);
+    }
+
+    // iterate over the match groups. They are non-matched and matched string parts, in alternating order
+    for (var i = 0; i < groups.length; ++i) {
+      if (i % 2 == 0)
+        // we have a non-matched part, it could have several characters. We need to insert them character
+        // by character, so that addToHtml can keep track of the position in the original string
+        addCharsWithDecoration(groups[i]);
+      else
+        // we have a matched part. In addition to the characters themselves, we add some decorating HTML.
+        addCharsWithDecoration(groups[i], '<span class="fuzzyMatch">', '</span>');
+    };
+
+    // call it another time so that a tag at the very last position is reinserted
+    addToHtml('');
+    return html.join('');
+  }
+
+  /** Singleton object that provides fast access to the Chrome history */
+  var historyCache = (function() {
+    var size = 20000;
+    var cachedHistory = null;
+
+    function use(callback) {
+      if (cachedHistory !== null)
+        return callback(cachedHistory);
+
+      chrome.history.search({ text: '', maxResults: size, startTime: 0 }, function(history) {
+        // sorting in ascending order, so we can push new items to the end later
+        history.sort(function(a, b) {
+          return (a.lastVisitTime|| 0) - (b.lastVisitTime || 0);
+        });
+        cachedHistory = history;
+        callback(history);
+      });
+
+      chrome.history.onVisited.addListener(function(item) {
+        // only cache newly visited sites
+        if (item.visitCount === 1)
+          cachedHistory.push(item);
+      });
+    }
+
+    return { use: use };
+  })();
+
+  // public interface
+  return {
+    FuzzyBookmarkCompleter: FuzzyBookmarkCompleter,
+    FuzzyHistoryCompleter: FuzzyHistoryCompleter,
+    FuzzyTabCompleter: FuzzyTabCompleter,
+    SmartKeywordCompleter: SmartKeywordCompleter,
+    DomainCompleter: DomainCompleter,
+    MultiCompleter: MultiCompleter
+  };
+})()
diff --git a/background_scripts/settings.js b/background_scripts/settings.js
new file mode 100644
index 00000000..a00317b0
--- /dev/null
+++ b/background_scripts/settings.js
@@ -0,0 +1,81 @@
+/*
+ * Used by everyone to manipulate localStorage.
+ */
+var settings = {
+
+  defaults: {
+    scrollStepSize: 60,
+    linkHintCharacters: "sadfjklewcmpgh",
+    filterLinkHints: false,
+    hideHud: false,
+    userDefinedLinkHintCss:
+      "div > .vimiumHintMarker {" + "\n" +
+      "/* linkhint boxes */ " + "\n" +
+      "background-color: yellow;" + "\n" +
+      "border: 1px solid #E3BE23;" + "\n" +
+      "}" + "\n\n" +
+      "div > .vimiumHintMarker span {" + "\n" +
+      "/* linkhint text */ " + "\n" +
+      "color: black;" + "\n" +
+      "font-weight: bold;" + "\n" +
+      "font-size: 12px;" + "\n" +
+      "}" + "\n\n" +
+      "div > .vimiumHintMarker > .matchingCharacter {" + "\n" +
+      "}",
+    excludedUrls: "http*://mail.google.com/*\n" +
+                  "http*://www.google.com/reader/*\n",
+
+    // NOTE : If a page contains both a single angle-bracket link and a double angle-bracket link, then in
+    // most cases the single bracket link will be "prev/next page" and the double bracket link will be
+    // "first/last page", so we put the single bracket first in the pattern string so that it gets searched
+    // for first.
+
+    // "\bprev\b,\bprevious\b,\bback\b,<,←,«,≪,<<"
+    previousPatterns: "prev,previous,back,<,\u2190,\xab,\u226a,<<",
+    // "\bnext\b,\bmore\b,>,→,»,≫,>>"
+    nextPatterns: "next,more,>,\u2192,\xbb,\u226b,>>",
+  },
+
+  init: function() {
+    // settingsVersion was introduced in v1.31, and is used to coordinate data migration. We do not use
+    // previousVersion as it is used to coordinate the display of the upgrade message, and is not updated
+    // early enough when the extension loads.
+    // 1.31 was also the version where we converted all localStorage values to JSON.
+    if (!this.has("settingsVersion")) {
+      for (var key in localStorage) {
+        // filterLinkHints' checkbox state used to be stored as a string
+        if (key == "filterLinkHints")
+          localStorage[key] = localStorage[key] === "true" ? true : false;
+        else
+          localStorage[key] = JSON.stringify(localStorage[key]);
+      }
+      this.set("settingsVersion", utils.getCurrentVersion());
+    }
+  },
+
+  get: function(key) {
+    if (!(key in localStorage))
+      return this.defaults[key];
+    else
+      return JSON.parse(localStorage[key]);
+  },
+
+  set: function(key, value) {
+    // don't store the value if it is equal to the default, so we can change the defaults in the future
+    if (value === this.defaults[key])
+      this.clear(key);
+    else
+      localStorage[key] = JSON.stringify(value);
+  },
+
+  clear: function(key) {
+    delete localStorage[key];
+  },
+
+  has: function(key) {
+    return key in localStorage;
+  },
+
+};
+
+settings.init();
diff --git a/commands.js b/commands.js
deleted file mode 100644
index 83ef050f..00000000
--- a/commands.js
+++ /dev/null
@@ -1,252 +0,0 @@
-var availableCommands    = {};
-var keyToCommandRegistry = {};
-
-/*
- * Registers a command, making it available to be optionally bound to a key.
- * options:
- *   - background: whether this command needs to be run against the background page.
- *   - passCountToFunction: true if this command should have any digits which were typed prior to the
- *     command passed to it. This is used to implement e.g. "closing of 3 tabs".
- */
-function addCommand(command, description, options) {
-  if (availableCommands[command]) {
-    console.log(command, "is already defined! Check commands.js for duplicates.");
-    return;
-  }
-
-  options = options || {};
-  availableCommands[command] = { description: description,
-                                 isBackgroundCommand: options.background,
-                                 passCountToFunction: options.passCountToFunction
-                               };
-}
-
-function mapKeyToCommand(key, command) {
-  if (!availableCommands[command]) {
-    console.log(command, "doesn't exist!");
-    return;
-  }
-
-  keyToCommandRegistry[key] = { command: command,
-                                isBackgroundCommand: availableCommands[command].isBackgroundCommand,
-                                passCountToFunction: availableCommands[command].passCountToFunction
-                              };
-}
-
-function unmapKey(key) { delete keyToCommandRegistry[key]; }
-
-/* Lower-case the appropriate portions of named keys.
- *
- * A key name is one of three forms exemplified by <c-a> <left> or <c-f12>
- * (prefixed normal key, named key, or prefixed named key). Internally, for
- * simplicity, we would like prefixes and key names to be lowercase, though
- * humans may prefer other forms <Left> or <C-a>.
- * On the other hand, <c-a> and <c-A> are different named keys - for one of
- * them you have to press "shift" as well.
- */
-function normalizeKey(key) {
-    return key.replace(/<[acm]-/ig, function(match){ return match.toLowerCase(); })
-              .replace(/<([acm]-)?([a-zA-Z0-9]{2,5})>/g, function(match, optionalPrefix, keyName){
-                  return "<" + ( optionalPrefix ? optionalPrefix : "") + keyName.toLowerCase() + ">";
-              });
-}
-
-function parseCustomKeyMappings(customKeyMappings) {
-  lines = customKeyMappings.split("\n");
-
-  for (var i = 0; i < lines.length; i++) {
-    if (lines[i][0] == "\"" || lines[i][0] == "#") { continue }
-    split_line = lines[i].split(/\s+/);
-
-    var lineCommand = split_line[0];
-
-    if (lineCommand == "map") {
-      if (split_line.length != 3) { continue; }
-      var key = normalizeKey(split_line[1]);
-      var vimiumCommand = split_line[2];
-
-      if (!availableCommands[vimiumCommand]) { continue }
-
-      console.log("Mapping", key, "to", vimiumCommand);
-      mapKeyToCommand(key, vimiumCommand);
-    }
-    else if (lineCommand == "unmap") {
-      if (split_line.length != 2) { continue; }
-
-      var key = normalizeKey(split_line[1]);
-
-      console.log("Unmapping", key);
-      unmapKey(key);
-    }
-    else if (lineCommand == "unmapAll") {
-      keyToCommandRegistry = {};
-    }
-  }
-}
-
-function clearKeyMappingsAndSetDefaults() {
-  keyToCommandRegistry = {};
-
-  var defaultKeyMappings = {
-    "?": "showHelp",
-    "j": "scrollDown",
-    "k": "scrollUp",
-    "h": "scrollLeft",
-    "l": "scrollRight",
-    "gg": "scrollToTop",
-    "G": "scrollToBottom",
-    "zH": "scrollToLeft",
-    "zL": "scrollToRight",
-    "<c-e>": "scrollDown",
-    "<c-y>": "scrollUp",
-
-    "d": "scrollPageDown",
-    "u": "scrollPageUp",
-    "r": "reload",
-    "gs": "toggleViewSource",
-
-    "i": "enterInsertMode",
-
-    "H": "goBack",
-    "L": "goForward",
-    "gu": "goUp",
-
-    "gi": "focusInput",
-
-    "f":     "linkHints.activateMode",
-    "F":     "linkHints.activateModeToOpenInNewTab",
-    "<a-f>": "linkHints.activateModeWithQueue",
-
-    "/": "enterFindMode",
-    "n": "performFind",
-    "N": "performBackwardsFind",
-
-    "[[": "goPrevious",
-    "]]": "goNext",
-
-    "yy": "copyCurrentUrl",
-    "yf": "linkHints.activateModeToCopyLinkUrl",
-
-    "p": "openCopiedUrlInCurrentTab",
-    "P": "openCopiedUrlInNewTab",
-
-    "K": "nextTab",
-    "J": "previousTab",
-    "gt": "nextTab",
-    "gT": "previousTab",
-    "g0": "firstTab",
-    "g$": "lastTab",
-
-    "t": "createTab",
-    "x": "removeTab",
-    "X": "restoreTab",
-
-    "o": "vomnibar.activate",
-    "O": "vomnibar.activateWithCurrentUrl",
-
-    "T": "vomnibar.activateTabSelection",
-
-    "gf": "nextFrame",
-  };
-
-  for (var key in defaultKeyMappings)
-    mapKeyToCommand(key, defaultKeyMappings[key]);
-}
-
-// This is a mapping of: commandIdentifier => [description, options].
-var commandDescriptions = {
-  // Navigating the current page
-  showHelp: ["Show help", { background: true }],
-  scrollDown: ["Scroll down"],
-  scrollUp: ["Scroll up"],
-  scrollLeft: ["Scroll left"],
-  scrollRight: ["Scroll right"],
-  scrollToTop: ["Scroll to the top of the page"],
-  scrollToBottom: ["Scroll to the bottom of the page"],
-  scrollToLeft: ["Scroll all the way to the left"],
-
-  scrollToRight: ["Scroll all the way to the right"],
-  scrollPageDown: ["Scroll a page down"],
-  scrollPageUp: ["Scroll a page up"],
-  scrollFullPageDown: ["Scroll a full page down"],
-  scrollFullPageUp: ["Scroll a full page up"],
-
-  reload: ["Reload the page"],
-  toggleViewSource: ["View page source"],
-
-  copyCurrentUrl: ["Copy the current URL to the clipboard"],
-  'linkHints.activateModeToCopyLinkUrl': ["Copy a link URL to the clipboard"],
-  openCopiedUrlInCurrentTab: ["Open the clipboard's URL in the current tab", { background: true }],
-  openCopiedUrlInNewTab: ["Open the clipboard's URL in a new tab", { background: true }],
-
-  enterInsertMode: ["Enter insert mode"],
-
-  focusInput: ["Focus the first (or n-th) text box on the page", { passCountToFunction: true }],
-
-  'linkHints.activateMode': ["Open a link in the current tab"],
-  'linkHints.activateWithCurrentUrl': ["Open a link in a new tab"],
-  'linkHints.activateModeWithQueue': ["Open multiple links in a new tab"],
-
-  enterFindMode: ["Enter find mode"],
-  performFind: ["Cycle forward to the next find match"],
-  performBackwardsFind: ["Cycle backward to the previous find match"],
-
-  goPrevious: ["Follow the link labeled previous or <"],
-  goNext: ["Follow the link labeled next or >"],
-
-  // Navigating your history
-  goBack: ["Go back in history", { passCountToFunction: true }],
-  goForward: ["Go forward in history", { passCountToFunction: true }],
-
-  // Navigating the URL hierarchy
-  goUp: ["Go up the URL hierarchy", { passCountToFunction: true }],
-
-  // Manipulating tabs
-  nextTab: ["Go one tab right", { background: true }],
-  previousTab: ["Go one tab left", { background: true }],
-  firstTab: ["Go to the first tab", { background: true }],
-  lastTab: ["Go to the last tab", { background: true }],
-  createTab: ["Create new tab", { background: true }],
-  removeTab: ["Close current tab", { background: true }],
-  restoreTab: ["Restore closed tab", { background: true }],
-
-  "vomnibar.activate": ["Open URL, bookmark, or history entry"],
-  "vomnibar.activateWithCurrentUrl": ["Open URL, bookmark, history entry, starting with the current URL"],
-  "vomnibar.activateTabSelection": ["Search through your open tabs"],
-
-  nextFrame: ["Cycle forward to the next frame on the page", { background: true, passCountToFunction: true }]
-};
-
-for (var command in commandDescriptions)
-  addCommand(command, commandDescriptions[command][0], commandDescriptions[command][1]);
-
-
-// An ordered listing of all available commands, grouped by type. This is the order they will
-// be shown in the help page.
-var commandGroups = {
-  pageNavigation:
-    ["scrollDown", "scrollUp", "scrollLeft", "scrollRight",
-     "scrollToTop", "scrollToBottom", "scrollToLeft", "scrollToRight", "scrollPageDown",
-     "scrollPageUp", "scrollFullPageUp", "scrollFullPageDown",
-     "reload", "toggleViewSource", "copyCurrentUrl", "linkHints.activateModeToCopyLinkUrl",
-     "openCopiedUrlInCurrentTab", "openCopiedUrlInNewTab", "goUp",
-     "enterInsertMode", "focusInput",
-     "linkHints.activateMode", "linkHints.activateModeToOpenInNewTab", "linkHints.activateModeWithQueue",
-     "vomnibar.activate", "vomnibar.activateWithCurrentUrl", "vomnibar.activateTabSelection",
-     "goPrevious", "goNext", "nextFrame"],
-  findCommands: ["enterFindMode", "performFind", "performBackwardsFind"],
-  historyNavigation:
-    ["goBack", "goForward"],
-  tabManipulation:
-    ["nextTab", "previousTab", "firstTab", "lastTab", "createTab", "removeTab", "restoreTab"],
-  misc:
-    ["showHelp"]
-};
-
-// Rarely used commands are not shown by default in the help dialog or in the README. The goal is to present
-// a focused, high-signal set of commands to the new and casual user. Only those truly hungry for more power
-// from Vimium will uncover these gems.
-var advancedCommands = [
-    "scrollToLeft", "scrollToRight",
-    "goUp", "focusInput", "linkHints.activateModeWithQueue",
-    "goPrevious", "goNext"];
diff --git a/content_scripts/link_hints.js b/content_scripts/link_hints.js
new file mode 100644
index 00000000..7d6b431f
--- /dev/null
+++ b/content_scripts/link_hints.js
@@ -0,0 +1,552 @@
+/*
+ * This implements link hinting. Typing "F" will enter link-hinting mode, where all clickable items on the
+ * page have a hint marker displayed containing a sequence of letters. Typing those letters will select a link.
+ *
+ * In our 'default' mode, the characters we use to show link hints are a user-configurable option. By default
+ * they're the home row.  The CSS which is used on the link hints is also a configurable option.
+ *
+ * In 'filter' mode, our link hints are numbers, and the user can narrow down the range of possibilities by
+ * typing the text of the link itself.
+ */
+var linkHints = {
+  hintMarkers: [],
+  hintMarkerContainingDiv: null,
+  shouldOpenInNewTab: false,
+  shouldOpenWithQueue: false,
+  // function that does the appropriate action on the selected link
+  linkActivator: undefined,
+  // While in delayMode, all keypresses have no effect.
+  delayMode: false,
+  // Handle the link hinting marker generation and matching. Must be initialized after settings have been
+  // loaded, so that we can retrieve the option setting.
+  markerMatcher: undefined,
+
+  /*
+   * To be called after linkHints has been generated from linkHintsBase.
+   */
+  init: function() {
+    this.onKeyDownInMode = this.onKeyDownInMode.bind(this);
+    this.markerMatcher = settings.get('filterLinkHints') ? filterHints : alphabetHints;
+  },
+
+  /*
+   * Generate an XPath describing what a clickable element is.
+   * The final expression will be something like "//button | //xhtml:button | ..."
+   * We use translate() instead of lower-case() because Chrome only supports XPath 1.0.
+   */
+  clickableElementsXPath: domUtils.makeXPath(["a", "area[@href]", "textarea", "button", "select",
+                             "input[not(@type='hidden' or @disabled or @readonly)]",
+                             "*[@onclick or @tabindex or @role='link' or @role='button' or contains(@class, 'button') or " +
+                             "@contenteditable='' or translate(@contenteditable, 'TRUE', 'true')='true']"]),
+
+  // We need this as a top-level function because our command system doesn't yet support arguments.
+  activateModeToOpenInNewTab: function() { this.activateMode(true, false, false); },
+
+  activateModeToCopyLinkUrl: function() { this.activateMode(null, false, true); },
+
+  activateModeWithQueue: function() { this.activateMode(true, true, false); },
+
+  activateMode: function(openInNewTab, withQueue, copyLinkUrl) {
+    if (!document.getElementById('vimiumLinkHintCss'))
+      // linkHintCss is declared by vimiumFrontend.js and contains the user supplied css overrides.
+      addCssToPage(linkHintCss, 'vimiumLinkHintCss');
+    this.setOpenLinkMode(openInNewTab, withQueue, copyLinkUrl);
+    this.buildLinkHints();
+    handlerStack.push({ // handlerStack is declared by vimiumFrontend.js
+      keydown: this.onKeyDownInMode,
+      // trap all key events
+      keypress: function() { return false; },
+      keyup: function() { return false; }
+    });
+  },
+
+  setOpenLinkMode: function(openInNewTab, withQueue, copyLinkUrl) {
+    this.shouldOpenInNewTab = openInNewTab;
+    this.shouldOpenWithQueue = withQueue;
+
+    if (openInNewTab || withQueue) {
+      if (openInNewTab)
+        HUD.show("Open link in new tab");
+      else if (withQueue)
+        HUD.show("Open multiple links in a new tab");
+      this.linkActivator = function(link) {
+        // When "clicking" on a link, dispatch the event with the appropriate meta key (CMD on Mac, CTRL on windows)
+        // to open it in a new tab if necessary.
+        domUtils.simulateClick(link, { metaKey: platform == "Mac", ctrlKey: platform != "Mac" });
+      }
+    } else if (copyLinkUrl) {
+      HUD.show("Copy link URL to Clipboard");
+      this.linkActivator = function(link) {
+        chrome.extension.sendRequest({handler: 'copyToClipboard', data: link.href});
+      }
+    } else {
+      HUD.show("Open link in current tab");
+      // When we're opening the link in the current tab, don't navigate to the selected link immediately;
+      // we want to give the user some time to notice which link has received focus.
+      this.linkActivator = function(link) {
+        setTimeout(domUtils.simulateClick.bind(domUtils, link), 400);
+      }
+    }
+  },
+
+  /*
+   * Builds and displays link hints for every visible clickable item on the page.
+   */
+  buildLinkHints: function() {
+    var visibleElements = this.getVisibleClickableElements();
+    this.hintMarkers = this.markerMatcher.getHintMarkers(visibleElements);
+
+    // Note(philc): Append these markers as top level children instead of as child nodes to the link itself,
+    // because some clickable elements cannot contain children, e.g. submit buttons. This has the caveat
+    // that if you scroll the page and the link has position=fixed, the marker will not stay fixed.
+    // Also note that adding these nodes to document.body all at once is significantly faster than one-by-one.
+    this.hintMarkerContainingDiv = document.createElement("div");
+    this.hintMarkerContainingDiv.id = "vimiumHintMarkerContainer";
+    this.hintMarkerContainingDiv.className = "vimiumReset";
+    for (var i = 0; i < this.hintMarkers.length; i++)
+      this.hintMarkerContainingDiv.appendChild(this.hintMarkers[i]);
+
+    // sometimes this is triggered before documentElement is created
+    // TODO(int3): fail more gracefully?
+    if (document.documentElement)
+      document.documentElement.appendChild(this.hintMarkerContainingDiv);
+    else
+      this.deactivateMode();
+  },
+
+  /*
+   * Returns all clickable elements that are not hidden and are in the current viewport.
+   * We prune invisible elements partly for performance reasons, but moreso it's to decrease the number
+   * of digits needed to enumerate all of the links on screen.
+   */
+  getVisibleClickableElements: function() {
+    var resultSet = domUtils.evaluateXPath(this.clickableElementsXPath, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE);
+
+    var visibleElements = [];
+
+    // Find all visible clickable elements.
+    for (var i = 0, count = resultSet.snapshotLength; i < count; i++) {
+      var element = resultSet.snapshotItem(i);
+      var clientRect = domUtils.getVisibleClientRect(element, clientRect);
+      if (clientRect !== null)
+        visibleElements.push({element: element, rect: clientRect});
+
+      if (element.localName === "area") {
+        var map = element.parentElement;
+        if (!map) continue;
+        var img = document.querySelector("img[usemap='#" + map.getAttribute("name") + "']");
+        if (!img) continue;
+        var imgClientRects = img.getClientRects();
+        if (imgClientRects.length == 0) continue;
+        var c = element.coords.split(/,/);
+        var coords = [parseInt(c[0], 10), parseInt(c[1], 10), parseInt(c[2], 10), parseInt(c[3], 10)];
+        var rect = {
+          top: imgClientRects[0].top + coords[1],
+          left: imgClientRects[0].left + coords[0],
+          right: imgClientRects[0].left + coords[2],
+          bottom: imgClientRects[0].top + coords[3],
+          width: coords[2] - coords[0],
+          height: coords[3] - coords[1]
+        };
+
+        visibleElements.push({element: element, rect: rect});
+      }
+    }
+    return visibleElements;
+  },
+
+  /*
+   * Handles shift and esc keys. The other keys are passed to markerMatcher.matchHintsByKey.
+   */
+  onKeyDownInMode: function(event) {
+    if (this.delayMode)
+      return;
+
+    if (event.keyCode == keyCodes.shiftKey && this.shouldOpenInNewTab !== null) {
+      // Toggle whether to open link in a new or current tab.
+      this.setOpenLinkMode(!this.shouldOpenInNewTab, this.shouldOpenWithQueue, false);
+      handlerStack.push({
+        keyup: function(event) {
+          if (event.keyCode !== keyCodes.shiftKey) return;
+          linkHints.setOpenLinkMode(!linkHints.shouldOpenInNewTab, linkHints.shouldOpenWithQueue, false);
+          handlerStack.pop();
+        }
+      });
+    }
+
+    // TODO(philc): Ignore keys that have modifiers.
+    if (isEscape(event)) {
+      this.deactivateMode();
+    } else {
+      var keyResult = this.markerMatcher.matchHintsByKey(event, this.hintMarkers);
+      var linksMatched = keyResult.linksMatched;
+      var delay = keyResult.delay !== undefined ? keyResult.delay : 0;
+      if (linksMatched.length == 0) {
+        this.deactivateMode();
+      } else if (linksMatched.length == 1) {
+        this.activateLink(linksMatched[0], delay);
+      } else {
+        for (var i in this.hintMarkers)
+          this.hideMarker(this.hintMarkers[i]);
+        for (var i in linksMatched)
+          this.showMarker(linksMatched[i], this.markerMatcher.hintKeystrokeQueue.length);
+      }
+    }
+  },
+
+  /*
+   * When only one link hint remains, this function activates it in the appropriate way.
+   */
+  activateLink: function(matchedLink, delay) {
+    this.delayMode = true;
+    var clickEl = matchedLink.clickableItem;
+    if (domUtils.isSelectable(clickEl)) {
+      domUtils.simulateSelect(clickEl);
+      this.deactivateMode(delay, function() { linkHints.delayMode = false; });
+    } else {
+      // TODO figure out which other input elements should not receive focus
+      if (clickEl.nodeName.toLowerCase() === 'input' && clickEl.type !== 'button')
+        clickEl.focus();
+      domUtils.flashRect(matchedLink.rect);
+      this.linkActivator(clickEl);
+      if (this.shouldOpenWithQueue) {
+        this.deactivateMode(delay, function() {
+          linkHints.delayMode = false;
+          linkHints.activateModeWithQueue();
+        });
+      } else {
+        this.deactivateMode(delay, function() { linkHints.delayMode = false; });
+      }
+    }
+  },
+
+  /*
+   * Shows the marker, highlighting matchingCharCount characters.
+   */
+  showMarker: function(linkMarker, matchingCharCount) {
+    linkMarker.style.display = "";
+    for (var j = 0, count = linkMarker.childNodes.length; j < count; j++)
+      (j < matchingCharCount) ? linkMarker.childNodes[j].classList.add("matchingCharacter") :
+                                linkMarker.childNodes[j].classList.remove("matchingCharacter");
+  },
+
+  hideMarker: function(linkMarker) {
+    linkMarker.style.display = "none";
+  },
+
+  /*
+   * If called without arguments, it executes immediately.  Othewise, it
+   * executes after 'delay' and invokes 'callback' when it is finished.
+   */
+  deactivateMode: function(delay, callback) {
+    function deactivate() {
+      if (linkHints.markerMatcher.deactivate)
+        linkHints.markerMatcher.deactivate();
+      if (linkHints.hintMarkerContainingDiv)
+        linkHints.hintMarkerContainingDiv.parentNode.removeChild(linkHints.hintMarkerContainingDiv);
+      linkHints.hintMarkerContainingDiv = null;
+      linkHints.hintMarkers = [];
+      handlerStack.pop();
+      HUD.hide();
+    }
+    // we invoke the deactivate() function directly instead of using setTimeout(callback, 0) so that
+    // deactivateMode can be tested synchronously
+    if (!delay) {
+      deactivate();
+      if (callback) callback();
+    } else {
+      setTimeout(function() { deactivate(); if (callback) callback(); }, delay);
+    }
+  },
+
+};
+
+var alphabetHints = {
+  hintKeystrokeQueue: [],
+  logXOfBase: function(x, base) { return Math.log(x) / Math.log(base); },
+
+  getHintMarkers: function(visibleElements) {
+    var hintStrings = this.hintStrings(visibleElements.length);
+    var hintMarkers = [];
+    for (var i = 0, count = visibleElements.length; i < count; i++) {
+      var marker = hintUtils.createMarkerFor(visibleElements[i]);
+      marker.hintString = hintStrings[i];
+      marker.innerHTML = hintUtils.spanWrap(marker.hintString.toUpperCase());
+      hintMarkers.push(marker);
+    }
+
+    return hintMarkers;
+  },
+
+  /*
+   * Returns a list of hint strings which will uniquely identify the given number of links. The hint strings
+   * may be of different lengths.
+   */
+  hintStrings: function(linkCount) {
+    var linkHintCharacters = settings.get("linkHintCharacters");
+    // Determine how many digits the link hints will require in the worst case. Usually we do not need
+    // all of these digits for every link single hint, so we can show shorter hints for a few of the links.
+    var digitsNeeded = Math.ceil(this.logXOfBase(linkCount, linkHintCharacters.length));
+    // Short hints are the number of hints we can possibly show which are (digitsNeeded - 1) digits in length.
+    var shortHintCount = Math.floor(
+        (Math.pow(linkHintCharacters.length, digitsNeeded) - linkCount) /
+        linkHintCharacters.length);
+    var longHintCount = linkCount - shortHintCount;
+
+    var hintStrings = [];
+
+    if (digitsNeeded > 1)
+      for (var i = 0; i < shortHintCount; i++)
+        hintStrings.push(this.numberToHintString(i, digitsNeeded - 1, linkHintCharacters));
+
+    var start = shortHintCount * linkHintCharacters.length;
+    for (var i = start; i < start + longHintCount; i++)
+      hintStrings.push(this.numberToHintString(i, digitsNeeded, linkHintCharacters));
+
+    return this.shuffleHints(hintStrings, linkHintCharacters.length);
+  },
+
+  /*
+   * This shuffles the given set of hints so that they're scattered -- hints starting with the same character
+   * will be spread evenly throughout the array.
+   */
+  shuffleHints: function(hints, characterSetLength) {
+    var buckets = [], i = 0;
+    for (i = 0; i < characterSetLength; i++)
+      buckets[i] = []
+    for (i = 0; i < hints.length; i++)
+      buckets[i % buckets.length].push(hints[i]);
+    var result = [];
+    for (i = 0; i < buckets.length; i++)
+      result = result.concat(buckets[i]);
+    return result;
+  },
+
+  /*
+   * Converts a number like "8" into a hint string like "JK". This is used to sequentially generate all of
+   * the hint text. The hint string will be "padded with zeroes" to ensure its length is equal to numHintDigits.
+   */
+  numberToHintString: function(number, numHintDigits, characterSet) {
+    var base = characterSet.length;
+    var hintString = [];
+    var remainder = 0;
+    do {
+      remainder = number % base;
+      hintString.unshift(characterSet[remainder]);
+      number -= remainder;
+      number /= Math.floor(base);
+    } while (number > 0);
+
+    // Pad the hint string we're returning so that it matches numHintDigits.
+    // Note: the loop body changes hintString.length, so the original length must be cached!
+    var hintStringLength = hintString.length;
+    for (var i = 0; i < numHintDigits - hintStringLength; i++)
+      hintString.unshift(characterSet[0]);
+
+    return hintString.join("");
+  },
+
+  matchHintsByKey: function(event, hintMarkers) {
+    var keyChar = getKeyChar(event);
+
+    if (event.keyCode == keyCodes.backspace || event.keyCode == keyCodes.deleteKey) {
+      if (!this.hintKeystrokeQueue.pop())
+        return { linksMatched: [] };
+    } else if (keyChar && settings.get('linkHintCharacters').indexOf(keyChar) >= 0) {
+      this.hintKeystrokeQueue.push(keyChar);
+    }
+
+    var matchString = this.hintKeystrokeQueue.join("");
+    var linksMatched = hintMarkers.filter(function(linkMarker) {
+      return linkMarker.hintString.indexOf(matchString) == 0;
+    });
+    return { linksMatched: linksMatched };
+  },
+
+  deactivate: function() {
+    this.hintKeystrokeQueue = [];
+  }
+
+};
+
+var filterHints = {
+  hintKeystrokeQueue: [],
+  linkTextKeystrokeQueue: [],
+  labelMap: {},
+
+  /*
+   * Generate a map of input element => label
+   */
+  generateLabelMap: function() {
+    var labels = document.querySelectorAll("label");
+    for (var i = 0, count = labels.length; i < count; i++) {
+      var forElement = labels[i].getAttribute("for");
+      if (forElement) {
+        var labelText = labels[i].textContent.trim();
+        // remove trailing : commonly found in labels
+        if (labelText[labelText.length-1] == ":")
+          labelText = labelText.substr(0, labelText.length-1);
+        this.labelMap[forElement] = labelText;
+      }
+    }
+  },
+
+  generateHintString: function(linkHintNumber) {
+    return (linkHintNumber + 1).toString();
+  },
+
+  generateLinkText: function(element) {
+    var linkText = "";
+    var showLinkText = false;
+    // toLowerCase is necessary as html documents return 'IMG'
+    // and xhtml documents return 'img'
+    var nodeName = element.nodeName.toLowerCase();
+
+    if (nodeName == "input") {
+      if (this.labelMap[element.id]) {
+        linkText = this.labelMap[element.id];
+        showLinkText = true;
+      } else if (element.type != "password") {
+        linkText = element.value;
+      }
+      // check if there is an image embedded in the <a> tag
+    } else if (nodeName == "a" && !element.textContent.trim()
+        && element.firstElementChild
+        && element.firstElementChild.nodeName.toLowerCase() == "img") {
+      linkText = element.firstElementChild.alt || element.firstElementChild.title;
+      if (linkText)
+        showLinkText = true;
+    } else {
+      linkText = element.textContent || element.innerHTML;
+    }
+    return { text: linkText, show: showLinkText };
+  },
+
+  renderMarker: function(marker) {
+    marker.innerHTML = hintUtils.spanWrap(marker.hintString +
+                                          (marker.showLinkText ? ": " + marker.linkText : ""));
+  },
+
+  getHintMarkers: function(visibleElements) {
+    this.generateLabelMap();
+    var hintMarkers = [];
+    for (var i = 0, count = visibleElements.length; i < count; i++) {
+      var marker = hintUtils.createMarkerFor(visibleElements[i]);
+      marker.hintString = this.generateHintString(i);
+      var linkTextObject = this.generateLinkText(marker.clickableItem);
+      marker.linkText = linkTextObject.text;
+      marker.showLinkText = linkTextObject.show;
+      this.renderMarker(marker);
+      hintMarkers.push(marker);
+    }
+    return hintMarkers;
+  },
+
+  matchHintsByKey: function(event, hintMarkers) {
+    var keyChar = getKeyChar(event);
+    var delay = 0;
+    var userIsTypingLinkText = false;
+
+    if (event.keyCode == keyCodes.enter) {
+      // activate the lowest-numbered link hint that is visible
+      for (var i = 0, count = hintMarkers.length; i < count; i++)
+        if (hintMarkers[i].style.display  != 'none') {
+          return { linksMatched: [ hintMarkers[i] ] };
+        }
+    } else if (event.keyCode == keyCodes.backspace || event.keyCode == keyCodes.deleteKey) {
+      // backspace clears hint key queue first, then acts on link text key queue.
+      // if both queues are empty. exit hinting mode
+      if (!this.hintKeystrokeQueue.pop() && !this.linkTextKeystrokeQueue.pop())
+          return { linksMatched: [] };
+    } else if (keyChar) {
+      if (/[0-9]/.test(keyChar))
+        this.hintKeystrokeQueue.push(keyChar);
+      else {
+        // since we might renumber the hints, the current hintKeyStrokeQueue
+        // should be rendered invalid (i.e. reset).
+        this.hintKeystrokeQueue = [];
+        this.linkTextKeystrokeQueue.push(keyChar);
+        userIsTypingLinkText = true;
+      }
+    }
+
+    // at this point, linkTextKeystrokeQueue and hintKeystrokeQueue have been updated to reflect the latest
+    // input. use them to filter the link hints accordingly.
+    var linksMatched = this.filterLinkHints(hintMarkers);
+    var matchString = this.hintKeystrokeQueue.join("");
+    linksMatched = linksMatched.filter(function(linkMarker) {
+      return !linkMarker.filtered && linkMarker.hintString.indexOf(matchString) == 0;
+    });
+
+    if (linksMatched.length == 1 && userIsTypingLinkText) {
+      // In filter mode, people tend to type out words past the point
+      // needed for a unique match. Hence we should avoid passing
+      // control back to command mode immediately after a match is found.
+      var delay = 200;
+    }
+
+    return { linksMatched: linksMatched, delay: delay };
+  },
+
+  /*
+   * Marks the links that do not match the linkText search string with the 'filtered' DOM property. Renumbers
+   * the remainder if necessary.
+   */
+  filterLinkHints: function(hintMarkers) {
+    var linksMatched = [];
+    var linkSearchString = this.linkTextKeystrokeQueue.join("");
+
+    for (var i = 0; i < hintMarkers.length; i++) {
+      var linkMarker = hintMarkers[i];
+      var matchedLink = linkMarker.linkText.toLowerCase().indexOf(linkSearchString.toLowerCase()) >= 0;
+
+      if (!matchedLink) {
+        linkMarker.filtered = true;
+      } else {
+        linkMarker.filtered = false;
+        var oldHintString = linkMarker.hintString;
+        linkMarker.hintString = this.generateHintString(linksMatched.length);
+        if (linkMarker.hintString != oldHintString)
+          this.renderMarker(linkMarker);
+        linksMatched.push(linkMarker);
+      }
+    }
+    return linksMatched;
+  },
+
+  deactivate: function(delay, callback) {
+    this.hintKeystrokeQueue = [];
+    this.linkTextKeystrokeQueue = [];
+    this.labelMap = {};
+  }
+
+};
+
+var hintUtils = {
+  /*
+   * Make each hint character a span, so that we can highlight the typed characters as you type them.
+   */
+  spanWrap: function(hintString) {
+    var innerHTML = [];
+    for (var i = 0; i < hintString.length; i++)
+      innerHTML.push("<span class='vimiumReset'>" + hintString[i] + "</span>");
+    return innerHTML.join("");
+  },
+
+  /*
+   * Creates a link marker for the given link.
+   */
+  createMarkerFor: function(link) {
+    var marker = document.createElement("div");
+    marker.className = "vimiumReset internalVimiumHintMarker vimiumHintMarker";
+    marker.clickableItem = link.element;
+
+    var clientRect = link.rect;
+    marker.style.left = clientRect.left + window.scrollX + "px";
+    marker.style.top = clientRect.top  + window.scrollY  + "px";
+
+    marker.rect = link.rect;
+
+    return marker;
+  }
+};
diff --git a/content_scripts/vimium_frontend.js b/content_scripts/vimium_frontend.js
new file mode 100644
index 00000000..31bb2b44
--- /dev/null
+++ b/content_scripts/vimium_frontend.js
@@ -0,0 +1,1182 @@
+/*
+ * This content script takes input from its webpage and executes commands locally on behalf of the background
+ * page. It must be run prior to domReady so that we perform some operations very early. We tell the
+ * background page that we're in domReady and ready to accept normal commands by connectiong to a port named
+ * "domReady".
+ */
+var getCurrentUrlHandlers = []; // function(url)
+
+var insertModeLock = null;
+var findMode = false;
+var findModeQuery = { rawQuery: "" };
+var findModeQueryHasResults = false;
+var findModeAnchorNode = null;
+var isShowingHelpDialog = false;
+var handlerStack = [];
+var keyPort;
+// Users can disable Vimium on URL patterns via the settings page.
+var isEnabledForUrl = true;
+// The user's operating system.
+var currentCompletionKeys;
+var validFirstKeys;
+var linkHintCss;
+var activatedElement;
+
+// The types in <input type="..."> that we consider for focusInput command. Right now this is recalculated in
+// each content script. Alternatively we could calculate it once in the background page and use a request to
+// fetch it each time.
+//
+// Should we include the HTML5 date pickers here?
+
+// The corresponding XPath for such elements.
+var textInputXPath = (function() {
+  var textInputTypes = ["text", "search", "email", "url", "number", "password"];
+  var inputElements = ["input[" +
+    "(" + textInputTypes.map(function(type) {return '@type="' + type + '"'}).join(" or ") + "or not(@type))" +
+    " and not(@disabled or @readonly)]",
+    "textarea", "*[@contenteditable='' or translate(@contenteditable, 'TRUE', 'true')='true']"];
+  return domUtils.makeXPath(inputElements);
+})();
+
+/**
+ * settings provides a browser-global localStorage-backed dict. get() and set() are synchronous, but load()
+ * must be called beforehand to ensure get() will return up-to-date values.
+ */
+var settings = {
+  port: null,
+  values: {},
+  loadedValues: 0,
+  valuesToLoad: ["scrollStepSize", "linkHintCharacters", "filterLinkHints", "hideHud", "previousPatterns",
+      "nextPatterns", "findModeRawQuery"],
+  isLoaded: false,
+  eventListeners: {},
+
+  init: function () {
+    this.port = chrome.extension.connect({ name: "settings" });
+    this.port.onMessage.addListener(this.receiveMessage);
+  },
+
+  get: function (key) { return this.values[key]; },
+
+  set: function (key, value) {
+    if (!this.port)
+      this.init();
+
+    this.values[key] = value;
+    this.port.postMessage({ operation: "set", key: key, value: value });
+  },
+
+  load: function() {
+    if (!this.port)
+      this.init();
+
+    for (var i in this.valuesToLoad) {
+      this.port.postMessage({ operation: "get", key: this.valuesToLoad[i] });
+    }
+  },
+
+  receiveMessage: function (args) {
+    // not using 'this' due to issues with binding on callback
+    settings.values[args.key] = args.value;
+    // since load() can be called more than once, loadedValues can be greater than valuesToLoad, but we test
+    // for equality so initializeOnReady only runs once
+    if (++settings.loadedValues == settings.valuesToLoad.length) {
+      settings.isLoaded = true;
+      var listener;
+      while (listener = settings.eventListeners["load"].pop())
+        listener();
+    }
+  },
+
+  addEventListener: function(eventName, callback) {
+    if (!(eventName in this.eventListeners))
+      this.eventListeners[eventName] = [];
+    this.eventListeners[eventName].push(callback);
+  },
+
+};
+
+/*
+ * Give this frame a unique id.
+ */
+frameId = Math.floor(Math.random()*999999999)
+
+var hasModifiersRegex = /^<([amc]-)+.>/;
+
+/*
+ * Complete initialization work that sould be done prior to DOMReady.
+ */
+function initializePreDomReady() {
+  settings.addEventListener("load", linkHints.init.bind(linkHints));
+  settings.load();
+
+  checkIfEnabledForUrl();
+
+  chrome.extension.sendRequest({handler: "getLinkHintCss"}, function (response) {
+    linkHintCss = response.linkHintCss;
+  });
+
+  refreshCompletionKeys();
+
+  // Send the key to the key handler in the background page.
+  keyPort = chrome.extension.connect({ name: "keyDown" });
+
+  chrome.extension.onRequest.addListener(function(request, sender, sendResponse) {
+    if (request.name == "hideUpgradeNotification") {
+      HUD.hideUpgradeNotification();
+    } else if (request.name == "showUpgradeNotification" && isEnabledForUrl) {
+      HUD.showUpgradeNotification(request.version);
+    } else if (request.name == "showHelpDialog") {
+      if (isShowingHelpDialog)
+        hideHelpDialog();
+      else
+        showHelpDialog(request.dialogHtml, request.frameId);
+    } else if (request.name == "focusFrame") {
+      if (frameId == request.frameId)
+        focusThisFrame(request.highlight);
+    } else if (request.name == "refreshCompletionKeys") {
+      refreshCompletionKeys(request);
+    }
+    sendResponse({}); // Free up the resources used by this open connection.
+  });
+
+  chrome.extension.onConnect.addListener(function(port, name) {
+    if (port.name == "executePageCommand") {
+      port.onMessage.addListener(function(args) {
+        if (frameId == args.frameId) {
+          if (args.passCountToFunction) {
+            utils.invokeCommandString(args.command, [args.count]);
+          } else {
+            for (var i = 0; i < args.count; i++) { utils.invokeCommandString(args.command); }
+          }
+        }
+
+        refreshCompletionKeys(args);
+      });
+    }
+    else if (port.name == "getScrollPosition") {
+      port.onMessage.addListener(function(args) {
+        var scrollPort = chrome.extension.connect({ name: "returnScrollPosition" });
+        scrollPort.postMessage({
+          scrollX: window.scrollX,
+          scrollY: window.scrollY,
+          currentTab: args.currentTab
+        });
+      });
+    } else if (port.name == "setScrollPosition") {
+      port.onMessage.addListener(function(args) {
+        if (args.scrollX > 0 || args.scrollY > 0) {
+          domUtils.documentReady(function() { window.scrollBy(args.scrollX, args.scrollY); });
+        }
+      });
+    } else if (port.name == "returnCurrentTabUrl") {
+      port.onMessage.addListener(function(args) {
+        if (getCurrentUrlHandlers.length > 0) { getCurrentUrlHandlers.pop()(args.url); }
+      });
+    } else if (port.name == "refreshCompletionKeys") {
+      port.onMessage.addListener(function (args) {
+        refreshCompletionKeys(args.completionKeys);
+      });
+    } else if (port.name == "getActiveState") {
+      port.onMessage.addListener(function(args) {
+        port.postMessage({ enabled: isEnabledForUrl });
+      });
+    } else if (port.name == "disableVimium") {
+      port.onMessage.addListener(function(args) { disableVimium(); });
+    }
+  });
+}
+
+/*
+ * This is called once the background page has told us that Vimium should be enabled for the current URL.
+ */
+function initializeWhenEnabled() {
+  document.addEventListener("keydown", onKeydown, true);
+  document.addEventListener("keypress", onKeypress, true);
+  document.addEventListener("keyup", onKeyup, true);
+  document.addEventListener("focus", onFocusCapturePhase, true);
+  document.addEventListener("blur", onBlurCapturePhase, true);
+  document.addEventListener("DOMActivate", onDOMActivate, true);
+  enterInsertModeIfElementIsFocused();
+}
+
+/*
+ * Used to disable Vimium without needing to reload the page.
+ * This is called if the current page's url is blacklisted using the popup UI.
+ */
+function disableVimium() {
+  document.removeEventListener("keydown", onKeydown, true);
+  document.removeEventListener("keypress", onKeypress, true);
+  document.removeEventListener("keyup", onKeyup, true);
+  document.removeEventListener("focus", onFocusCapturePhase, true);
+  document.removeEventListener("blur", onBlurCapturePhase, true);
+  document.removeEventListener("DOMActivate", onDOMActivate, true);
+  isEnabledForUrl = false;
+}
+
+/*
+ * The backend needs to know which frame has focus.
+ */
+window.addEventListener("focus", function(e) {
+  // settings may have changed since the frame last had focus
+  settings.load();
+  chrome.extension.sendRequest({ handler: "frameFocused", frameId: frameId });
+});
+
+/*
+ * Called from the backend in order to change frame focus.
+ */
+function focusThisFrame(shouldHighlight) {
+  window.focus();
+  if (document.body && shouldHighlight) {
+    var borderWas = document.body.style.border;
+    document.body.style.border = '5px solid yellow';
+    setTimeout(function(){document.body.style.border = borderWas}, 200);
+  }
+}
+
+/*
+ * Initialization tasks that must wait for the document to be ready.
+ */
+function initializeOnDomReady() {
+  registerFrameIfSizeAvailable(window.top == window.self);
+
+  if (isEnabledForUrl)
+    enterInsertModeIfElementIsFocused();
+
+  // Tell the background page we're in the dom ready state.
+  chrome.extension.connect({ name: "domReady" });
+};
+
+// This is a little hacky but sometimes the size wasn't available on domReady?
+function registerFrameIfSizeAvailable (is_top) {
+  if (innerWidth != undefined && innerWidth != 0 && innerHeight != undefined && innerHeight != 0)
+    chrome.extension.sendRequest({ handler: "registerFrame", frameId: frameId,
+        area: innerWidth * innerHeight, is_top: is_top, total: frames.length + 1 });
+  else
+    setTimeout(function () { registerFrameIfSizeAvailable(is_top); }, 100);
+}
+
+/*
+ * Enters insert mode if the currently focused element in the DOM is focusable.
+ */
+function enterInsertModeIfElementIsFocused() {
+  if (document.activeElement && isEditable(document.activeElement) && !findMode)
+    enterInsertModeWithoutShowingIndicator(document.activeElement);
+}
+
+function onDOMActivate(event) {
+  activatedElement = event.target;
+}
+
+/**
+ * activatedElement is different from document.activeElement -- the latter seems to be reserved mostly for
+ * input elements. This mechanism allows us to decide whether to scroll a div or to scroll the whole document.
+ */
+function scrollActivatedElementBy(direction, amount) {
+  // if this is called before domReady, just use the window scroll function
+  if (!document.body) {
+    if (direction === "x")
+      window.scrollBy(amount, 0);
+    else // "y"
+      window.scrollBy(0, amount);
+    return;
+  }
+
+  // TODO refactor and put this together with the code in getVisibleClientRect
+  function isRendered(element) {
+    var computedStyle = window.getComputedStyle(element, null);
+    return !(computedStyle.getPropertyValue('visibility') != 'visible' ||
+        computedStyle.getPropertyValue('display') == 'none');
+  }
+
+  if (!activatedElement || !isRendered(activatedElement))
+    activatedElement = document.body;
+
+  scrollName = direction === "x" ? "scrollLeft" : "scrollTop";
+
+  // Chrome does not report scrollHeight accurately for nodes with pseudo-elements of height 0 (bug 110149).
+  // Therefore we just try to increase scrollTop blindly -- if it fails we know we have reached the end of the
+  // content.
+  if (amount !== 0) {
+    var element = activatedElement;
+    do {
+      var oldScrollValue = element[scrollName];
+      element[scrollName] += amount;
+      var lastElement = element;
+      // we may have an orphaned element. if so, just scroll the body element.
+      element = element.parentElement || document.body;
+    } while(lastElement[scrollName] == oldScrollValue && lastElement != document.body);
+  }
+
+  // if the activated element has been scrolled completely offscreen, subsequent changes in its scroll
+  // position will not provide any more visual feedback to the user. therefore we deactivate it so that
+  // subsequent scrolls only move the parent element.
+  var rect = activatedElement.getBoundingClientRect();
+  if (rect.bottom < 0 || rect.top > window.innerHeight ||
+      rect.right < 0 || rect.left > window.innerWidth)
+    activatedElement = lastElement;
+}
+
+function scrollToBottom() { window.scrollTo(window.pageXOffset, document.body.scrollHeight); }
+function scrollToTop() { window.scrollTo(window.pageXOffset, 0); }
+function scrollToLeft() { window.scrollTo(0, window.pageYOffset); }
+function scrollToRight() { window.scrollTo(document.body.scrollWidth, window.pageYOffset); }
+function scrollUp() { scrollActivatedElementBy("y", -1 * settings.get("scrollStepSize")); }
+function scrollDown() { scrollActivatedElementBy("y", parseFloat(settings.get("scrollStepSize"))); }
+function scrollPageUp() { scrollActivatedElementBy("y", -1 * window.innerHeight / 2); }
+function scrollPageDown() { scrollActivatedElementBy("y", window.innerHeight / 2); }
+function scrollFullPageUp() { scrollActivatedElementBy("y", -window.innerHeight); }
+function scrollFullPageDown() { scrollActivatedElementBy("y", window.innerHeight); }
+function scrollLeft() { scrollActivatedElementBy("x", -1 * settings.get("scrollStepSize")); }
+function scrollRight() { scrollActivatedElementBy("x", parseFloat(settings.get("scrollStepSize"))); }
+
+function focusInput(count) {
+  var results = domUtils.evaluateXPath(textInputXPath, XPathResult.ORDERED_NODE_ITERATOR_TYPE);
+
+  var lastInputBox;
+  var i = 0;
+
+  while (i < count) {
+    var currentInputBox = results.iterateNext();
+    if (!currentInputBox) { break; }
+
+    if (domUtils.getVisibleClientRect(currentInputBox) === null)
+        continue;
+
+    lastInputBox = currentInputBox;
+
+    i += 1;
+  }
+
+  if (lastInputBox) { lastInputBox.focus(); }
+}
+
+function reload() { window.location.reload(); }
+function goBack(count) { history.go(-count); }
+function goForward(count) { history.go(count); }
+
+function goUp(count) {
+  var url = window.location.href;
+  if (url[url.length-1] == '/')
+    url = url.substring(0, url.length - 1);
+
+  var urlsplit = url.split('/');
+  // make sure we haven't hit the base domain yet
+  if (urlsplit.length > 3) {
+    urlsplit = urlsplit.slice(0, Math.max(3, urlsplit.length - count));
+    window.location.href = urlsplit.join('/');
+  }
+}
+
+function toggleViewSource() {
+  getCurrentUrlHandlers.push(toggleViewSourceCallback);
+
+  var getCurrentUrlPort = chrome.extension.connect({ name: "getCurrentTabUrl" });
+  getCurrentUrlPort.postMessage({});
+}
+
+function copyCurrentUrl() {
+  // TODO(ilya): When the following bug is fixed, revisit this approach of sending back to the background page
+  // to copy.
+  // http://code.google.com/p/chromium/issues/detail?id=55188
+  //getCurrentUrlHandlers.push(function (url) { Clipboard.copy(url); });
+  getCurrentUrlHandlers.push(function (url) { chrome.extension.sendRequest({ handler: "copyToClipboard", data: url }); });
+
+  // TODO(ilya): Convert to sendRequest.
+  var getCurrentUrlPort = chrome.extension.connect({ name: "getCurrentTabUrl" });
+  getCurrentUrlPort.postMessage({});
+
+  HUD.showForDuration("Yanked URL", 1000);
+}
+
+function toggleViewSourceCallback(url) {
+  if (url.substr(0, 12) == "view-source:")
+  {
+    url = url.substr(12, url.length - 12);
+  }
+  else { url = "view-source:" + url; }
+  chrome.extension.sendRequest({handler: "openUrlInNewTab", url: url, selected: true});
+}
+
+/**
+ * Sends everything except i & ESC to the handler in background_page. i & ESC are special because they control
+ * insert mode which is local state to the page. The key will be are either a single ascii letter or a
+ * key-modifier pair, e.g. <c-a> for control a.
+ *
+ * Note that some keys will only register keydown events and not keystroke events, e.g. ESC.
+ */
+function onKeypress(event) {
+  if (!bubbleEvent('keypress', event))
+    return;
+
+  var keyChar = "";
+
+  // Ignore modifier keys by themselves.
+  if (event.keyCode > 31) {
+    keyChar = String.fromCharCode(event.charCode);
+
+    // Enter insert mode when the user enables the native find interface.
+    if (keyChar == "f" && isPrimaryModifierKey(event)) {
+      enterInsertModeWithoutShowingIndicator();
+      return;
+    }
+
+    if (keyChar) {
+      if (findMode) {
+        handleKeyCharForFindMode(keyChar);
+        suppressEvent(event);
+      } else if (!isInsertMode() && !findMode) {
+        if (currentCompletionKeys.indexOf(keyChar) != -1)
+          suppressEvent(event);
+
+        keyPort.postMessage({keyChar:keyChar, frameId:frameId});
+      }
+    }
+  }
+}
+
+/**
+ * Called whenever we receive a key event.  Each individual handler has the option to stop the event's
+ * propagation by returning a falsy value.
+ */
+function bubbleEvent(type, event) {
+  for (var i = handlerStack.length-1; i >= 0; i--) {
+    // We need to check for existence of handler because the last function call may have caused the release of
+    // more than one handler.
+    if (handlerStack[i] && handlerStack[i][type] && !handlerStack[i][type](event)) {
+      suppressEvent(event);
+      return false;
+    }
+  }
+  return true;
+}
+
+function suppressEvent(event) {
+  event.preventDefault();
+  event.stopPropagation();
+}
+
+function onKeydown(event) {
+  if (!bubbleEvent('keydown', event))
+    return;
+
+  var keyChar = "";
+
+  // handle special keys, and normal input keys with modifiers being pressed. don't handle shiftKey alone (to
+  // avoid / being interpreted as ?
+  if (((event.metaKey || event.ctrlKey || event.altKey) && event.keyCode > 31)
+      || event.keyIdentifier.slice(0, 2) != "U+") {
+    keyChar = getKeyChar(event);
+
+    if (keyChar != "") { // Again, ignore just modifiers. Maybe this should replace the keyCode>31 condition.
+      var modifiers = [];
+
+      if (event.shiftKey)
+          keyChar = keyChar.toUpperCase();
+      if (event.metaKey)
+          modifiers.push("m");
+      if (event.ctrlKey)
+          modifiers.push("c");
+      if (event.altKey)
+          modifiers.push("a");
+
+      for (var i in modifiers)
+          keyChar = modifiers[i] + "-" + keyChar;
+
+      if (modifiers.length > 0 || keyChar.length > 1)
+          keyChar = "<" + keyChar + ">";
+    }
+  }
+
+  if (isInsertMode() && isEscape(event)) {
+    // Note that we can't programmatically blur out of Flash embeds from Javascript.
+    if (!isEmbed(event.srcElement)) {
+      // Remove focus so the user can't just get himself back into insert mode by typing in the same input
+      // box.
+      if (isEditable(event.srcElement))
+        event.srcElement.blur();
+      exitInsertMode();
+      suppressEvent(event);
+    }
+  }
+  else if (findMode) {
+    if (isEscape(event)) {
+      handleEscapeForFindMode();
+      suppressEvent(event);
+    }
+    else if (event.keyCode == keyCodes.backspace || event.keyCode == keyCodes.deleteKey) {
+      handleDeleteForFindMode();
+      suppressEvent(event);
+    }
+    else if (event.keyCode == keyCodes.enter) {
+      handleEnterForFindMode();
+      suppressEvent(event);
+    }
+    else if (!modifiers) {
+      event.stopPropagation();
+    }
+  }
+  else if (isShowingHelpDialog && isEscape(event)) {
+    hideHelpDialog();
+  }
+  else if (!isInsertMode() && !findMode) {
+    if (keyChar) {
+      if (currentCompletionKeys.indexOf(keyChar) != -1)
+        suppressEvent(event);
+
+      keyPort.postMessage({keyChar:keyChar, frameId:frameId});
+    }
+    else if (isEscape(event)) {
+      keyPort.postMessage({keyChar:"<ESC>", frameId:frameId});
+    }
+  }
+
+  // Added to prevent propagating this event to other listeners if it's one that'll trigger a Vimium command.
+  // The goal is to avoid the scenario where Google Instant Search uses every keydown event to dump us
+  // back into the search box. As a side effect, this should also prevent overriding by other sites.
+  //
+  // Subject to internationalization issues since we're using keyIdentifier instead of charCode (in keypress).
+  //
+  // TOOD(ilya): Revisit this. Not sure it's the absolute best approach.
+  if (keyChar == "" && !isInsertMode() && (currentCompletionKeys.indexOf(getKeyChar(event)) != -1 ||
+      isValidFirstKey(getKeyChar(event))))
+    event.stopPropagation();
+}
+
+function onKeyup() {
+  if (!bubbleEvent('keyup', event))
+    return;
+}
+
+function checkIfEnabledForUrl() {
+  var url = window.location.toString();
+
+  chrome.extension.sendRequest({ handler: "isEnabledForUrl", url: url }, function (response) {
+    isEnabledForUrl = response.isEnabledForUrl;
+    if (isEnabledForUrl)
+      initializeWhenEnabled();
+    else if (HUD.isReady())
+      // Quickly hide any HUD we might already be showing, e.g. if we entered insert mode on page load.
+      HUD.hide();
+  });
+}
+
+function refreshCompletionKeys(response) {
+  if (response) {
+    currentCompletionKeys = response.completionKeys;
+
+    if (response.validFirstKeys)
+      validFirstKeys = response.validFirstKeys;
+  }
+  else {
+    chrome.extension.sendRequest({ handler: "getCompletionKeys" }, refreshCompletionKeys);
+  }
+}
+
+function isValidFirstKey(keyChar) {
+  return validFirstKeys[keyChar] || /[1-9]/.test(keyChar);
+}
+
+function onFocusCapturePhase(event) {
+  if (isFocusable(event.target) && !findMode)
+    enterInsertModeWithoutShowingIndicator(event.target);
+}
+
+function onBlurCapturePhase(event) {
+  if (isFocusable(event.target))
+    exitInsertMode(event.target);
+}
+
+/*
+ * Returns true if the element is focusable. This includes embeds like Flash, which steal the keybaord focus.
+ */
+function isFocusable(element) { return isEditable(element) || isEmbed(element); }
+
+/*
+ * Embedded elements like Flash and quicktime players can obtain focus but cannot be programmatically
+ * unfocused.
+ */
+function isEmbed(element) { return ["embed", "object"].indexOf(element.nodeName.toLowerCase()) > 0; }
+
+/*
+ * Input or text elements are considered focusable and able to receieve their own keyboard events,
+ * and will enter enter mode if focused. Also note that the "contentEditable" attribute can be set on
+ * any element which makes it a rich text editor, like the notes on jjot.com.
+ */
+function isEditable(target) {
+  if (target.isContentEditable)
+    return true;
+  var nodeName = target.nodeName.toLowerCase();
+  // use a blacklist instead of a whitelist because new form controls are still being implemented for html5
+  var noFocus = ["radio", "checkbox"];
+  if (nodeName == "input" && noFocus.indexOf(target.type) == -1)
+    return true;
+  var focusableElements = ["textarea", "select"];
+  return focusableElements.indexOf(nodeName) >= 0;
+}
+
+/*
+ * Enters insert mode and show an "Insert mode" message. Showing the UI is only useful when entering insert
+ * mode manually by pressing "i". In most cases we do not show any UI (enterInsertModeWithoutShowingIndicator)
+ */
+function enterInsertMode(target) {
+  enterInsertModeWithoutShowingIndicator(target);
+  HUD.show("Insert mode");
+}
+
+/*
+ * We cannot count on 'focus' and 'blur' events to happen sequentially. For example, if blurring element A
+ * causes element B to come into focus, we may get "B focus" before "A blur". Thus we only leave insert mode
+ * when the last editable element that came into focus -- which insertModeLock points to -- has been blurred.
+ * If insert mode is entered manually (via pressing 'i'), then we set insertModeLock to 'undefined', and only
+ * leave insert mode when the user presses <ESC>.
+ */
+function enterInsertModeWithoutShowingIndicator(target) { insertModeLock = target; }
+
+function exitInsertMode(target) {
+  if (target === undefined || insertModeLock === target) {
+    insertModeLock = null;
+    HUD.hide();
+  }
+}
+
+function isInsertMode() { return insertModeLock !== null; }
+
+// should be called whenever rawQuery is modified.
+function updateFindModeQuery() {
+  // the query can be treated differently (e.g. as a plain string versus regex depending on the presence of
+  // escape sequences. '\' is the escape character and needs to be escaped itself to be used as a normal
+  // character. here we grep for the relevant escape sequences.
+  findModeQuery.isRegex = false;
+  var hasNoIgnoreCaseFlag = false;
+  findModeQuery.parsedQuery = findModeQuery.rawQuery.replace(/\\./g, function(match) {
+    switch (match) {
+      case "\\r":
+        findModeQuery.isRegex = true;
+        return '';
+      case "\\I":
+        hasNoIgnoreCaseFlag = true;
+        return '';
+      case "\\\\":
+        return "\\";
+      default:
+        return match;
+    }
+  });
+
+  // default to 'smartcase' mode, unless noIgnoreCase is explicitly specified
+  findModeQuery.ignoreCase = !hasNoIgnoreCaseFlag && !/[A-Z]/.test(findModeQuery.parsedQuery);
+
+  // if we are dealing with a regex, grep for all matches in the text, and then call window.find() on them
+  // sequentially so the browser handles the scrolling / text selection.
+  if (findModeQuery.isRegex) {
+    try {
+      var pattern = new RegExp(findModeQuery.parsedQuery, "g" + (findModeQuery.ignoreCase ? "i" : ""));
+    }
+    catch (e) {
+      // if we catch a SyntaxError, assume the user is not done typing yet and return quietly
+      return;
+    }
+    // innerText will not return the text of hidden elements, and strip out tags while preserving newlines
+    var text = document.body.innerText;
+    findModeQuery.regexMatches = text.match(pattern);
+    findModeQuery.activeRegexIndex = 0;
+  }
+}
+
+function handleKeyCharForFindMode(keyChar) {
+  findModeQuery.rawQuery += keyChar;
+  updateFindModeQuery();
+  performFindInPlace();
+  showFindModeHUDForQuery();
+}
+
+function handleEscapeForFindMode() {
+  exitFindMode();
+  document.body.classList.remove("vimiumFindMode");
+  // removing the class does not re-color existing selections. we recreate the current selection so it reverts
+  // back to the default color.
+  var selection = window.getSelection();
+  if (!selection.isCollapsed) {
+    var range = window.getSelection().getRangeAt(0);
+    window.getSelection().removeAllRanges();
+    window.getSelection().addRange(range);
+  }
+  focusFoundLink() || selectFoundInputElement();
+}
+
+function handleDeleteForFindMode() {
+  if (findModeQuery.rawQuery.length == 0) {
+    exitFindMode();
+    performFindInPlace();
+  }
+  else {
+    findModeQuery.rawQuery = findModeQuery.rawQuery.substring(0, findModeQuery.rawQuery.length - 1);
+    updateFindModeQuery();
+    performFindInPlace();
+    showFindModeHUDForQuery();
+  }
+}
+
+// <esc> sends us into insert mode if possible, but <cr> does not.
+// <esc> corresponds approximately to 'nevermind, I have found it already' while <cr> means 'I want to save
+// this query and do more searches with it'
+function handleEnterForFindMode() {
+  exitFindMode();
+  focusFoundLink();
+  document.body.classList.add("vimiumFindMode");
+  settings.set("findModeRawQuery", findModeQuery.rawQuery);
+}
+
+function performFindInPlace() {
+  var cachedScrollX = window.scrollX;
+  var cachedScrollY = window.scrollY;
+
+  var query = findModeQuery.isRegex ? getNextQueryFromRegexMatches(0) : findModeQuery.parsedQuery;
+
+  // Search backwards first to "free up" the current word as eligible for the real forward search. This allows
+  // us to search in place without jumping around between matches as the query grows.
+  executeFind(query, { backwards: true, caseSensitive: !findModeQuery.ignoreCase });
+
+  // We need to restore the scroll position because we might've lost the right position by searching
+  // backwards.
+  window.scrollTo(cachedScrollX, cachedScrollY);
+
+  findModeQueryHasResults = executeFind(query, { caseSensitive: !findModeQuery.ignoreCase });
+}
+
+// :options is an optional dict. valid parameters are 'caseSensitive' and 'backwards'.
+function executeFind(query, options) {
+  options = options || {};
+
+  // rather hacky, but this is our way of signalling to the insertMode listener not to react to the focus
+  // changes that find() induces.
+  var oldFindMode = findMode;
+  findMode = true;
+
+  document.body.classList.add("vimiumFindMode");
+
+  // prevent find from matching its own search query in the HUD
+  HUD.hide(true);
+  // ignore the selectionchange event generated by find()
+  document.removeEventListener("selectionchange",restoreDefaultSelectionHighlight, true);
+  var rv = window.find(query, options.caseSensitive, options.backwards, true, false, true, false);
+  setTimeout(function() {
+    document.addEventListener("selectionchange", restoreDefaultSelectionHighlight, true);
+  }, 0);
+
+  findMode = oldFindMode;
+  // we need to save the anchor node here because <esc> seems to nullify it, regardless of whether we do
+  // preventDefault()
+  findModeAnchorNode = document.getSelection().anchorNode;
+  return rv;
+}
+
+function restoreDefaultSelectionHighlight() {
+  document.body.classList.remove("vimiumFindMode");
+}
+
+function focusFoundLink() {
+  if (findModeQueryHasResults) {
+    var link = getLinkFromSelection();
+    if (link)
+      link.focus();
+  }
+}
+
+function isDOMDescendant(parent, child) {
+  var node = child;
+  while (node !== null) {
+    if (node === parent)
+      return true;
+    node = node.parentNode;
+  }
+  return false;
+}
+
+function selectFoundInputElement() {
+  // if the found text is in an input element, getSelection().anchorNode will be null, so we use activeElement
+  // instead. however, since the last focused element might not be the one currently pointed to by find (e.g.
+  // the current one might be disabled and therefore unable to receive focus), we use the approximate
+  // heuristic of checking that the last anchor node is an ancestor of our element.
+  if (findModeQueryHasResults && domUtils.isSelectable(document.activeElement) &&
+      isDOMDescendant(findModeAnchorNode, document.activeElement)) {
+    domUtils.simulateSelect(document.activeElement);
+    // the element has already received focus via find(), so invoke insert mode manually
+    enterInsertModeWithoutShowingIndicator(document.activeElement);
+  }
+}
+
+function getNextQueryFromRegexMatches(stepSize) {
+  if (!findModeQuery.regexMatches)
+    return ""; // find()ing an empty query always returns false
+
+  var totalMatches = findModeQuery.regexMatches.length;
+  findModeQuery.activeRegexIndex += stepSize + totalMatches;
+  findModeQuery.activeRegexIndex %= totalMatches;
+
+  return findModeQuery.regexMatches[findModeQuery.activeRegexIndex];
+}
+
+function findAndFocus(backwards) {
+  // check if the query has been changed by a script in another frame
+  var mostRecentQuery = settings.get("findModeRawQuery") || "";
+  if (mostRecentQuery !== findModeQuery.rawQuery) {
+    findModeQuery.rawQuery = mostRecentQuery;
+    updateFindModeQuery();
+  }
+
+  var query = findModeQuery.isRegex ? getNextQueryFromRegexMatches(backwards ? -1 : 1) :
+                                      findModeQuery.parsedQuery;
+
+  findModeQueryHasResults = executeFind(query, { backwards: backwards, caseSensitive: !findModeQuery.ignoreCase });
+
+  if (!findModeQueryHasResults) {
+    HUD.showForDuration("No matches for '" + findModeQuery.rawQuery + "'", 1000);
+    return;
+  }
+
+  // if we have found an input element via 'n', pressing <esc> immediately afterwards sends us into insert
+  // mode
+  var elementCanTakeInput = domUtils.isSelectable(document.activeElement) &&
+    isDOMDescendant(findModeAnchorNode, document.activeElement);
+  if (elementCanTakeInput) {
+    handlerStack.push({
+      keydown: function(event) {
+        handlerStack.pop();
+        if (isEscape(event)) {
+          domUtils.simulateSelect(document.activeElement);
+          enterInsertModeWithoutShowingIndicator(document.activeElement);
+          return false; // we have 'consumed' this event, so do not propagate
+        }
+        return true;
+      }
+    });
+  }
+
+  focusFoundLink();
+}
+
+function performFind() { findAndFocus(); }
+
+function performBackwardsFind() { findAndFocus(true); }
+
+function getLinkFromSelection() {
+  var node = window.getSelection().anchorNode;
+  while (node && node !== document.body) {
+    if (node.nodeName.toLowerCase() === 'a') return node;
+    node = node.parentNode;
+  }
+  return null;
+}
+
+// used by the findAndFollow* functions.
+function followLink(linkElement) {
+  if (linkElement.nodeName.toLowerCase() === 'link')
+    window.location.href = linkElement.href;
+  else {
+    // if we can click on it, don't simply set location.href: some next/prev links are meant to trigger AJAX
+    // calls, like the 'more' button on GitHub's newsfeed.
+    linkElement.scrollIntoView();
+    linkElement.focus();
+    domUtils.simulateClick(linkElement);
+  }
+}
+
+/**
+ * Find and follow a link which matches any one of a list of strings. If there are multiple such links, they
+ * are prioritized for shortness, by their position in :linkStrings, how far down the page they are located,
+ * and finally by whether the match is exact. Practically speaking, this means we favor 'next page' over 'the
+ * next big thing', and 'more' over 'nextcompany', even if 'next' occurs before 'more' in :linkStrings.
+ */
+function findAndFollowLink(linkStrings) {
+  var linksXPath = domUtils.makeXPath(["a", "*[@onclick or @role='link' or contains(@class, 'button')]"]);
+  var links = domUtils.evaluateXPath(linksXPath, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE);
+  var candidateLinks = [];
+
+  // at the end of this loop, candidateLinks will contain all visible links that match our patterns
+  // links lower in the page are more likely to be the ones we want, so we loop through the snapshot backwards
+  for (var i = links.snapshotLength - 1; i >= 0; i--) {
+    var link = links.snapshotItem(i);
+
+    // ensure link is visible (we don't mind if it is scrolled offscreen)
+    var boundingClientRect = link.getBoundingClientRect();
+    if (boundingClientRect.width == 0 || boundingClientRect.height == 0)
+      continue;
+    var computedStyle = window.getComputedStyle(link, null);
+    if (computedStyle.getPropertyValue('visibility') != 'visible' ||
+        computedStyle.getPropertyValue('display') == 'none')
+      continue;
+
+    var linkMatches = false;
+    for (var j = 0; j < linkStrings.length; j++) {
+      if (link.innerText.toLowerCase().indexOf(linkStrings[j]) !== -1) {
+        linkMatches = true;
+        break;
+      }
+    }
+    if (!linkMatches) continue;
+
+    candidateLinks.push(link);
+  }
+
+  if (candidateLinks.length === 0) return;
+
+  function wordCount(link) { return link.innerText.trim().split(/\s+/).length; }
+
+  // We can use this trick to ensure that Array.sort is stable. We need this property to retain the reverse
+  // in-page order of the links.
+  candidateLinks.forEach(function(a,i){ a.originalIndex = i; });
+
+  // favor shorter links, and ignore those that are more than one word longer than the shortest link
+  candidateLinks =
+    candidateLinks
+      .sort(function(a,b) {
+        var wcA = wordCount(a), wcB = wordCount(b);
+        return wcA === wcB ? a.originalIndex - b.originalIndex : wcA - wcB;
+      })
+      .filter(function(a){return wordCount(a) <= wordCount(candidateLinks[0]) + 1});
+
+  // try to get exact word matches first
+  for (var i = 0; i < linkStrings.length; i++)
+    for (var j = 0; j < candidateLinks.length; j++) {
+      var exactWordRegex = new RegExp("\\b" + linkStrings[i] + "\\b", "i");
+      if (exactWordRegex.test(candidateLinks[j].innerText)) {
+        followLink(candidateLinks[j]);
+        return true;
+      }
+    }
+
+  for (var i = 0; i < linkStrings.length; i++)
+    for (var j = 0; j < candidateLinks.length; j++) {
+      if (candidateLinks[j].innerText.toLowerCase().indexOf(linkStrings[i]) !== -1) {
+        followLink(candidateLinks[j]);
+        return true;
+      }
+    }
+
+  return false;
+}
+
+function findAndFollowRel(value) {
+  var relTags = ['link', 'a', 'area'];
+  for (i = 0; i < relTags.length; i++) {
+    var elements = document.getElementsByTagName(relTags[i]);
+    for (j = 0; j < elements.length; j++) {
+      if (elements[j].hasAttribute('rel') && elements[j].rel == value) {
+        followLink(elements[j]);
+        return true;
+      }
+    }
+  }
+}
+
+function goPrevious() {
+  var previousPatterns = settings.get("previousPatterns") || "";
+  var previousStrings = previousPatterns.split(",");
+  findAndFollowRel('prev') || findAndFollowLink(previousStrings);
+}
+
+function goNext() {
+  var nextPatterns = settings.get("nextPatterns") || "";
+  var nextStrings = nextPatterns.split(",");
+  findAndFollowRel('next') || findAndFollowLink(nextStrings);
+}
+
+function showFindModeHUDForQuery() {
+  if (findModeQueryHasResults || findModeQuery.parsedQuery.length == 0)
+    HUD.show("/" + findModeQuery.rawQuery);
+  else
+    HUD.show("/" + findModeQuery.rawQuery + " (No Matches)");
+}
+
+function enterFindMode() {
+  findModeQuery = { rawQuery: "" };
+  findMode = true;
+  HUD.show("/");
+}
+
+function exitFindMode() {
+  findMode = false;
+  HUD.hide();
+}
+
+function showHelpDialog(html, fid) {
+  if (isShowingHelpDialog || !document.body || fid != frameId)
+    return;
+  isShowingHelpDialog = true;
+  var container = document.createElement("div");
+  container.id = "vimiumHelpDialogContainer";
+  container.className = "vimiumReset";
+
+  document.body.appendChild(container);
+
+  container.innerHTML = html;
+  container.getElementsByClassName("closeButton")[0].addEventListener("click", hideHelpDialog, false);
+  container.getElementsByClassName("optionsPage")[0].addEventListener("click",
+      function() { chrome.extension.sendRequest({ handler: "openOptionsPageInNewTab" }); }, false);
+
+  // This is necessary because innerHTML does not evaluate javascript embedded in <script> tags.
+  var scripts = Array.prototype.slice.call(container.getElementsByTagName("script"));
+  scripts.forEach(function(script) { eval(script.text); });
+
+}
+
+function hideHelpDialog(clickEvent) {
+  isShowingHelpDialog = false;
+  var helpDialog = document.getElementById("vimiumHelpDialogContainer");
+  if (helpDialog)
+    helpDialog.parentNode.removeChild(helpDialog);
+  if (clickEvent)
+    clickEvent.preventDefault();
+}
+
+/*
+ * A heads-up-display (HUD) for showing Vimium page operations.
+ * Note: you cannot interact with the HUD until document.body is available.
+ */
+HUD = {
+  _tweenId: -1,
+  _displayElement: null,
+  _upgradeNotificationElement: null,
+
+  // This HUD is styled to precisely mimick the chrome HUD on Mac. Use the "has_popup_and_link_hud.html"
+  // test harness to tweak these styles to match Chrome's. One limitation of our HUD display is that
+  // it doesn't sit on top of horizontal scrollbars like Chrome's HUD does.
+
+  showForDuration: function(text, duration) {
+    HUD.show(text);
+    HUD._showForDurationTimerId = setTimeout(function() { HUD.hide(); }, duration);
+  },
+
+  show: function(text) {
+    if (!HUD.enabled()) return;
+    clearTimeout(HUD._showForDurationTimerId);
+    HUD.displayElement().innerHTML = text;
+    clearInterval(HUD._tweenId);
+    HUD._tweenId = Tween.fade(HUD.displayElement(), 1.0, 150);
+    HUD.displayElement().style.display = "";
+  },
+
+  showUpgradeNotification: function(version) {
+    HUD.upgradeNotificationElement().innerHTML = "Vimium has been updated to " +
+      "<a class='vimiumReset' href='https://chrome.google.com/extensions/detail/dbepggeogbaibhgnhhndojpepiihcmeb'>" +
+      version + "</a>.<a class='vimiumReset close-button' href='#'>x</a>";
+    var links = HUD.upgradeNotificationElement().getElementsByTagName("a");
+    links[0].addEventListener("click", HUD.onUpdateLinkClicked, false);
+    links[1].addEventListener("click", function(event) {
+      event.preventDefault();
+      HUD.onUpdateLinkClicked();
+    });
+    Tween.fade(HUD.upgradeNotificationElement(), 1.0, 150);
+  },
+
+  onUpdateLinkClicked: function(event) {
+    HUD.hideUpgradeNotification();
+    chrome.extension.sendRequest({ handler: "upgradeNotificationClosed" });
+  },
+
+  hideUpgradeNotification: function(clickEvent) {
+    Tween.fade(HUD.upgradeNotificationElement(), 0, 150,
+      function() { HUD.upgradeNotificationElement().style.display = "none"; });
+  },
+
+  /*
+   * Retrieves the HUD HTML element.
+   */
+  displayElement: function() {
+    if (!HUD._displayElement) {
+      HUD._displayElement = HUD.createHudElement();
+      // Keep this far enough to the right so that it doesn't collide with the "popups blocked" chrome HUD.
+      HUD._displayElement.style.right = "150px";
+    }
+    return HUD._displayElement;
+  },
+
+  upgradeNotificationElement: function() {
+    if (!HUD._upgradeNotificationElement) {
+      HUD._upgradeNotificationElement = HUD.createHudElement();
+      // Position this just to the left of our normal HUD.
+      HUD._upgradeNotificationElement.style.right = "315px";
+    }
+    return HUD._upgradeNotificationElement;
+  },
+
+  createHudElement: function() {
+    var element = document.createElement("div");
+    element.className = "vimiumReset vimiumHUD";
+    document.body.appendChild(element);
+    return element;
+  },
+
+  hide: function(immediate) {
+    clearInterval(HUD._tweenId);
+    if (immediate)
+      HUD.displayElement().style.display = "none";
+    else
+      HUD._tweenId = Tween.fade(HUD.displayElement(), 0, 150,
+        function() { HUD.displayElement().style.display = "none"; });
+  },
+
+  isReady: function() { return document.body != null; },
+
+  /* A preference which can be toggled in the Options page. */
+  enabled: function() { return !settings.get("hideHud"); }
+
+};
+
+Tween = {
+  /*
+   * Fades an element's alpha. Returns a timer ID which can be used to stop the tween via clearInterval.
+   */
+  fade: function(element, toAlpha, duration, onComplete) {
+    var state = {};
+    state.duration = duration;
+    state.startTime = (new Date()).getTime();
+    state.from = parseInt(element.style.opacity) || 0;
+    state.to = toAlpha;
+    state.onUpdate = function(value) {
+      element.style.opacity = value;
+      if (value == state.to && onComplete)
+        onComplete();
+    };
+    state.timerId = setInterval(function() { Tween.performTweenStep(state); }, 50);
+    return state.timerId;
+  },
+
+  performTweenStep: function(state) {
+    var elapsed = (new Date()).getTime() - state.startTime;
+    if (elapsed >= state.duration) {
+      clearInterval(state.timerId);
+      state.onUpdate(state.to)
+    } else {
+      var value = (elapsed / state.duration)  * (state.to - state.from) + state.from;
+      state.onUpdate(value);
+    }
+  }
+};
+
+/*
+ * Adds the given CSS to the page.
+ */
+function addCssToPage(css, id) {
+  var head = document.getElementsByTagName("head")[0];
+  if (!head) {
+    head = document.createElement("head");
+    document.documentElement.appendChild(head);
+  }
+  var style = document.createElement("style");
+  style.id = id;
+  style.type = "text/css";
+  style.appendChild(document.createTextNode(css));
+  head.appendChild(style);
+}
+
+initializePreDomReady();
+window.addEventListener("DOMContentLoaded", initializeOnDomReady);
+
+window.onbeforeunload = function() {
+  chrome.extension.sendRequest({ handler: "updateScrollPosition",
+      scrollX: window.scrollX, scrollY: window.scrollY });
+}
diff --git a/content_scripts/vomnibar.js b/content_scripts/vomnibar.js
new file mode 100644
index 00000000..4f136635
--- /dev/null
+++ b/content_scripts/vomnibar.js
@@ -0,0 +1,232 @@
+var vomnibar = (function() {
+  var vomnibarUI = null;  // the dialog instance for this window
+  var completers = { };
+
+  function getCompleter(name) {
+    if (!(name in completers))
+      completers[name] = new BackgroundCompleter(name);
+    return completers[name];
+  }
+
+  /*
+   * Activate the Vomnibox.
+   */
+  function activate(completerName, refreshInterval, initialQueryValue) {
+    var completer = getCompleter(completerName);
+    if (!vomnibarUI)
+      vomnibarUI = new VomnibarUI(10);
+    completer.refresh();
+    vomnibarUI.setCompleter(completer);
+    vomnibarUI.setRefreshInterval(refreshInterval);
+    if (initialQueryValue)
+      vomnibarUI.setQuery(initialQueryValue);
+    vomnibarUI.show();
+  }
+
+  /** User interface for fuzzy completion */
+  var VomnibarUI = Class.extend({
+    init: function(maxResults) {
+      this.prompt = '>';
+      this.maxResults = maxResults;
+      this.refreshInterval = 0;
+      this.initDom();
+    },
+
+    setQuery: function(query) { this.input.value = query; },
+
+    setCompleter: function(completer) {
+      this.completer = completer;
+      this.reset();
+    },
+
+    setRefreshInterval: function(refreshInterval) { this.refreshInterval = refreshInterval; },
+
+    show: function() {
+      this.box.style.display = "block";
+      this.input.focus();
+      handlerStack.push({ keydown: this.onKeydown.bind(this) });
+    },
+
+    hide: function() {
+      this.box.style.display = "none";
+      this.completionList.style.display = "none";
+      this.input.blur();
+      handlerStack.pop();
+    },
+
+    reset: function() {
+      this.input.value = "";
+      this.updateTimer = null;
+      this.completions = [];
+      this.selection = 0;
+      this.update(true);
+    },
+
+    updateSelection: function() {
+      if (this.completions.length > 0)
+        this.selection = Math.min(this.selection, this.completions.length - 1);
+      for (var i = 0; i < this.completionList.children.length; ++i)
+        this.completionList.children[i].className = (i == this.selection) ? "selected" : "";
+    },
+
+    /*
+     * Returns the user's action ("up", "down", "enter", "dismiss" or null) based on their keypress.
+     * We support the arrow keys and other shortcuts for moving, so this method hides that complexity.
+     */
+    actionFromKeyEvent: function(event) {
+      var key = getKeyChar(event);
+      if (isEscape(event))
+        return "dismiss";
+      else if (key == "up" ||
+          (event.shiftKey && event.keyCode == keyCodes.tab) ||
+          (event.ctrlKey && (key == "k" || key == "p")))
+        return "up";
+      else if (key == "down" ||
+        (event.keyCode == keyCodes.tab && !event.shiftKey) ||
+        (event.ctrlKey && (key == "j" || key == "n")))
+        return "down";
+      else if (event.keyCode == keyCodes.enter)
+        return "enter";
+    },
+
+    onKeydown: function(event) {
+      var action = this.actionFromKeyEvent(event);
+      if (!action) return true; // pass through
+
+      if (action == "dismiss") {
+        this.hide();
+      }
+      else if (action == "up") {
+        if (this.selection > 0)
+          this.selection -= 1;
+        this.updateSelection();
+      }
+      else if (action == "down") {
+        if (this.selection < this.completions.length - 1)
+          this.selection += 1;
+        this.updateSelection();
+      }
+      else if (action == "enter") {
+        this.update(true, function() {
+          // Shift+Enter will open the result in a new tab instead of the current tab.
+          var openInNewTab = (event.shiftKey || isPrimaryModifierKey(event));
+          this.completions[this.selection].performAction(openInNewTab);
+          this.hide();
+        }.proxy(this));
+      }
+
+      // It seems like we have to manually supress the event here and still return true.
+      event.stopPropagation();
+      event.preventDefault();
+      return true;
+    },
+
+    updateCompletions: function(callback) {
+      query = this.input.value.replace(/^\s*/, "");
+
+      this.completer.filter(query, this.maxResults, function(completions) {
+        this.completions = completions;
+
+        // update completion list with the new data
+        this.completionList.innerHTML = completions.map(function(completion) {
+          return "<li>" + completion.html + "</li>";
+        }).join('');
+
+        this.completionList.style.display = this.completions.length > 0 ? "block" : "none";
+        this.updateSelection();
+        if (callback) callback();
+      }.proxy(this));
+    },
+
+    update: function(force, callback) {
+      force = force || false; // explicitely default to asynchronous updating
+
+      if (force) {
+        // cancel scheduled update
+        if (this.updateTimer !== null)
+          window.clearTimeout(this.updateTimer);
+        this.updateCompletions(callback);
+      } else if (this.updateTimer !== null) {
+        // an update is already scheduled, don't do anything
+        return;
+      } else {
+        // always update asynchronously for better user experience and to take some load off the CPU
+        // (not every keystroke will cause a dedicated update)
+        this.updateTimer = setTimeout(function() {
+          this.updateCompletions(callback);
+          this.updateTimer = null;
+        }.proxy(this), this.refreshInterval);
+      }
+    },
+
+    initDom: function() {
+      this.box = utils.createElementFromHtml(
+        '<div id="vomnibar" class="vimiumReset">'+
+          '<div class="input">'+
+            '<span class="prompt">' + utils.escapeHtml(this.prompt) + '</span> '+
+            '<input type="text" class="query"></span></div>'+
+          '<ul></ul></div>');
+      this.box.style.display = 'none';
+      document.body.appendChild(this.box);
+
+      this.input = document.querySelector("#vomnibar .query");
+      this.input.addEventListener("input", function() { this.update(); }.bind(this));
+      this.completionList = document.querySelector("#vomnibar ul");
+      this.completionList.style.display = "none";
+    }
+  });
+
+  /*
+   * Sends filter and refresh requests to a Vomnibox completer on the background page.
+   */
+  var BackgroundCompleter = Class.extend({
+    /* - name: The background page completer that you want to interface with. Either "omni" or "tabs". */
+    init: function(name) {
+      this.name = name;
+      this.filterPort = chrome.extension.connect({ name: "filterCompleter" });
+    },
+
+    refresh: function() { chrome.extension.sendRequest({ handler: "refreshCompleter", name: this.name }); },
+
+    filter: function(query, maxResults, callback) {
+      var id = utils.createUniqueId();
+      this.filterPort.onMessage.addListener(function(msg) {
+        if (msg.id != id) return;
+        callback(msg.results.map(function(result) {
+          // functionName will be either "navigateToUrl" or "switchToTab". args will be a URL or a tab ID.
+          var functionToCall = completionActions[result.action.functionName];
+          result.performAction = functionToCall.curry(result.action.args);
+          return result;
+        }));
+      });
+      this.filterPort.postMessage({ id: id, name: this.name, query: query, maxResults: maxResults });
+    }
+  });
+
+  /*
+   * These are the actions we can perform when the user selects a result in the Vomnibox.
+   */
+  var completionActions = {
+    navigateToUrl: function(url, openInNewTab) {
+      // If the URL is a bookmarklet prefixed with javascript:, we shouldn't open that in a new tab.
+      if (url.indexOf("javascript:") == 0)
+        openInNewTab = false;
+      chrome.extension.sendRequest({
+        handler: openInNewTab ? "openUrlInNewTab" : "openUrlInCurrentTab",
+        url: url,
+        selected: openInNewTab
+      });
+    },
+
+    switchToTab: function(tabId) {
+      chrome.extension.sendRequest({ handler: "selectSpecificTab", id: tabId });
+    }
+  };
+
+  // public interface
+  return {
+    activate: function() { activate("omni", 100); },
+    activateWithCurrentUrl: function() { activate("omni", 100, window.location.toString()); },
+    activateTabSelection: function() { activate("tabs", 0); }
+  }
+})();
diff --git a/lib/completion.js b/lib/completion.js
deleted file mode 100644
index b31c4918..00000000
--- a/lib/completion.js
+++ /dev/null
@@ -1,626 +0,0 @@
-/*
- * This contains the definition of the completers used for the Vomnibox's suggestion UI. A complter will take
- * a query (whatever the user typed into the Vomnibox) and return a list of matches, e.g. bookmarks, domains,
- * URLs from history.
- *
- * The Vomnibox frontend script makes a "filterCompleter" request to the background page, which in turn calls
- * filter() on each these completers.
- *
- * A completer is a class which has two functions:
- * - refresh(): refreshes the completer's data source (e.g. refetches the list of bookmarks from Chrome).
- * - filter(query, callback): "query" will be whatever the user typed into the Vomnibox. "callback" is a
- *   function which will be invoked with a list of LazyCompletionResults as its first argument.
- *
- * A completer's filter() function returns a list of LazyCompletionResults. This contains a relevancy score
- * for the result, as well as a function to build the full result (e.g. the HTML representing this result).
- *
- * The MultiCompleter collects a big list of LazyCompletionResults from many completers by calling each of
- * their filter functions in turn, sorts the results by relevancy, and then calls build() on the top N
- * results. This allows us to avoid generating HTML for all of the results we're not going to use.
- * The objects returned from build() are sent to the Vomnibox frontend script to be shown in the UI.
- */
-var completion = (function() {
-
-  /*
-   * An object which contains a relevancy score for the given completion, and a function which can be
-   * invoked to build its HTML.
-   * Calling build() should return an object of the form:
-   *   { html: "", action: { functionName: "", args: [] } }
-   * This object is eventually sent back to the Vomnibox frontend script. "action" contains the action to
-   * be performed by the frontend script if this result is chosen (user selects it and hits enter).
-   * "action" includes the function the frontendScript should execute (e.g. "navigateToUrl") along with any
-   * arguments (like the URL).
-   * "html" is the HTML representation of this result, with some characters emphasized to higlight the query.
-   *
-   * This is called "lazy" because it takes in a function to lazily compute a result's html. That operation
-   * can be kind of expensive, so you only want to do it to the top completion results, after you've sorted
-   * them by relevancy.
-   */
-  var LazyCompletionResult = function(relevancy, buildFunction) {
-    this.relevancy = relevancy;
-    this.build = buildFunction;
-  }
-
-  /*
-   * A completer which takes in a list of keyword commands (like "wiki" for "search wikipedia") and will
-   * decide if your query is a command, a URL that you want to visit, or a search term.
-   */
-  var SmartKeywordCompleter = Class.extend({
-    /*
-     * - commands: a list of commands of the form: { keyword: [title, url] }, e.g.:
-     *   { "wiki ": ["Wikipedia (en)", "http://en.wikipedia.org/wiki/%s" ]
-     */
-    init: function(commands) {
-      this.commands = commands || {};
-      this.commandKeys = Object.keys(commands);
-    },
-
-    refresh: function() { },
-
-      /** Returns the suggestions matching the user-defined commands */
-    getCommandSuggestions: function(query, suggestions) {
-      return this.commandKeys.filter(function(cmd) { return query.indexOf(cmd) == 0 }).map(function(cmd) {
-        var term = query.slice(cmd.length);
-        var desc = this.commands[cmd][0];
-        var pattern = this.commands[cmd][1];
-        var url = (typeof pattern == "function") ? pattern(term) : pattern.replace(/%s/g, term);
-
-        // this will appear even before the URL/search suggestion
-        return new LazyCompletionResult(-2, function() {
-          return {
-            html:   createCompletionHtml(desc, term),
-            action: { functionName: "navigateToUrl", args: [utils.createFullUrl(url)] },
-          }})
-      }.proxy(this));
-    },
-
-    /** Checks if the input is a URL. If yes, returns a suggestion to visit it. If no, returns a suggestion
-     * to start a web search. */
-    getUrlOrSearchSuggestion: function(query, suggestions) {
-      // trim query
-      query = query.replace(/^\s+|\s+$/g, '');
-      var isUrl = utils.isUrl(query);
-      return new LazyCompletionResult(-1, function() {
-        return {
-            html: createCompletionHtml(isUrl ? "goto" : "search", query),
-            action: { functionName: "navigateToUrl",
-                args: isUrl ? [utils.createFullUrl(query)] : [utils.createSearchUrl(query)] }
-        }});
-    },
-
-    filter: function(query, callback) {
-      suggestions = this.getCommandSuggestions(query);
-      suggestions.push(this.getUrlOrSearchSuggestion(query));
-      callback(suggestions);
-    }
-  });
-
-  /*
-   * A generic asynchronous completer which is used by completers which have asynchronous data sources,
-   * like history or bookmarks.
-   */
-  var AsyncCompleter = Class.extend({
-    init: function() {
-      this.id = utils.createUniqueId();
-      this.reset();
-      this.resultsReady = this.fallbackReadyCallback = function(results) { this.completions = results; }
-    },
-
-    reset: function() {
-      fuzzyMatcher.invalidateFilterCache(this.id);
-      this.completions = null;
-    },
-
-    /*
-     * This creates an intermediate representation of a completion which will later be called with a specific
-     * query.
-     * - type: the type of item we're completing against, e.g. "bookmark", "history", "tab".
-     * - item: the item itself. This should include a url and title property (bookmark, history and tab
-     *   objects include both of these).
-     * - action: the action to take in the Vomnibox frontend 
-     *
-     * It's used to save us work -- we call this on every bookmark in your bookmarks list when we first fetch
-     * them, for instance, and we don't want to do some the same work again every time a new query is
-     * processed.
-     *
-     * TODO(philc): It would be nice if this could be removed; it's confusing.
-     * */
-    createUnrankedCompletion: function(type, item, action) {
-      var url = item.url;
-      var parts = [type, url, item.title];
-      var str = parts.join(" ");
-      action = action || { functionName: "navigateToUrl", args: [url] };
-
-      function createLazyCompletion(query) {
-        var relevancy = url.length / fuzzyMatcher.calculateRelevancy(query, str)
-        return new LazyCompletionResult(relevancy, function() {
-          return {
-            html:   renderFuzzy(query, createCompletionHtml.apply(null, parts)),
-            action: action,
-          }});
-      }
-
-      // add one more layer of indirection: For filtering, we only need the string to match.
-      // Only after we reduced the number of possible results, we call :bind on them to get
-      // an actual completion object
-      return {
-        completionString: parts.join(" "),
-        createLazyCompletion: createLazyCompletion,
-      }
-    },
-
-    processResults: function(query, results) {
-      results = fuzzyMatcher.filter(query, results,
-          function(match) { return match.completionString }, this.id);
-      return results.map(function(result) { return result.createLazyCompletion(query); });
-    },
-
-    filter: function(query, callback) {
-      var handler = function(results) { callback(this.processResults(query, results)); }.proxy(this);
-
-      // are the results ready?
-      if (this.completions !== null) {
-        // yes: call the callback synchronously
-        handler(this.completions);
-      } else {
-        // no: register the handler as a callback
-        this.resultsReady = function(results) {
-          handler(results);
-          this.resultsReady = this.fallbackReadyCallback;
-          this.resultsReady(results);
-        }.proxy(this);
-      }
-    }
-  });
-
-  var FuzzyBookmarkCompleter = Class.extend({
-    init: function() { this.asyncCompleter = new AsyncCompleter(); },
-    filter: function(query, callback) { return this.asyncCompleter.filter(query, callback); },
-
-    // Traverses the bookmark hierarhcy and retuns a list of all bookmarks in the tree.
-    traverseBookmarkTree: function(bookmarks) {
-      var results = [];
-      var toVisit = bookmarks;
-      while (toVisit.length > 0) {
-        var bookmark = toVisit.shift();
-        results.push(bookmark);
-        if (bookmark.children)
-          toVisit.push.apply(toVisit, bookmark.children);
-      }
-      return results;
-    },
-
-    refresh: function() {
-      this.asyncCompleter.reset();
-      chrome.bookmarks.getTree(function(bookmarks) {
-        var results = this.traverseBookmarkTree(bookmarks);
-        var validResults = results.filter(function(b) { return b.url !== undefined; });
-        var matches = validResults.map(function(bookmark) {
-          return this.asyncCompleter.createUnrankedCompletion("bookmark", bookmark);
-        }.proxy(this));
-        this.asyncCompleter.resultsReady(matches);
-      }.proxy(this));
-    }
-  });
-
-  var FuzzyHistoryCompleter = Class.extend({
-    init: function(maxResults) {
-      this.asyncCompleter = new AsyncCompleter();
-      this.maxResults = maxResults;
-    },
-
-    filter: function(query, callback) { return this.asyncCompleter.filter(query, callback); },
-
-    refresh: function() {
-      this.asyncCompleter.reset();
-
-      historyCache.use(function(history) {
-        this.asyncCompleter.resultsReady(history.slice(-this.maxResults).map(function(item) {
-          return this.asyncCompleter.createUnrankedCompletion("history", item);
-        }.proxy(this)));
-      }.proxy(this));
-    }
-  });
-
-  var FuzzyTabCompleter = Class.extend({
-    init: function() { this.asyncCompleter = new AsyncCompleter(); },
-
-    filter: function(query, callback) { return this.asyncCompleter.filter(query, callback); },
-
-    refresh: function() {
-      this.asyncCompleter.reset();
-      chrome.tabs.getAllInWindow(null, function(tabs) {
-        this.asyncCompleter.resultsReady(tabs.map(function(tab) {
-          return this.asyncCompleter.createUnrankedCompletion("tab", tab,
-              { functionName: "switchToTab", args: [tab.id] });
-        }.proxy(this)));
-      }.proxy(this));
-    }
-  });
-
-  /*
-   * A completer which matches only domains from sites in your history with the current query.
-   */
-  var DomainCompleter = Class.extend({
-    // A mapping of doamin => useHttps, where useHttps is a boolean.
-    domains: null,
-
-    withDomains: function(callback) {
-      var self = this;
-      function buildResult() {
-        return Object.keys(self.domains).map(function(dom) {
-          return [dom, self.domains[dom]];
-        });
-      }
-      if (self.domains !== null)
-        return callback(buildResult());
-
-      self.domains = {};
-
-      function processDomain(domain, https) {
-        // non-www version is preferrable, so check if we have it already
-        if (domain.indexOf('www.') == 0 && self.domains.hasOwnProperty(domain.slice(4)))
-          domain = domain.slice(4);
-
-        // HTTPS is preferrable
-        https = https || self.domains[domain] || self.domains['www.' + domain];
-
-        self.domains[domain] = !!https;
-        delete self.domains['www.' + domain];
-      }
-
-      function processUrl(url) {
-        parts = url.split('/');
-        processDomain(parts[2], parts[0] == 'https:');
-      }
-
-      historyCache.use(function(history) {
-        history.forEach(function(item) { processUrl(item.url); });
-      });
-
-      chrome.history.onVisited.addListener(function(item) { processUrl(item.url); });
-
-      callback(buildResult());
-    },
-
-    refresh: function() { },
-
-    filter: function(query, callback) {
-      var best = null;
-      this.withDomains(function(domains) {
-        var bestOffset = 1000;
-        domains.forEach(function(result) {
-          var domain = result[0];
-          var protocol = result[1] ? 'https' : 'http';
-
-          var offset = domain.indexOf(query);
-          if (offset < 0 || offset >= bestOffset)
-            return;
-
-          // found a new optimum
-          bestOffset = offset;
-          best = new LazyCompletionResult(-1.5, function() {
-            return {
-              html:   createCompletionHtml("site", domain),
-              action: { functionName: "navigateToUrl", args: [protocol + "://" + domain] },
-            }});
-        });
-      });
-      callback(best ? [best] : []);
-    }
-  });
-
-  /** A meta-completer that delegates queries and merges and sorts the results of a collection of other
-   * completer instances given in :sources. The optional argument :queryThreshold determines how long a
-   * query has to be to trigger a search. */
-  var MultiCompleter = Class.extend({
-    init: function(sources, queryThreshold) {
-      if (queryThreshold === undefined)
-        queryThreshold = 1; // default
-      this.sources = sources;
-      this.queryThreshold = queryThreshold;
-    },
-
-    refresh: function() { this.sources.forEach(function(source) { source.refresh(); }); },
-
-    filter: function(query, maxResults, callback) {
-      if (query.length < this.queryThreshold) {
-        callback([]);
-        return;
-      }
-
-      var allResults = [];
-      var counter = this.sources.length;
-
-      this.sources.forEach(function(source) {
-        source.filter(query, function(results) {
-          allResults = allResults.concat(results);
-          if (--counter > 0)
-            return;
-
-          // all sources have provided results by now, so we can sort and return
-          allResults.sort(function(a,b) { return a.relevancy - b.relevancy; });
-          // evalulate lazy completions for the top n results
-          callback(allResults.slice(0, maxResults).map(function(result) { return result.build(); }));
-        });
-      });
-    }
-  });
-
-  /** Singleton object that provides helpers and caching for fuzzy completion. */
-  var fuzzyMatcher = (function() {
-    var self = {};
-
-    self.timeToClean = 0;
-    self.cacheSize = 1000;
-    self.regexNonWord = /[\W_]/ig;
-
-    // cache generated regular expressions
-    self.regexpCache = {};
-    // cache filtered results from recent queries
-    self.filterCache = {};
-    self.normalizationCache = {};
-
-    /** Normalizes the string specified in :query. Strips any non-word characters and converts
-     * to lower case. */
-    self.normalize = function(query) {
-      if (!(query in self.normalizationCache))
-        self.normalizationCache[query] = query.replace(self.regexNonWord, '').toLowerCase();
-      return self.normalizationCache[query];
-    }
-
-    /** Returns the non-matching and matching string parts, in alternating order (starting with a
-     * non-matching part) or null, if the string doesn't match the query.
-     *
-     * Sample: match("codecodec","code.google.com/codec") would yield ["", "code", ".google.com/", "codec"]
-     *
-     * Note that this function matches the longest possible parts of a string and is therefore not very
-     * efficient. There it falls back to a more performant, but less accurate regex matching if the
-     * normalized query is longer than 10 characters.
-     *
-     * _Don't use this to check if a string matches a query_. Use `getRegexp(query).test(str)` instead.
-     */
-    self.getMatchGroups = function(query, str) {
-      query = self.normalize(query);
-      if (query.length == 0)
-        return str.length ? [str] : [];
-      if (query.length > 15) {
-        // for long query strings, the method is much too inefficient, so fall
-        // back to the less accurate regex matching
-        return self.getRegexp(query).exec(str).slice(1);
-      }
-
-      for (var i = query.length; i >= 1; --i) {
-        var part = query.slice(0, i);
-        var partOffset = str.toLowerCase().indexOf(part);
-        if (partOffset < 0)
-          continue;
-
-        // we use recursive backtracking here, this is why it's slow.
-        rest = self.getMatchGroups(query.slice(i), str.slice(partOffset + i));
-        if (!rest) continue;
-
-        return [
-          str.slice(0, partOffset),
-          part,
-        ].concat(rest);
-      }
-      return null;
-    }
-
-    /** Calculates a very simple similarity value between a :query and a :string */
-    self.calculateRelevancy = function(query, str) {
-      query = self.normalize(query);
-      str   = self.normalize(str);
-      var sum = 0;
-
-      // only iterate over slices of the query starting at an offset up to 10 to save resources
-      for (var start = 0; start < 20 && start < query.length; ++start) {
-        for (var i = query.length; i >= start; --i) {
-          if (str.indexOf(query.slice(start, i)) >= 0) {
-            var length = i - start;
-            sum += length * length;
-            break;
-          }
-        }
-      }
-      return sum * sum * sum;
-    }
-
-    /** Trims the size of the caches to the configured size using a FIFO algorithm. */
-    self.cleanCache = function() {
-      // remove old cached regexes
-      Object.keys(self.regexpCache).slice(self.cacheSize).forEach(function(query) {
-        delete self.regexpCache[query];
-      });
-      // remove old cached normalization results
-      Object.keys(self.normalizationCache).slice(self.cacheSize).forEach(function(query) {
-        delete self.normalizationCache[query];
-      });
-    }
-
-    /** Returns a regex that matches a string using a fuzzy :query. Example: The :query "abc" would result
-     * in a regex like /^([^a])*(a)([^b])*(b)([^c])*(c)(.*)$/
-     */
-    self.getRegexp = function(query) {
-      query = self.normalize(query);
-      if (!(query in self.regexpCache)) {
-        // build up a regex for fuzzy matching. This is the fastest method I checked (faster than:
-        // string building, splice, concat, multi-level join)
-        var regex = ['^'];
-        for (var i = 0; i < query.length; ++i) {
-          regex.push('([^');
-          regex.push(query[i]);
-          regex.push(']*)(');
-          regex.push(query[i]);
-          regex.push(')');
-        }
-        regex.push('(.*)$');
-        self.regexpCache[query] = new RegExp(regex.join(''), 'i');
-      }
-      return self.regexpCache[query];
-    }
-
-    /** Clear the cache for the given source, e.g. for refreshing */
-    self.invalidateFilterCache = function(id) {
-      self.filterCache[id] = {};
-    }
-
-    /** Filters a collection :source using fuzzy matching against an input string :query. If a query with
-     * a less specific query was issued before (e.g. if the user added a letter to the query), the cached
-     * results of the last filtering are used as a starting point, instead of :source.
-     */
-    self.filter = function(query, source, getValue, id) {
-      if (!(id in self.filterCache))
-        self.filterCache[id] = {};
-
-      // find the most narrow list of results in the cache
-      var optSpecificity = source.length;
-      var specificity;
-      for (key in self.filterCache[id]) {
-        if (!self.filterCache[id].hasOwnProperty(key))
-          continue;
-
-        if ((query.indexOf(key) != 0 && key.indexOf(query) != 0) || key.length > query.length) {
-          // cache entry no longer needed
-          delete self.filterCache[id][key];
-          continue;
-        }
-
-        // is this a plausible result set to use as a source?
-        if (query.indexOf(key) < 0)
-          continue;
-
-        // is this cache entry the most specific so far?
-        specificity = self.filterCache[id][key].length;
-        if (specificity < optSpecificity) {
-          source = self.filterCache[id][key];
-          optSpecificity = specificity;
-        }
-      }
-
-      // don't clean up the caches every iteration
-      if (++self.timeToClean > 100) {
-        self.timeToClean = 0;
-        self.cleanCache();
-      }
-
-      var regexp = self.getRegexp(query);
-      var filtered = source.filter(function(x) { return regexp.test(getValue(x)) });
-      self.filterCache[id][query] = filtered;
-      return filtered;
-    }
-
-    return self;
-  })();
-
-  var htmlRegex = /<[^>]*>|&[a-z]+;/gi;
-
-  /** Strips HTML tags and entities using a naive regex replacement. Optionally, saves the stripped
-   * HTML tags in a dictionary indexed by the position where the tag should be reinserted. */
-  function stripHtmlTags(str, positions) {
-    if (!positions)
-      return str.replace(htmlRegex, '');
-
-    var match = str.match(htmlRegex);
-    if (!match) return;
-    match.reverse();
-    var split = str.split(htmlRegex);
-    var offset = 0;
-    var i = 0;
-    split.forEach(function(text) {
-      if (match.length > 0)
-        positions[offset += text.length] = match.pop();
-    });
-
-    return split.join('');
-  }
-
-  /** Creates an file-internal representation of a URL match with the given paramters */
-  function createCompletionHtml(type, str, title) {
-    title = title || '';
-    // sanitize input, it could come from a malicious web site
-    title = title.length > 0 ? ' <span class="title">' + utils.escapeHtml(title) + '</span>' : '';
-    return '<em>' + type + '</em> ' + utils.escapeHtml(str) + title;
-  }
-
-  /** Renders a completion by marking fuzzy-matched parts. */
-  function renderFuzzy(query, html) {
-    // we want to match the content in HTML tags, but not the HTML tags themselves, so we remove the
-    // tags and reinsert them after the matching process
-    var htmlTags = {};
-    var groups = fuzzyMatcher.getMatchGroups(query, stripHtmlTags(html, htmlTags));
-
-    html = [];
-    var htmlOffset = 0;
-
-    // this helper function adds the HTML generated _for one single character_ to the HTML output
-    // and reinserts HTML tags stripped before, if they were at this position
-    function addToHtml(str) {
-      if (htmlOffset in htmlTags)
-        html.push(htmlTags[htmlOffset]);
-      html.push(str);
-      ++htmlOffset;
-    }
-
-    function addCharsWithDecoration(str, before, after) {
-      before = before || '';
-      after = after || '';
-      for (var i = 0; i < str.length; ++i)
-        addToHtml(before + str[i] + after);
-    }
-
-    // iterate over the match groups. They are non-matched and matched string parts, in alternating order
-    for (var i = 0; i < groups.length; ++i) {
-      if (i % 2 == 0)
-        // we have a non-matched part, it could have several characters. We need to insert them character
-        // by character, so that addToHtml can keep track of the position in the original string
-        addCharsWithDecoration(groups[i]);
-      else
-        // we have a matched part. In addition to the characters themselves, we add some decorating HTML.
-        addCharsWithDecoration(groups[i], '<span class="fuzzyMatch">', '</span>');
-    };
-
-    // call it another time so that a tag at the very last position is reinserted
-    addToHtml('');
-    return html.join('');
-  }
-
-  /** Singleton object that provides fast access to the Chrome history */
-  var historyCache = (function() {
-    var size = 20000;
-    var cachedHistory = null;
-
-    function use(callback) {
-      if (cachedHistory !== null)
-        return callback(cachedHistory);
-
-      chrome.history.search({ text: '', maxResults: size, startTime: 0 }, function(history) {
-        // sorting in ascending order, so we can push new items to the end later
-        history.sort(function(a, b) {
-          return (a.lastVisitTime|| 0) - (b.lastVisitTime || 0);
-        });
-        cachedHistory = history;
-        callback(history);
-      });
-
-      chrome.history.onVisited.addListener(function(item) {
-        // only cache newly visited sites
-        if (item.visitCount === 1)
-          cachedHistory.push(item);
-      });
-    }
-
-    return { use: use };
-  })();
-
-  // public interface
-  return {
-    FuzzyBookmarkCompleter: FuzzyBookmarkCompleter,
-    FuzzyHistoryCompleter: FuzzyHistoryCompleter,
-    FuzzyTabCompleter: FuzzyTabCompleter,
-    SmartKeywordCompleter: SmartKeywordCompleter,
-    DomainCompleter: DomainCompleter,
-    MultiCompleter: MultiCompleter
-  };
-})()
diff --git a/lib/domUtils.js b/lib/domUtils.js
deleted file mode 100644
index 4ab92682..00000000
--- a/lib/domUtils.js
+++ /dev/null
@@ -1,121 +0,0 @@
-var domUtils = {
-  /**
-   * Runs :callback if the DOM has loaded, otherwise runs it on load
-   */
-  documentReady: (function() {
-    var loaded = false;
-    window.addEventListener("DOMContentLoaded", function() { loaded = true; });
-    return function(callback) {
-      if (loaded)
-        callback();
-      else
-        window.addEventListener("DOMContentLoaded", callback);
-    };
-  })(),
-
-  /*
-   * Takes an array of XPath selectors, adds the necessary namespaces (currently only XHTML), and applies them
-   * to the document root. The namespaceResolver in evaluateXPath should be kept in sync with the namespaces
-   * here.
-   */
-  makeXPath: function(elementArray) {
-    var xpath = [];
-    for (var i in elementArray)
-      xpath.push("//" + elementArray[i], "//xhtml:" + elementArray[i]);
-    return xpath.join(" | ");
-  },
-
-  evaluateXPath: function(xpath, resultType) {
-    function namespaceResolver(namespace) {
-      return namespace == "xhtml" ? "http://www.w3.org/1999/xhtml" : null;
-    }
-    return document.evaluate(xpath, document.documentElement, namespaceResolver, resultType, null);
-  },
-
-  /**
-   * Returns the first visible clientRect of an element if it exists. Otherwise it returns null.
-   */
-  getVisibleClientRect: function(element) {
-    // Note: this call will be expensive if we modify the DOM in between calls.
-    var clientRects = element.getClientRects();
-    var clientRectsLength = clientRects.length;
-
-    for (var i = 0; i < clientRectsLength; i++) {
-      if (clientRects[i].top < -2 || clientRects[i].top >= window.innerHeight - 4 ||
-          clientRects[i].left < -2 || clientRects[i].left  >= window.innerWidth - 4)
-        continue;
-
-      if (clientRects[i].width < 3 || clientRects[i].height < 3)
-        continue;
-
-      // eliminate invisible elements (see test_harnesses/visibility_test.html)
-      var computedStyle = window.getComputedStyle(element, null);
-      if (computedStyle.getPropertyValue('visibility') != 'visible' ||
-          computedStyle.getPropertyValue('display') == 'none')
-        continue;
-
-      return clientRects[i];
-    }
-
-    for (var i = 0; i < clientRectsLength; i++) {
-      // If the link has zero dimensions, it may be wrapping visible
-      // but floated elements. Check for this.
-      if (clientRects[i].width == 0 || clientRects[i].height == 0) {
-        for (var j = 0, childrenCount = element.children.length; j < childrenCount; j++) {
-          var computedStyle = window.getComputedStyle(element.children[j], null);
-          // Ignore child elements which are not floated and not absolutely positioned for parent elements with zero width/height
-          if (computedStyle.getPropertyValue('float') == 'none' && computedStyle.getPropertyValue('position') != 'absolute')
-            continue;
-          var childClientRect = this.getVisibleClientRect(element.children[j]);
-          if (childClientRect === null)
-            continue;
-          return childClientRect;
-        }
-      }
-    };
-    return null;
-  },
-
-  /*
-   * Selectable means the element has a text caret; this is not the same as "focusable".
-   */
-  isSelectable: function(element) {
-    var selectableTypes = ["search", "text", "password"];
-    return (element.nodeName.toLowerCase() == "input" && selectableTypes.indexOf(element.type) >= 0) ||
-        element.nodeName.toLowerCase() == "textarea";
-  },
-
-  simulateSelect: function(element) {
-    element.focus();
-    // When focusing a textbox, put the selection caret at the end of the textbox's contents.
-    element.setSelectionRange(element.value.length, element.value.length);
-  },
-
-  simulateClick: function(element, modifiers) {
-    modifiers = modifiers || {};
-
-    var eventSequence = [ "mouseover", "mousedown", "mouseup", "click" ];
-    for (var i = 0; i < eventSequence.length; i++) {
-      var event = document.createEvent("MouseEvents");
-      event.initMouseEvent(eventSequence[i], true, true, window, 1, 0, 0, 0, 0, modifiers.ctrlKey, false, false,
-                           modifiers.metaKey, 0, null);
-      // Debugging note: Firefox will not execute the element's default action if we dispatch this click event,
-      // but Webkit will. Dispatching a click on an input box does not seem to focus it; we do that separately
-      element.dispatchEvent(event);
-    }
-  },
-
-  // momentarily flash a rectangular border to give user some visual feedback
-  flashRect: function(rect) {
-    var flashEl = document.createElement("div");
-    flashEl.id = "vimiumFlash";
-    flashEl.className = "vimiumReset";
-    flashEl.style.left = rect.left + window.scrollX + "px";
-    flashEl.style.top = rect.top  + window.scrollY  + "px";
-    flashEl.style.width = rect.width + "px";
-    flashEl.style.height = rect.height + "px";
-    document.body.appendChild(flashEl);
-    setTimeout(function() { flashEl.parentNode.removeChild(flashEl); }, 400);
-  },
-
-};
diff --git a/lib/dom_utils.js b/lib/dom_utils.js
new file mode 100644
index 00000000..4ab92682
--- /dev/null
+++ b/lib/dom_utils.js
@@ -0,0 +1,121 @@
+var domUtils = {
+  /**
+   * Runs :callback if the DOM has loaded, otherwise runs it on load
+   */
+  documentReady: (function() {
+    var loaded = false;
+    window.addEventListener("DOMContentLoaded", function() { loaded = true; });
+    return function(callback) {
+      if (loaded)
+        callback();
+      else
+        window.addEventListener("DOMContentLoaded", callback);
+    };
+  })(),
+
+  /*
+   * Takes an array of XPath selectors, adds the necessary namespaces (currently only XHTML), and applies them
+   * to the document root. The namespaceResolver in evaluateXPath should be kept in sync with the namespaces
+   * here.
+   */
+  makeXPath: function(elementArray) {
+    var xpath = [];
+    for (var i in elementArray)
+      xpath.push("//" + elementArray[i], "//xhtml:" + elementArray[i]);
+    return xpath.join(" | ");
+  },
+
+  evaluateXPath: function(xpath, resultType) {
+    function namespaceResolver(namespace) {
+      return namespace == "xhtml" ? "http://www.w3.org/1999/xhtml" : null;
+    }
+    return document.evaluate(xpath, document.documentElement, namespaceResolver, resultType, null);
+  },
+
+  /**
+   * Returns the first visible clientRect of an element if it exists. Otherwise it returns null.
+   */
+  getVisibleClientRect: function(element) {
+    // Note: this call will be expensive if we modify the DOM in between calls.
+    var clientRects = element.getClientRects();
+    var clientRectsLength = clientRects.length;
+
+    for (var i = 0; i < clientRectsLength; i++) {
+      if (clientRects[i].top < -2 || clientRects[i].top >= window.innerHeight - 4 ||
+          clientRects[i].left < -2 || clientRects[i].left  >= window.innerWidth - 4)
+        continue;
+
+      if (clientRects[i].width < 3 || clientRects[i].height < 3)
+        continue;
+
+      // eliminate invisible elements (see test_harnesses/visibility_test.html)
+      var computedStyle = window.getComputedStyle(element, null);
+      if (computedStyle.getPropertyValue('visibility') != 'visible' ||
+          computedStyle.getPropertyValue('display') == 'none')
+        continue;
+
+      return clientRects[i];
+    }
+
+    for (var i = 0; i < clientRectsLength; i++) {
+      // If the link has zero dimensions, it may be wrapping visible
+      // but floated elements. Check for this.
+      if (clientRects[i].width == 0 || clientRects[i].height == 0) {
+        for (var j = 0, childrenCount = element.children.length; j < childrenCount; j++) {
+          var computedStyle = window.getComputedStyle(element.children[j], null);
+          // Ignore child elements which are not floated and not absolutely positioned for parent elements with zero width/height
+          if (computedStyle.getPropertyValue('float') == 'none' && computedStyle.getPropertyValue('position') != 'absolute')
+            continue;
+          var childClientRect = this.getVisibleClientRect(element.children[j]);
+          if (childClientRect === null)
+            continue;
+          return childClientRect;
+        }
+      }
+    };
+    return null;
+  },
+
+  /*
+   * Selectable means the element has a text caret; this is not the same as "focusable".
+   */
+  isSelectable: function(element) {
+    var selectableTypes = ["search", "text", "password"];
+    return (element.nodeName.toLowerCase() == "input" && selectableTypes.indexOf(element.type) >= 0) ||
+        element.nodeName.toLowerCase() == "textarea";
+  },
+
+  simulateSelect: function(element) {
+    element.focus();
+    // When focusing a textbox, put the selection caret at the end of the textbox's contents.
+    element.setSelectionRange(element.value.length, element.value.length);
+  },
+
+  simulateClick: function(element, modifiers) {
+    modifiers = modifiers || {};
+
+    var eventSequence = [ "mouseover", "mousedown", "mouseup", "click" ];
+    for (var i = 0; i < eventSequence.length; i++) {
+      var event = document.createEvent("MouseEvents");
+      event.initMouseEvent(eventSequence[i], true, true, window, 1, 0, 0, 0, 0, modifiers.ctrlKey, false, false,
+                           modifiers.metaKey, 0, null);
+      // Debugging note: Firefox will not execute the element's default action if we dispatch this click event,
+      // but Webkit will. Dispatching a click on an input box does not seem to focus it; we do that separately
+      element.dispatchEvent(event);
+    }
+  },
+
+  // momentarily flash a rectangular border to give user some visual feedback
+  flashRect: function(rect) {
+    var flashEl = document.createElement("div");
+    flashEl.id = "vimiumFlash";
+    flashEl.className = "vimiumReset";
+    flashEl.style.left = rect.left + window.scrollX + "px";
+    flashEl.style.top = rect.top  + window.scrollY  + "px";
+    flashEl.style.width = rect.width + "px";
+    flashEl.style.height = rect.height + "px";
+    document.body.appendChild(flashEl);
+    setTimeout(function() { flashEl.parentNode.removeChild(flashEl); }, 400);
+  },
+
+};
diff --git a/lib/keyboardUtils.js b/lib/keyboardUtils.js
deleted file mode 100644
index 52544c73..00000000
--- a/lib/keyboardUtils.js
+++ /dev/null
@@ -1,66 +0,0 @@
-var keyCodes = {
-  ESC: 27, backspace: 8, deleteKey: 46, enter: 13, space: 32, shiftKey: 16, f1: 112, f12: 123, tab: 9
-};
-var keyNames = { 37: "left", 38: "up", 39: "right", 40: "down" }
-
-// This is a mapping of the incorrect keyIdentifiers generated by Webkit on Windows during keydown events to
-// the correct identifiers, which are correctly generated on Mac. We require this mapping to properly handle
-// these keys on Windows. See https://bugs.webkit.org/show_bug.cgi?id=19906 for more details.
-var keyIdentifierCorrectionMap = {
-  "U+00C0": ["U+0060", "U+007E"], // `~
-  "U+00BD": ["U+002D", "U+005F"], // -_
-  "U+00BB": ["U+003D", "U+002B"], // =+
-  "U+00DB": ["U+005B", "U+007B"], // [{
-  "U+00DD": ["U+005D", "U+007D"], // ]}
-  "U+00DC": ["U+005C", "U+007C"], // \|
-  "U+00BA": ["U+003B", "U+003A"], // ;:
-  "U+00DE": ["U+0027", "U+0022"], // '"
-  "U+00BC": ["U+002C", "U+003C"], // ,<
-  "U+00BE": ["U+002E", "U+003E"], // .>
-  "U+00BF": ["U+002F", "U+003F"] // /?
-};
-
-var platform;
-if (navigator.userAgent.indexOf("Mac") != -1)
-  platform = "Mac";
-else if (navigator.userAgent.indexOf("Linux") != -1)
-  platform = "Linux";
-else
-  platform = "Windows";
-
-function getKeyChar(event) {
-    // Not a letter
-    if (event.keyIdentifier.slice(0, 2) != "U+") {
-        // Named key
-        if (keyNames[event.keyCode]) {
-          return keyNames[event.keyCode];
-        }
-        // F-key
-        if (event.keyCode >= keyCodes.f1 && event.keyCode <= keyCodes.f12) {
-          return "f" + (1 + event.keyCode - keyCodes.f1);
-        }
-        return "";
-    }
-    var keyIdentifier = event.keyIdentifier;
-    // On Windows, the keyIdentifiers for non-letter keys are incorrect. See
-    // https://bugs.webkit.org/show_bug.cgi?id=19906 for more details.
-    if ((platform == "Windows" || platform == "Linux") && keyIdentifierCorrectionMap[keyIdentifier]) {
-      correctedIdentifiers = keyIdentifierCorrectionMap[keyIdentifier];
-      keyIdentifier = event.shiftKey ? correctedIdentifiers[1] : correctedIdentifiers[0];
-    }
-    var unicodeKeyInHex = "0x" + keyIdentifier.substring(2);
-    var character = String.fromCharCode(parseInt(unicodeKeyInHex)).toLowerCase();
-    return event.shiftKey ? character.toUpperCase() : character;
-}
-
-function isPrimaryModifierKey(event) {
-  if (platform == "Mac")
-    return event.metaKey;
-  else
-    return event.ctrlKey;
-}
-
-function isEscape(event) {
-  return event.keyCode == keyCodes.ESC ||
-    (event.ctrlKey && getKeyChar(event) == '['); // c-[ is mapped to ESC in Vim by default.
-}
diff --git a/lib/keyboard_utils.js b/lib/keyboard_utils.js
new file mode 100644
index 00000000..52544c73
--- /dev/null
+++ b/lib/keyboard_utils.js
@@ -0,0 +1,66 @@
+var keyCodes = {
+  ESC: 27, backspace: 8, deleteKey: 46, enter: 13, space: 32, shiftKey: 16, f1: 112, f12: 123, tab: 9
+};
+var keyNames = { 37: "left", 38: "up", 39: "right", 40: "down" }
+
+// This is a mapping of the incorrect keyIdentifiers generated by Webkit on Windows during keydown events to
+// the correct identifiers, which are correctly generated on Mac. We require this mapping to properly handle
+// these keys on Windows. See https://bugs.webkit.org/show_bug.cgi?id=19906 for more details.
+var keyIdentifierCorrectionMap = {
+  "U+00C0": ["U+0060", "U+007E"], // `~
+  "U+00BD": ["U+002D", "U+005F"], // -_
+  "U+00BB": ["U+003D", "U+002B"], // =+
+  "U+00DB": ["U+005B", "U+007B"], // [{
+  "U+00DD": ["U+005D", "U+007D"], // ]}
+  "U+00DC": ["U+005C", "U+007C"], // \|
+  "U+00BA": ["U+003B", "U+003A"], // ;:
+  "U+00DE": ["U+0027", "U+0022"], // '"
+  "U+00BC": ["U+002C", "U+003C"], // ,<
+  "U+00BE": ["U+002E", "U+003E"], // .>
+  "U+00BF": ["U+002F", "U+003F"] // /?
+};
+
+var platform;
+if (navigator.userAgent.indexOf("Mac") != -1)
+  platform = "Mac";
+else if (navigator.userAgent.indexOf("Linux") != -1)
+  platform = "Linux";
+else
+  platform = "Windows";
+
+function getKeyChar(event) {
+    // Not a letter
+    if (event.keyIdentifier.slice(0, 2) != "U+") {
+        // Named key
+        if (keyNames[event.keyCode]) {
+          return keyNames[event.keyCode];
+        }
+        // F-key
+        if (event.keyCode >= keyCodes.f1 && event.keyCode <= keyCodes.f12) {
+          return "f" + (1 + event.keyCode - keyCodes.f1);
+        }
+        return "";
+    }
+    var keyIdentifier = event.keyIdentifier;
+    // On Windows, the keyIdentifiers for non-letter keys are incorrect. See
+    // https://bugs.webkit.org/show_bug.cgi?id=19906 for more details.
+    if ((platform == "Windows" || platform == "Linux") && keyIdentifierCorrectionMap[keyIdentifier]) {
+      correctedIdentifiers = keyIdentifierCorrectionMap[keyIdentifier];
+      keyIdentifier = event.shiftKey ? correctedIdentifiers[1] : correctedIdentifiers[0];
+    }
+    var unicodeKeyInHex = "0x" + keyIdentifier.substring(2);
+    var character = String.fromCharCode(parseInt(unicodeKeyInHex)).toLowerCase();
+    return event.shiftKey ? character.toUpperCase() : character;
+}
+
+function isPrimaryModifierKey(event) {
+  if (platform == "Mac")
+    return event.metaKey;
+  else
+    return event.ctrlKey;
+}
+
+function isEscape(event) {
+  return event.keyCode == keyCodes.ESC ||
+    (event.ctrlKey && getKeyChar(event) == '['); // c-[ is mapped to ESC in Vim by default.
+}
diff --git a/linkHints.js b/linkHints.js
deleted file mode 100644
index 7d6b431f..00000000
--- a/linkHints.js
+++ /dev/null
@@ -1,552 +0,0 @@
-/*
- * This implements link hinting. Typing "F" will enter link-hinting mode, where all clickable items on the
- * page have a hint marker displayed containing a sequence of letters. Typing those letters will select a link.
- *
- * In our 'default' mode, the characters we use to show link hints are a user-configurable option. By default
- * they're the home row.  The CSS which is used on the link hints is also a configurable option.
- *
- * In 'filter' mode, our link hints are numbers, and the user can narrow down the range of possibilities by
- * typing the text of the link itself.
- */
-var linkHints = {
-  hintMarkers: [],
-  hintMarkerContainingDiv: null,
-  shouldOpenInNewTab: false,
-  shouldOpenWithQueue: false,
-  // function that does the appropriate action on the selected link
-  linkActivator: undefined,
-  // While in delayMode, all keypresses have no effect.
-  delayMode: false,
-  // Handle the link hinting marker generation and matching. Must be initialized after settings have been
-  // loaded, so that we can retrieve the option setting.
-  markerMatcher: undefined,
-
-  /*
-   * To be called after linkHints has been generated from linkHintsBase.
-   */
-  init: function() {
-    this.onKeyDownInMode = this.onKeyDownInMode.bind(this);
-    this.markerMatcher = settings.get('filterLinkHints') ? filterHints : alphabetHints;
-  },
-
-  /*
-   * Generate an XPath describing what a clickable element is.
-   * The final expression will be something like "//button | //xhtml:button | ..."
-   * We use translate() instead of lower-case() because Chrome only supports XPath 1.0.
-   */
-  clickableElementsXPath: domUtils.makeXPath(["a", "area[@href]", "textarea", "button", "select",
-                             "input[not(@type='hidden' or @disabled or @readonly)]",
-                             "*[@onclick or @tabindex or @role='link' or @role='button' or contains(@class, 'button') or " +
-                             "@contenteditable='' or translate(@contenteditable, 'TRUE', 'true')='true']"]),
-
-  // We need this as a top-level function because our command system doesn't yet support arguments.
-  activateModeToOpenInNewTab: function() { this.activateMode(true, false, false); },
-
-  activateModeToCopyLinkUrl: function() { this.activateMode(null, false, true); },
-
-  activateModeWithQueue: function() { this.activateMode(true, true, false); },
-
-  activateMode: function(openInNewTab, withQueue, copyLinkUrl) {
-    if (!document.getElementById('vimiumLinkHintCss'))
-      // linkHintCss is declared by vimiumFrontend.js and contains the user supplied css overrides.
-      addCssToPage(linkHintCss, 'vimiumLinkHintCss');
-    this.setOpenLinkMode(openInNewTab, withQueue, copyLinkUrl);
-    this.buildLinkHints();
-    handlerStack.push({ // handlerStack is declared by vimiumFrontend.js
-      keydown: this.onKeyDownInMode,
-      // trap all key events
-      keypress: function() { return false; },
-      keyup: function() { return false; }
-    });
-  },
-
-  setOpenLinkMode: function(openInNewTab, withQueue, copyLinkUrl) {
-    this.shouldOpenInNewTab = openInNewTab;
-    this.shouldOpenWithQueue = withQueue;
-
-    if (openInNewTab || withQueue) {
-      if (openInNewTab)
-        HUD.show("Open link in new tab");
-      else if (withQueue)
-        HUD.show("Open multiple links in a new tab");
-      this.linkActivator = function(link) {
-        // When "clicking" on a link, dispatch the event with the appropriate meta key (CMD on Mac, CTRL on windows)
-        // to open it in a new tab if necessary.
-        domUtils.simulateClick(link, { metaKey: platform == "Mac", ctrlKey: platform != "Mac" });
-      }
-    } else if (copyLinkUrl) {
-      HUD.show("Copy link URL to Clipboard");
-      this.linkActivator = function(link) {
-        chrome.extension.sendRequest({handler: 'copyToClipboard', data: link.href});
-      }
-    } else {
-      HUD.show("Open link in current tab");
-      // When we're opening the link in the current tab, don't navigate to the selected link immediately;
-      // we want to give the user some time to notice which link has received focus.
-      this.linkActivator = function(link) {
-        setTimeout(domUtils.simulateClick.bind(domUtils, link), 400);
-      }
-    }
-  },
-
-  /*
-   * Builds and displays link hints for every visible clickable item on the page.
-   */
-  buildLinkHints: function() {
-    var visibleElements = this.getVisibleClickableElements();
-    this.hintMarkers = this.markerMatcher.getHintMarkers(visibleElements);
-
-    // Note(philc): Append these markers as top level children instead of as child nodes to the link itself,
-    // because some clickable elements cannot contain children, e.g. submit buttons. This has the caveat
-    // that if you scroll the page and the link has position=fixed, the marker will not stay fixed.
-    // Also note that adding these nodes to document.body all at once is significantly faster than one-by-one.
-    this.hintMarkerContainingDiv = document.createElement("div");
-    this.hintMarkerContainingDiv.id = "vimiumHintMarkerContainer";
-    this.hintMarkerContainingDiv.className = "vimiumReset";
-    for (var i = 0; i < this.hintMarkers.length; i++)
-      this.hintMarkerContainingDiv.appendChild(this.hintMarkers[i]);
-
-    // sometimes this is triggered before documentElement is created
-    // TODO(int3): fail more gracefully?
-    if (document.documentElement)
-      document.documentElement.appendChild(this.hintMarkerContainingDiv);
-    else
-      this.deactivateMode();
-  },
-
-  /*
-   * Returns all clickable elements that are not hidden and are in the current viewport.
-   * We prune invisible elements partly for performance reasons, but moreso it's to decrease the number
-   * of digits needed to enumerate all of the links on screen.
-   */
-  getVisibleClickableElements: function() {
-    var resultSet = domUtils.evaluateXPath(this.clickableElementsXPath, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE);
-
-    var visibleElements = [];
-
-    // Find all visible clickable elements.
-    for (var i = 0, count = resultSet.snapshotLength; i < count; i++) {
-      var element = resultSet.snapshotItem(i);
-      var clientRect = domUtils.getVisibleClientRect(element, clientRect);
-      if (clientRect !== null)
-        visibleElements.push({element: element, rect: clientRect});
-
-      if (element.localName === "area") {
-        var map = element.parentElement;
-        if (!map) continue;
-        var img = document.querySelector("img[usemap='#" + map.getAttribute("name") + "']");
-        if (!img) continue;
-        var imgClientRects = img.getClientRects();
-        if (imgClientRects.length == 0) continue;
-        var c = element.coords.split(/,/);
-        var coords = [parseInt(c[0], 10), parseInt(c[1], 10), parseInt(c[2], 10), parseInt(c[3], 10)];
-        var rect = {
-          top: imgClientRects[0].top + coords[1],
-          left: imgClientRects[0].left + coords[0],
-          right: imgClientRects[0].left + coords[2],
-          bottom: imgClientRects[0].top + coords[3],
-          width: coords[2] - coords[0],
-          height: coords[3] - coords[1]
-        };
-
-        visibleElements.push({element: element, rect: rect});
-      }
-    }
-    return visibleElements;
-  },
-
-  /*
-   * Handles shift and esc keys. The other keys are passed to markerMatcher.matchHintsByKey.
-   */
-  onKeyDownInMode: function(event) {
-    if (this.delayMode)
-      return;
-
-    if (event.keyCode == keyCodes.shiftKey && this.shouldOpenInNewTab !== null) {
-      // Toggle whether to open link in a new or current tab.
-      this.setOpenLinkMode(!this.shouldOpenInNewTab, this.shouldOpenWithQueue, false);
-      handlerStack.push({
-        keyup: function(event) {
-          if (event.keyCode !== keyCodes.shiftKey) return;
-          linkHints.setOpenLinkMode(!linkHints.shouldOpenInNewTab, linkHints.shouldOpenWithQueue, false);
-          handlerStack.pop();
-        }
-      });
-    }
-
-    // TODO(philc): Ignore keys that have modifiers.
-    if (isEscape(event)) {
-      this.deactivateMode();
-    } else {
-      var keyResult = this.markerMatcher.matchHintsByKey(event, this.hintMarkers);
-      var linksMatched = keyResult.linksMatched;
-      var delay = keyResult.delay !== undefined ? keyResult.delay : 0;
-      if (linksMatched.length == 0) {
-        this.deactivateMode();
-      } else if (linksMatched.length == 1) {
-        this.activateLink(linksMatched[0], delay);
-      } else {
-        for (var i in this.hintMarkers)
-          this.hideMarker(this.hintMarkers[i]);
-        for (var i in linksMatched)
-          this.showMarker(linksMatched[i], this.markerMatcher.hintKeystrokeQueue.length);
-      }
-    }
-  },
-
-  /*
-   * When only one link hint remains, this function activates it in the appropriate way.
-   */
-  activateLink: function(matchedLink, delay) {
-    this.delayMode = true;
-    var clickEl = matchedLink.clickableItem;
-    if (domUtils.isSelectable(clickEl)) {
-      domUtils.simulateSelect(clickEl);
-      this.deactivateMode(delay, function() { linkHints.delayMode = false; });
-    } else {
-      // TODO figure out which other input elements should not receive focus
-      if (clickEl.nodeName.toLowerCase() === 'input' && clickEl.type !== 'button')
-        clickEl.focus();
-      domUtils.flashRect(matchedLink.rect);
-      this.linkActivator(clickEl);
-      if (this.shouldOpenWithQueue) {
-        this.deactivateMode(delay, function() {
-          linkHints.delayMode = false;
-          linkHints.activateModeWithQueue();
-        });
-      } else {
-        this.deactivateMode(delay, function() { linkHints.delayMode = false; });
-      }
-    }
-  },
-
-  /*
-   * Shows the marker, highlighting matchingCharCount characters.
-   */
-  showMarker: function(linkMarker, matchingCharCount) {
-    linkMarker.style.display = "";
-    for (var j = 0, count = linkMarker.childNodes.length; j < count; j++)
-      (j < matchingCharCount) ? linkMarker.childNodes[j].classList.add("matchingCharacter") :
-                                linkMarker.childNodes[j].classList.remove("matchingCharacter");
-  },
-
-  hideMarker: function(linkMarker) {
-    linkMarker.style.display = "none";
-  },
-
-  /*
-   * If called without arguments, it executes immediately.  Othewise, it
-   * executes after 'delay' and invokes 'callback' when it is finished.
-   */
-  deactivateMode: function(delay, callback) {
-    function deactivate() {
-      if (linkHints.markerMatcher.deactivate)
-        linkHints.markerMatcher.deactivate();
-      if (linkHints.hintMarkerContainingDiv)
-        linkHints.hintMarkerContainingDiv.parentNode.removeChild(linkHints.hintMarkerContainingDiv);
-      linkHints.hintMarkerContainingDiv = null;
-      linkHints.hintMarkers = [];
-      handlerStack.pop();
-      HUD.hide();
-    }
-    // we invoke the deactivate() function directly instead of using setTimeout(callback, 0) so that
-    // deactivateMode can be tested synchronously
-    if (!delay) {
-      deactivate();
-      if (callback) callback();
-    } else {
-      setTimeout(function() { deactivate(); if (callback) callback(); }, delay);
-    }
-  },
-
-};
-
-var alphabetHints = {
-  hintKeystrokeQueue: [],
-  logXOfBase: function(x, base) { return Math.log(x) / Math.log(base); },
-
-  getHintMarkers: function(visibleElements) {
-    var hintStrings = this.hintStrings(visibleElements.length);
-    var hintMarkers = [];
-    for (var i = 0, count = visibleElements.length; i < count; i++) {
-      var marker = hintUtils.createMarkerFor(visibleElements[i]);
-      marker.hintString = hintStrings[i];
-      marker.innerHTML = hintUtils.spanWrap(marker.hintString.toUpperCase());
-      hintMarkers.push(marker);
-    }
-
-    return hintMarkers;
-  },
-
-  /*
-   * Returns a list of hint strings which will uniquely identify the given number of links. The hint strings
-   * may be of different lengths.
-   */
-  hintStrings: function(linkCount) {
-    var linkHintCharacters = settings.get("linkHintCharacters");
-    // Determine how many digits the link hints will require in the worst case. Usually we do not need
-    // all of these digits for every link single hint, so we can show shorter hints for a few of the links.
-    var digitsNeeded = Math.ceil(this.logXOfBase(linkCount, linkHintCharacters.length));
-    // Short hints are the number of hints we can possibly show which are (digitsNeeded - 1) digits in length.
-    var shortHintCount = Math.floor(
-        (Math.pow(linkHintCharacters.length, digitsNeeded) - linkCount) /
-        linkHintCharacters.length);
-    var longHintCount = linkCount - shortHintCount;
-
-    var hintStrings = [];
-
-    if (digitsNeeded > 1)
-      for (var i = 0; i < shortHintCount; i++)
-        hintStrings.push(this.numberToHintString(i, digitsNeeded - 1, linkHintCharacters));
-
-    var start = shortHintCount * linkHintCharacters.length;
-    for (var i = start; i < start + longHintCount; i++)
-      hintStrings.push(this.numberToHintString(i, digitsNeeded, linkHintCharacters));
-
-    return this.shuffleHints(hintStrings, linkHintCharacters.length);
-  },
-
-  /*
-   * This shuffles the given set of hints so that they're scattered -- hints starting with the same character
-   * will be spread evenly throughout the array.
-   */
-  shuffleHints: function(hints, characterSetLength) {
-    var buckets = [], i = 0;
-    for (i = 0; i < characterSetLength; i++)
-      buckets[i] = []
-    for (i = 0; i < hints.length; i++)
-      buckets[i % buckets.length].push(hints[i]);
-    var result = [];
-    for (i = 0; i < buckets.length; i++)
-      result = result.concat(buckets[i]);
-    return result;
-  },
-
-  /*
-   * Converts a number like "8" into a hint string like "JK". This is used to sequentially generate all of
-   * the hint text. The hint string will be "padded with zeroes" to ensure its length is equal to numHintDigits.
-   */
-  numberToHintString: function(number, numHintDigits, characterSet) {
-    var base = characterSet.length;
-    var hintString = [];
-    var remainder = 0;
-    do {
-      remainder = number % base;
-      hintString.unshift(characterSet[remainder]);
-      number -= remainder;
-      number /= Math.floor(base);
-    } while (number > 0);
-
-    // Pad the hint string we're returning so that it matches numHintDigits.
-    // Note: the loop body changes hintString.length, so the original length must be cached!
-    var hintStringLength = hintString.length;
-    for (var i = 0; i < numHintDigits - hintStringLength; i++)
-      hintString.unshift(characterSet[0]);
-
-    return hintString.join("");
-  },
-
-  matchHintsByKey: function(event, hintMarkers) {
-    var keyChar = getKeyChar(event);
-
-    if (event.keyCode == keyCodes.backspace || event.keyCode == keyCodes.deleteKey) {
-      if (!this.hintKeystrokeQueue.pop())
-        return { linksMatched: [] };
-    } else if (keyChar && settings.get('linkHintCharacters').indexOf(keyChar) >= 0) {
-      this.hintKeystrokeQueue.push(keyChar);
-    }
-
-    var matchString = this.hintKeystrokeQueue.join("");
-    var linksMatched = hintMarkers.filter(function(linkMarker) {
-      return linkMarker.hintString.indexOf(matchString) == 0;
-    });
-    return { linksMatched: linksMatched };
-  },
-
-  deactivate: function() {
-    this.hintKeystrokeQueue = [];
-  }
-
-};
-
-var filterHints = {
-  hintKeystrokeQueue: [],
-  linkTextKeystrokeQueue: [],
-  labelMap: {},
-
-  /*
-   * Generate a map of input element => label
-   */
-  generateLabelMap: function() {
-    var labels = document.querySelectorAll("label");
-    for (var i = 0, count = labels.length; i < count; i++) {
-      var forElement = labels[i].getAttribute("for");
-      if (forElement) {
-        var labelText = labels[i].textContent.trim();
-        // remove trailing : commonly found in labels
-        if (labelText[labelText.length-1] == ":")
-          labelText = labelText.substr(0, labelText.length-1);
-        this.labelMap[forElement] = labelText;
-      }
-    }
-  },
-
-  generateHintString: function(linkHintNumber) {
-    return (linkHintNumber + 1).toString();
-  },
-
-  generateLinkText: function(element) {
-    var linkText = "";
-    var showLinkText = false;
-    // toLowerCase is necessary as html documents return 'IMG'
-    // and xhtml documents return 'img'
-    var nodeName = element.nodeName.toLowerCase();
-
-    if (nodeName == "input") {
-      if (this.labelMap[element.id]) {
-        linkText = this.labelMap[element.id];
-        showLinkText = true;
-      } else if (element.type != "password") {
-        linkText = element.value;
-      }
-      // check if there is an image embedded in the <a> tag
-    } else if (nodeName == "a" && !element.textContent.trim()
-        && element.firstElementChild
-        && element.firstElementChild.nodeName.toLowerCase() == "img") {
-      linkText = element.firstElementChild.alt || element.firstElementChild.title;
-      if (linkText)
-        showLinkText = true;
-    } else {
-      linkText = element.textContent || element.innerHTML;
-    }
-    return { text: linkText, show: showLinkText };
-  },
-
-  renderMarker: function(marker) {
-    marker.innerHTML = hintUtils.spanWrap(marker.hintString +
-                                          (marker.showLinkText ? ": " + marker.linkText : ""));
-  },
-
-  getHintMarkers: function(visibleElements) {
-    this.generateLabelMap();
-    var hintMarkers = [];
-    for (var i = 0, count = visibleElements.length; i < count; i++) {
-      var marker = hintUtils.createMarkerFor(visibleElements[i]);
-      marker.hintString = this.generateHintString(i);
-      var linkTextObject = this.generateLinkText(marker.clickableItem);
-      marker.linkText = linkTextObject.text;
-      marker.showLinkText = linkTextObject.show;
-      this.renderMarker(marker);
-      hintMarkers.push(marker);
-    }
-    return hintMarkers;
-  },
-
-  matchHintsByKey: function(event, hintMarkers) {
-    var keyChar = getKeyChar(event);
-    var delay = 0;
-    var userIsTypingLinkText = false;
-
-    if (event.keyCode == keyCodes.enter) {
-      // activate the lowest-numbered link hint that is visible
-      for (var i = 0, count = hintMarkers.length; i < count; i++)
-        if (hintMarkers[i].style.display  != 'none') {
-          return { linksMatched: [ hintMarkers[i] ] };
-        }
-    } else if (event.keyCode == keyCodes.backspace || event.keyCode == keyCodes.deleteKey) {
-      // backspace clears hint key queue first, then acts on link text key queue.
-      // if both queues are empty. exit hinting mode
-      if (!this.hintKeystrokeQueue.pop() && !this.linkTextKeystrokeQueue.pop())
-          return { linksMatched: [] };
-    } else if (keyChar) {
-      if (/[0-9]/.test(keyChar))
-        this.hintKeystrokeQueue.push(keyChar);
-      else {
-        // since we might renumber the hints, the current hintKeyStrokeQueue
-        // should be rendered invalid (i.e. reset).
-        this.hintKeystrokeQueue = [];
-        this.linkTextKeystrokeQueue.push(keyChar);
-        userIsTypingLinkText = true;
-      }
-    }
-
-    // at this point, linkTextKeystrokeQueue and hintKeystrokeQueue have been updated to reflect the latest
-    // input. use them to filter the link hints accordingly.
-    var linksMatched = this.filterLinkHints(hintMarkers);
-    var matchString = this.hintKeystrokeQueue.join("");
-    linksMatched = linksMatched.filter(function(linkMarker) {
-      return !linkMarker.filtered && linkMarker.hintString.indexOf(matchString) == 0;
-    });
-
-    if (linksMatched.length == 1 && userIsTypingLinkText) {
-      // In filter mode, people tend to type out words past the point
-      // needed for a unique match. Hence we should avoid passing
-      // control back to command mode immediately after a match is found.
-      var delay = 200;
-    }
-
-    return { linksMatched: linksMatched, delay: delay };
-  },
-
-  /*
-   * Marks the links that do not match the linkText search string with the 'filtered' DOM property. Renumbers
-   * the remainder if necessary.
-   */
-  filterLinkHints: function(hintMarkers) {
-    var linksMatched = [];
-    var linkSearchString = this.linkTextKeystrokeQueue.join("");
-
-    for (var i = 0; i < hintMarkers.length; i++) {
-      var linkMarker = hintMarkers[i];
-      var matchedLink = linkMarker.linkText.toLowerCase().indexOf(linkSearchString.toLowerCase()) >= 0;
-
-      if (!matchedLink) {
-        linkMarker.filtered = true;
-      } else {
-        linkMarker.filtered = false;
-        var oldHintString = linkMarker.hintString;
-        linkMarker.hintString = this.generateHintString(linksMatched.length);
-        if (linkMarker.hintString != oldHintString)
-          this.renderMarker(linkMarker);
-        linksMatched.push(linkMarker);
-      }
-    }
-    return linksMatched;
-  },
-
-  deactivate: function(delay, callback) {
-    this.hintKeystrokeQueue = [];
-    this.linkTextKeystrokeQueue = [];
-    this.labelMap = {};
-  }
-
-};
-
-var hintUtils = {
-  /*
-   * Make each hint character a span, so that we can highlight the typed characters as you type them.
-   */
-  spanWrap: function(hintString) {
-    var innerHTML = [];
-    for (var i = 0; i < hintString.length; i++)
-      innerHTML.push("<span class='vimiumReset'>" + hintString[i] + "</span>");
-    return innerHTML.join("");
-  },
-
-  /*
-   * Creates a link marker for the given link.
-   */
-  createMarkerFor: function(link) {
-    var marker = document.createElement("div");
-    marker.className = "vimiumReset internalVimiumHintMarker vimiumHintMarker";
-    marker.clickableItem = link.element;
-
-    var clientRect = link.rect;
-    marker.style.left = clientRect.left + window.scrollX + "px";
-    marker.style.top = clientRect.top  + window.scrollY  + "px";
-
-    marker.rect = link.rect;
-
-    return marker;
-  }
-};
diff --git a/manifest.json b/manifest.json
index 01cfc7c7..a780fe5a 100644
--- a/manifest.json
+++ b/manifest.json
@@ -18,12 +18,12 @@
     {
       "matches": ["<all_urls>"],
       "js": ["lib/utils.js",
-             "lib/keyboardUtils.js",
-             "lib/domUtils.js",
+             "lib/keyboard_utils.js",
+             "lib/dom_utils.js",
              "lib/clipboard.js",
-             "linkHints.js",
-             "vomnibar.js",
-             "vimiumFrontend.js"
+             "content_scripts/link_hints.js",
+             "content_scripts/vomnibar.js",
+             "content_scripts/vimium_frontend.js"
             ],
       "css": ["vimium.css"],
       "run_at": "document_start",
diff --git a/options.html b/options.html
index 64399dc9..6dea5143 100644
--- a/options.html
+++ b/options.html
@@ -2,11 +2,11 @@
   <head>
     <title>Vimium Options</title>
     <script src="lib/utils.js"></script>
-    <script src="lib/keyboardUtils.js"></script>
-    <script src="lib/domUtils.js"></script>
+    <script src="lib/keyboard_utils.js"></script>
+    <script src="lib/dom_utils.js"></script>
     <script src="lib/clipboard.js"></script>
-    <script src="linkHints.js"></script>
-    <script src="vimiumFrontend.js"></script>
+    <script src="content_scripts/link_hints.js"></script>
+    <script src="content_scripts/vimium_frontend.js"></script>
     <style type="text/css" media="screen">
       body {
         font-family:"helvetica neue", "helvetica", "arial", "sans";
diff --git a/test_harnesses/automated.html b/test_harnesses/automated.html
index ef619583..a3031a27 100644
--- a/test_harnesses/automated.html
+++ b/test_harnesses/automated.html
@@ -28,11 +28,11 @@
     </style>
     <link rel="stylesheet" type="text/css" href="../vimium.css" />
     <script type="text/javascript" src="../lib/utils.js"></script>
-    <script type="text/javascript" src="../lib/keyboardUtils.js"></script>
-    <script type="text/javascript" src="../lib/domUtils.js"></script>
-    <script type="text/javascript" src="../linkHints.js"></script>
+    <script type="text/javascript" src="../lib/keyboard_utils.js"></script>
+    <script type="text/javascript" src="../lib/dom_utils.js"></script>
+    <script type="text/javascript" src="../content_scripts/link_hints.js"></script>
     <script type="text/javascript" src="../lib/clipboard.js"></script>
-    <script type="text/javascript" src="../vimiumFrontend.js"></script>
+    <script type="text/javascript" src="../content_scripts/vimium_frontend.js"></script>
     <script type="text/javascript" src="shoulda.js/shoulda.js"></script>
     <script type="text/javascript">
       /*
diff --git a/vimiumFrontend.js b/vimiumFrontend.js
deleted file mode 100644
index 31bb2b44..00000000
--- a/vimiumFrontend.js
+++ /dev/null
@@ -1,1182 +0,0 @@
-/*
- * This content script takes input from its webpage and executes commands locally on behalf of the background
- * page. It must be run prior to domReady so that we perform some operations very early. We tell the
- * background page that we're in domReady and ready to accept normal commands by connectiong to a port named
- * "domReady".
- */
-var getCurrentUrlHandlers = []; // function(url)
-
-var insertModeLock = null;
-var findMode = false;
-var findModeQuery = { rawQuery: "" };
-var findModeQueryHasResults = false;
-var findModeAnchorNode = null;
-var isShowingHelpDialog = false;
-var handlerStack = [];
-var keyPort;
-// Users can disable Vimium on URL patterns via the settings page.
-var isEnabledForUrl = true;
-// The user's operating system.
-var currentCompletionKeys;
-var validFirstKeys;
-var linkHintCss;
-var activatedElement;
-
-// The types in <input type="..."> that we consider for focusInput command. Right now this is recalculated in
-// each content script. Alternatively we could calculate it once in the background page and use a request to
-// fetch it each time.
-//
-// Should we include the HTML5 date pickers here?
-
-// The corresponding XPath for such elements.
-var textInputXPath = (function() {
-  var textInputTypes = ["text", "search", "email", "url", "number", "password"];
-  var inputElements = ["input[" +
-    "(" + textInputTypes.map(function(type) {return '@type="' + type + '"'}).join(" or ") + "or not(@type))" +
-    " and not(@disabled or @readonly)]",
-    "textarea", "*[@contenteditable='' or translate(@contenteditable, 'TRUE', 'true')='true']"];
-  return domUtils.makeXPath(inputElements);
-})();
-
-/**
- * settings provides a browser-global localStorage-backed dict. get() and set() are synchronous, but load()
- * must be called beforehand to ensure get() will return up-to-date values.
- */
-var settings = {
-  port: null,
-  values: {},
-  loadedValues: 0,
-  valuesToLoad: ["scrollStepSize", "linkHintCharacters", "filterLinkHints", "hideHud", "previousPatterns",
-      "nextPatterns", "findModeRawQuery"],
-  isLoaded: false,
-  eventListeners: {},
-
-  init: function () {
-    this.port = chrome.extension.connect({ name: "settings" });
-    this.port.onMessage.addListener(this.receiveMessage);
-  },
-
-  get: function (key) { return this.values[key]; },
-
-  set: function (key, value) {
-    if (!this.port)
-      this.init();
-
-    this.values[key] = value;
-    this.port.postMessage({ operation: "set", key: key, value: value });
-  },
-
-  load: function() {
-    if (!this.port)
-      this.init();
-
-    for (var i in this.valuesToLoad) {
-      this.port.postMessage({ operation: "get", key: this.valuesToLoad[i] });
-    }
-  },
-
-  receiveMessage: function (args) {
-    // not using 'this' due to issues with binding on callback
-    settings.values[args.key] = args.value;
-    // since load() can be called more than once, loadedValues can be greater than valuesToLoad, but we test
-    // for equality so initializeOnReady only runs once
-    if (++settings.loadedValues == settings.valuesToLoad.length) {
-      settings.isLoaded = true;
-      var listener;
-      while (listener = settings.eventListeners["load"].pop())
-        listener();
-    }
-  },
-
-  addEventListener: function(eventName, callback) {
-    if (!(eventName in this.eventListeners))
-      this.eventListeners[eventName] = [];
-    this.eventListeners[eventName].push(callback);
-  },
-
-};
-
-/*
- * Give this frame a unique id.
- */
-frameId = Math.floor(Math.random()*999999999)
-
-var hasModifiersRegex = /^<([amc]-)+.>/;
-
-/*
- * Complete initialization work that sould be done prior to DOMReady.
- */
-function initializePreDomReady() {
-  settings.addEventListener("load", linkHints.init.bind(linkHints));
-  settings.load();
-
-  checkIfEnabledForUrl();
-
-  chrome.extension.sendRequest({handler: "getLinkHintCss"}, function (response) {
-    linkHintCss = response.linkHintCss;
-  });
-
-  refreshCompletionKeys();
-
-  // Send the key to the key handler in the background page.
-  keyPort = chrome.extension.connect({ name: "keyDown" });
-
-  chrome.extension.onRequest.addListener(function(request, sender, sendResponse) {
-    if (request.name == "hideUpgradeNotification") {
-      HUD.hideUpgradeNotification();
-    } else if (request.name == "showUpgradeNotification" && isEnabledForUrl) {
-      HUD.showUpgradeNotification(request.version);
-    } else if (request.name == "showHelpDialog") {
-      if (isShowingHelpDialog)
-        hideHelpDialog();
-      else
-        showHelpDialog(request.dialogHtml, request.frameId);
-    } else if (request.name == "focusFrame") {
-      if (frameId == request.frameId)
-        focusThisFrame(request.highlight);
-    } else if (request.name == "refreshCompletionKeys") {
-      refreshCompletionKeys(request);
-    }
-    sendResponse({}); // Free up the resources used by this open connection.
-  });
-
-  chrome.extension.onConnect.addListener(function(port, name) {
-    if (port.name == "executePageCommand") {
-      port.onMessage.addListener(function(args) {
-        if (frameId == args.frameId) {
-          if (args.passCountToFunction) {
-            utils.invokeCommandString(args.command, [args.count]);
-          } else {
-            for (var i = 0; i < args.count; i++) { utils.invokeCommandString(args.command); }
-          }
-        }
-
-        refreshCompletionKeys(args);
-      });
-    }
-    else if (port.name == "getScrollPosition") {
-      port.onMessage.addListener(function(args) {
-        var scrollPort = chrome.extension.connect({ name: "returnScrollPosition" });
-        scrollPort.postMessage({
-          scrollX: window.scrollX,
-          scrollY: window.scrollY,
-          currentTab: args.currentTab
-        });
-      });
-    } else if (port.name == "setScrollPosition") {
-      port.onMessage.addListener(function(args) {
-        if (args.scrollX > 0 || args.scrollY > 0) {
-          domUtils.documentReady(function() { window.scrollBy(args.scrollX, args.scrollY); });
-        }
-      });
-    } else if (port.name == "returnCurrentTabUrl") {
-      port.onMessage.addListener(function(args) {
-        if (getCurrentUrlHandlers.length > 0) { getCurrentUrlHandlers.pop()(args.url); }
-      });
-    } else if (port.name == "refreshCompletionKeys") {
-      port.onMessage.addListener(function (args) {
-        refreshCompletionKeys(args.completionKeys);
-      });
-    } else if (port.name == "getActiveState") {
-      port.onMessage.addListener(function(args) {
-        port.postMessage({ enabled: isEnabledForUrl });
-      });
-    } else if (port.name == "disableVimium") {
-      port.onMessage.addListener(function(args) { disableVimium(); });
-    }
-  });
-}
-
-/*
- * This is called once the background page has told us that Vimium should be enabled for the current URL.
- */
-function initializeWhenEnabled() {
-  document.addEventListener("keydown", onKeydown, true);
-  document.addEventListener("keypress", onKeypress, true);
-  document.addEventListener("keyup", onKeyup, true);
-  document.addEventListener("focus", onFocusCapturePhase, true);
-  document.addEventListener("blur", onBlurCapturePhase, true);
-  document.addEventListener("DOMActivate", onDOMActivate, true);
-  enterInsertModeIfElementIsFocused();
-}
-
-/*
- * Used to disable Vimium without needing to reload the page.
- * This is called if the current page's url is blacklisted using the popup UI.
- */
-function disableVimium() {
-  document.removeEventListener("keydown", onKeydown, true);
-  document.removeEventListener("keypress", onKeypress, true);
-  document.removeEventListener("keyup", onKeyup, true);
-  document.removeEventListener("focus", onFocusCapturePhase, true);
-  document.removeEventListener("blur", onBlurCapturePhase, true);
-  document.removeEventListener("DOMActivate", onDOMActivate, true);
-  isEnabledForUrl = false;
-}
-
-/*
- * The backend needs to know which frame has focus.
- */
-window.addEventListener("focus", function(e) {
-  // settings may have changed since the frame last had focus
-  settings.load();
-  chrome.extension.sendRequest({ handler: "frameFocused", frameId: frameId });
-});
-
-/*
- * Called from the backend in order to change frame focus.
- */
-function focusThisFrame(shouldHighlight) {
-  window.focus();
-  if (document.body && shouldHighlight) {
-    var borderWas = document.body.style.border;
-    document.body.style.border = '5px solid yellow';
-    setTimeout(function(){document.body.style.border = borderWas}, 200);
-  }
-}
-
-/*
- * Initialization tasks that must wait for the document to be ready.
- */
-function initializeOnDomReady() {
-  registerFrameIfSizeAvailable(window.top == window.self);
-
-  if (isEnabledForUrl)
-    enterInsertModeIfElementIsFocused();
-
-  // Tell the background page we're in the dom ready state.
-  chrome.extension.connect({ name: "domReady" });
-};
-
-// This is a little hacky but sometimes the size wasn't available on domReady?
-function registerFrameIfSizeAvailable (is_top) {
-  if (innerWidth != undefined && innerWidth != 0 && innerHeight != undefined && innerHeight != 0)
-    chrome.extension.sendRequest({ handler: "registerFrame", frameId: frameId,
-        area: innerWidth * innerHeight, is_top: is_top, total: frames.length + 1 });
-  else
-    setTimeout(function () { registerFrameIfSizeAvailable(is_top); }, 100);
-}
-
-/*
- * Enters insert mode if the currently focused element in the DOM is focusable.
- */
-function enterInsertModeIfElementIsFocused() {
-  if (document.activeElement && isEditable(document.activeElement) && !findMode)
-    enterInsertModeWithoutShowingIndicator(document.activeElement);
-}
-
-function onDOMActivate(event) {
-  activatedElement = event.target;
-}
-
-/**
- * activatedElement is different from document.activeElement -- the latter seems to be reserved mostly for
- * input elements. This mechanism allows us to decide whether to scroll a div or to scroll the whole document.
- */
-function scrollActivatedElementBy(direction, amount) {
-  // if this is called before domReady, just use the window scroll function
-  if (!document.body) {
-    if (direction === "x")
-      window.scrollBy(amount, 0);
-    else // "y"
-      window.scrollBy(0, amount);
-    return;
-  }
-
-  // TODO refactor and put this together with the code in getVisibleClientRect
-  function isRendered(element) {
-    var computedStyle = window.getComputedStyle(element, null);
-    return !(computedStyle.getPropertyValue('visibility') != 'visible' ||
-        computedStyle.getPropertyValue('display') == 'none');
-  }
-
-  if (!activatedElement || !isRendered(activatedElement))
-    activatedElement = document.body;
-
-  scrollName = direction === "x" ? "scrollLeft" : "scrollTop";
-
-  // Chrome does not report scrollHeight accurately for nodes with pseudo-elements of height 0 (bug 110149).
-  // Therefore we just try to increase scrollTop blindly -- if it fails we know we have reached the end of the
-  // content.
-  if (amount !== 0) {
-    var element = activatedElement;
-    do {
-      var oldScrollValue = element[scrollName];
-      element[scrollName] += amount;
-      var lastElement = element;
-      // we may have an orphaned element. if so, just scroll the body element.
-      element = element.parentElement || document.body;
-    } while(lastElement[scrollName] == oldScrollValue && lastElement != document.body);
-  }
-
-  // if the activated element has been scrolled completely offscreen, subsequent changes in its scroll
-  // position will not provide any more visual feedback to the user. therefore we deactivate it so that
-  // subsequent scrolls only move the parent element.
-  var rect = activatedElement.getBoundingClientRect();
-  if (rect.bottom < 0 || rect.top > window.innerHeight ||
-      rect.right < 0 || rect.left > window.innerWidth)
-    activatedElement = lastElement;
-}
-
-function scrollToBottom() { window.scrollTo(window.pageXOffset, document.body.scrollHeight); }
-function scrollToTop() { window.scrollTo(window.pageXOffset, 0); }
-function scrollToLeft() { window.scrollTo(0, window.pageYOffset); }
-function scrollToRight() { window.scrollTo(document.body.scrollWidth, window.pageYOffset); }
-function scrollUp() { scrollActivatedElementBy("y", -1 * settings.get("scrollStepSize")); }
-function scrollDown() { scrollActivatedElementBy("y", parseFloat(settings.get("scrollStepSize"))); }
-function scrollPageUp() { scrollActivatedElementBy("y", -1 * window.innerHeight / 2); }
-function scrollPageDown() { scrollActivatedElementBy("y", window.innerHeight / 2); }
-function scrollFullPageUp() { scrollActivatedElementBy("y", -window.innerHeight); }
-function scrollFullPageDown() { scrollActivatedElementBy("y", window.innerHeight); }
-function scrollLeft() { scrollActivatedElementBy("x", -1 * settings.get("scrollStepSize")); }
-function scrollRight() { scrollActivatedElementBy("x", parseFloat(settings.get("scrollStepSize"))); }
-
-function focusInput(count) {
-  var results = domUtils.evaluateXPath(textInputXPath, XPathResult.ORDERED_NODE_ITERATOR_TYPE);
-
-  var lastInputBox;
-  var i = 0;
-
-  while (i < count) {
-    var currentInputBox = results.iterateNext();
-    if (!currentInputBox) { break; }
-
-    if (domUtils.getVisibleClientRect(currentInputBox) === null)
-        continue;
-
-    lastInputBox = currentInputBox;
-
-    i += 1;
-  }
-
-  if (lastInputBox) { lastInputBox.focus(); }
-}
-
-function reload() { window.location.reload(); }
-function goBack(count) { history.go(-count); }
-function goForward(count) { history.go(count); }
-
-function goUp(count) {
-  var url = window.location.href;
-  if (url[url.length-1] == '/')
-    url = url.substring(0, url.length - 1);
-
-  var urlsplit = url.split('/');
-  // make sure we haven't hit the base domain yet
-  if (urlsplit.length > 3) {
-    urlsplit = urlsplit.slice(0, Math.max(3, urlsplit.length - count));
-    window.location.href = urlsplit.join('/');
-  }
-}
-
-function toggleViewSource() {
-  getCurrentUrlHandlers.push(toggleViewSourceCallback);
-
-  var getCurrentUrlPort = chrome.extension.connect({ name: "getCurrentTabUrl" });
-  getCurrentUrlPort.postMessage({});
-}
-
-function copyCurrentUrl() {
-  // TODO(ilya): When the following bug is fixed, revisit this approach of sending back to the background page
-  // to copy.
-  // http://code.google.com/p/chromium/issues/detail?id=55188
-  //getCurrentUrlHandlers.push(function (url) { Clipboard.copy(url); });
-  getCurrentUrlHandlers.push(function (url) { chrome.extension.sendRequest({ handler: "copyToClipboard", data: url }); });
-
-  // TODO(ilya): Convert to sendRequest.
-  var getCurrentUrlPort = chrome.extension.connect({ name: "getCurrentTabUrl" });
-  getCurrentUrlPort.postMessage({});
-
-  HUD.showForDuration("Yanked URL", 1000);
-}
-
-function toggleViewSourceCallback(url) {
-  if (url.substr(0, 12) == "view-source:")
-  {
-    url = url.substr(12, url.length - 12);
-  }
-  else { url = "view-source:" + url; }
-  chrome.extension.sendRequest({handler: "openUrlInNewTab", url: url, selected: true});
-}
-
-/**
- * Sends everything except i & ESC to the handler in background_page. i & ESC are special because they control
- * insert mode which is local state to the page. The key will be are either a single ascii letter or a
- * key-modifier pair, e.g. <c-a> for control a.
- *
- * Note that some keys will only register keydown events and not keystroke events, e.g. ESC.
- */
-function onKeypress(event) {
-  if (!bubbleEvent('keypress', event))
-    return;
-
-  var keyChar = "";
-
-  // Ignore modifier keys by themselves.
-  if (event.keyCode > 31) {
-    keyChar = String.fromCharCode(event.charCode);
-
-    // Enter insert mode when the user enables the native find interface.
-    if (keyChar == "f" && isPrimaryModifierKey(event)) {
-      enterInsertModeWithoutShowingIndicator();
-      return;
-    }
-
-    if (keyChar) {
-      if (findMode) {
-        handleKeyCharForFindMode(keyChar);
-        suppressEvent(event);
-      } else if (!isInsertMode() && !findMode) {
-        if (currentCompletionKeys.indexOf(keyChar) != -1)
-          suppressEvent(event);
-
-        keyPort.postMessage({keyChar:keyChar, frameId:frameId});
-      }
-    }
-  }
-}
-
-/**
- * Called whenever we receive a key event.  Each individual handler has the option to stop the event's
- * propagation by returning a falsy value.
- */
-function bubbleEvent(type, event) {
-  for (var i = handlerStack.length-1; i >= 0; i--) {
-    // We need to check for existence of handler because the last function call may have caused the release of
-    // more than one handler.
-    if (handlerStack[i] && handlerStack[i][type] && !handlerStack[i][type](event)) {
-      suppressEvent(event);
-      return false;
-    }
-  }
-  return true;
-}
-
-function suppressEvent(event) {
-  event.preventDefault();
-  event.stopPropagation();
-}
-
-function onKeydown(event) {
-  if (!bubbleEvent('keydown', event))
-    return;
-
-  var keyChar = "";
-
-  // handle special keys, and normal input keys with modifiers being pressed. don't handle shiftKey alone (to
-  // avoid / being interpreted as ?
-  if (((event.metaKey || event.ctrlKey || event.altKey) && event.keyCode > 31)
-      || event.keyIdentifier.slice(0, 2) != "U+") {
-    keyChar = getKeyChar(event);
-
-    if (keyChar != "") { // Again, ignore just modifiers. Maybe this should replace the keyCode>31 condition.
-      var modifiers = [];
-
-      if (event.shiftKey)
-          keyChar = keyChar.toUpperCase();
-      if (event.metaKey)
-          modifiers.push("m");
-      if (event.ctrlKey)
-          modifiers.push("c");
-      if (event.altKey)
-          modifiers.push("a");
-
-      for (var i in modifiers)
-          keyChar = modifiers[i] + "-" + keyChar;
-
-      if (modifiers.length > 0 || keyChar.length > 1)
-          keyChar = "<" + keyChar + ">";
-    }
-  }
-
-  if (isInsertMode() && isEscape(event)) {
-    // Note that we can't programmatically blur out of Flash embeds from Javascript.
-    if (!isEmbed(event.srcElement)) {
-      // Remove focus so the user can't just get himself back into insert mode by typing in the same input
-      // box.
-      if (isEditable(event.srcElement))
-        event.srcElement.blur();
-      exitInsertMode();
-      suppressEvent(event);
-    }
-  }
-  else if (findMode) {
-    if (isEscape(event)) {
-      handleEscapeForFindMode();
-      suppressEvent(event);
-    }
-    else if (event.keyCode == keyCodes.backspace || event.keyCode == keyCodes.deleteKey) {
-      handleDeleteForFindMode();
-      suppressEvent(event);
-    }
-    else if (event.keyCode == keyCodes.enter) {
-      handleEnterForFindMode();
-      suppressEvent(event);
-    }
-    else if (!modifiers) {
-      event.stopPropagation();
-    }
-  }
-  else if (isShowingHelpDialog && isEscape(event)) {
-    hideHelpDialog();
-  }
-  else if (!isInsertMode() && !findMode) {
-    if (keyChar) {
-      if (currentCompletionKeys.indexOf(keyChar) != -1)
-        suppressEvent(event);
-
-      keyPort.postMessage({keyChar:keyChar, frameId:frameId});
-    }
-    else if (isEscape(event)) {
-      keyPort.postMessage({keyChar:"<ESC>", frameId:frameId});
-    }
-  }
-
-  // Added to prevent propagating this event to other listeners if it's one that'll trigger a Vimium command.
-  // The goal is to avoid the scenario where Google Instant Search uses every keydown event to dump us
-  // back into the search box. As a side effect, this should also prevent overriding by other sites.
-  //
-  // Subject to internationalization issues since we're using keyIdentifier instead of charCode (in keypress).
-  //
-  // TOOD(ilya): Revisit this. Not sure it's the absolute best approach.
-  if (keyChar == "" && !isInsertMode() && (currentCompletionKeys.indexOf(getKeyChar(event)) != -1 ||
-      isValidFirstKey(getKeyChar(event))))
-    event.stopPropagation();
-}
-
-function onKeyup() {
-  if (!bubbleEvent('keyup', event))
-    return;
-}
-
-function checkIfEnabledForUrl() {
-  var url = window.location.toString();
-
-  chrome.extension.sendRequest({ handler: "isEnabledForUrl", url: url }, function (response) {
-    isEnabledForUrl = response.isEnabledForUrl;
-    if (isEnabledForUrl)
-      initializeWhenEnabled();
-    else if (HUD.isReady())
-      // Quickly hide any HUD we might already be showing, e.g. if we entered insert mode on page load.
-      HUD.hide();
-  });
-}
-
-function refreshCompletionKeys(response) {
-  if (response) {
-    currentCompletionKeys = response.completionKeys;
-
-    if (response.validFirstKeys)
-      validFirstKeys = response.validFirstKeys;
-  }
-  else {
-    chrome.extension.sendRequest({ handler: "getCompletionKeys" }, refreshCompletionKeys);
-  }
-}
-
-function isValidFirstKey(keyChar) {
-  return validFirstKeys[keyChar] || /[1-9]/.test(keyChar);
-}
-
-function onFocusCapturePhase(event) {
-  if (isFocusable(event.target) && !findMode)
-    enterInsertModeWithoutShowingIndicator(event.target);
-}
-
-function onBlurCapturePhase(event) {
-  if (isFocusable(event.target))
-    exitInsertMode(event.target);
-}
-
-/*
- * Returns true if the element is focusable. This includes embeds like Flash, which steal the keybaord focus.
- */
-function isFocusable(element) { return isEditable(element) || isEmbed(element); }
-
-/*
- * Embedded elements like Flash and quicktime players can obtain focus but cannot be programmatically
- * unfocused.
- */
-function isEmbed(element) { return ["embed", "object"].indexOf(element.nodeName.toLowerCase()) > 0; }
-
-/*
- * Input or text elements are considered focusable and able to receieve their own keyboard events,
- * and will enter enter mode if focused. Also note that the "contentEditable" attribute can be set on
- * any element which makes it a rich text editor, like the notes on jjot.com.
- */
-function isEditable(target) {
-  if (target.isContentEditable)
-    return true;
-  var nodeName = target.nodeName.toLowerCase();
-  // use a blacklist instead of a whitelist because new form controls are still being implemented for html5
-  var noFocus = ["radio", "checkbox"];
-  if (nodeName == "input" && noFocus.indexOf(target.type) == -1)
-    return true;
-  var focusableElements = ["textarea", "select"];
-  return focusableElements.indexOf(nodeName) >= 0;
-}
-
-/*
- * Enters insert mode and show an "Insert mode" message. Showing the UI is only useful when entering insert
- * mode manually by pressing "i". In most cases we do not show any UI (enterInsertModeWithoutShowingIndicator)
- */
-function enterInsertMode(target) {
-  enterInsertModeWithoutShowingIndicator(target);
-  HUD.show("Insert mode");
-}
-
-/*
- * We cannot count on 'focus' and 'blur' events to happen sequentially. For example, if blurring element A
- * causes element B to come into focus, we may get "B focus" before "A blur". Thus we only leave insert mode
- * when the last editable element that came into focus -- which insertModeLock points to -- has been blurred.
- * If insert mode is entered manually (via pressing 'i'), then we set insertModeLock to 'undefined', and only
- * leave insert mode when the user presses <ESC>.
- */
-function enterInsertModeWithoutShowingIndicator(target) { insertModeLock = target; }
-
-function exitInsertMode(target) {
-  if (target === undefined || insertModeLock === target) {
-    insertModeLock = null;
-    HUD.hide();
-  }
-}
-
-function isInsertMode() { return insertModeLock !== null; }
-
-// should be called whenever rawQuery is modified.
-function updateFindModeQuery() {
-  // the query can be treated differently (e.g. as a plain string versus regex depending on the presence of
-  // escape sequences. '\' is the escape character and needs to be escaped itself to be used as a normal
-  // character. here we grep for the relevant escape sequences.
-  findModeQuery.isRegex = false;
-  var hasNoIgnoreCaseFlag = false;
-  findModeQuery.parsedQuery = findModeQuery.rawQuery.replace(/\\./g, function(match) {
-    switch (match) {
-      case "\\r":
-        findModeQuery.isRegex = true;
-        return '';
-      case "\\I":
-        hasNoIgnoreCaseFlag = true;
-        return '';
-      case "\\\\":
-        return "\\";
-      default:
-        return match;
-    }
-  });
-
-  // default to 'smartcase' mode, unless noIgnoreCase is explicitly specified
-  findModeQuery.ignoreCase = !hasNoIgnoreCaseFlag && !/[A-Z]/.test(findModeQuery.parsedQuery);
-
-  // if we are dealing with a regex, grep for all matches in the text, and then call window.find() on them
-  // sequentially so the browser handles the scrolling / text selection.
-  if (findModeQuery.isRegex) {
-    try {
-      var pattern = new RegExp(findModeQuery.parsedQuery, "g" + (findModeQuery.ignoreCase ? "i" : ""));
-    }
-    catch (e) {
-      // if we catch a SyntaxError, assume the user is not done typing yet and return quietly
-      return;
-    }
-    // innerText will not return the text of hidden elements, and strip out tags while preserving newlines
-    var text = document.body.innerText;
-    findModeQuery.regexMatches = text.match(pattern);
-    findModeQuery.activeRegexIndex = 0;
-  }
-}
-
-function handleKeyCharForFindMode(keyChar) {
-  findModeQuery.rawQuery += keyChar;
-  updateFindModeQuery();
-  performFindInPlace();
-  showFindModeHUDForQuery();
-}
-
-function handleEscapeForFindMode() {
-  exitFindMode();
-  document.body.classList.remove("vimiumFindMode");
-  // removing the class does not re-color existing selections. we recreate the current selection so it reverts
-  // back to the default color.
-  var selection = window.getSelection();
-  if (!selection.isCollapsed) {
-    var range = window.getSelection().getRangeAt(0);
-    window.getSelection().removeAllRanges();
-    window.getSelection().addRange(range);
-  }
-  focusFoundLink() || selectFoundInputElement();
-}
-
-function handleDeleteForFindMode() {
-  if (findModeQuery.rawQuery.length == 0) {
-    exitFindMode();
-    performFindInPlace();
-  }
-  else {
-    findModeQuery.rawQuery = findModeQuery.rawQuery.substring(0, findModeQuery.rawQuery.length - 1);
-    updateFindModeQuery();
-    performFindInPlace();
-    showFindModeHUDForQuery();
-  }
-}
-
-// <esc> sends us into insert mode if possible, but <cr> does not.
-// <esc> corresponds approximately to 'nevermind, I have found it already' while <cr> means 'I want to save
-// this query and do more searches with it'
-function handleEnterForFindMode() {
-  exitFindMode();
-  focusFoundLink();
-  document.body.classList.add("vimiumFindMode");
-  settings.set("findModeRawQuery", findModeQuery.rawQuery);
-}
-
-function performFindInPlace() {
-  var cachedScrollX = window.scrollX;
-  var cachedScrollY = window.scrollY;
-
-  var query = findModeQuery.isRegex ? getNextQueryFromRegexMatches(0) : findModeQuery.parsedQuery;
-
-  // Search backwards first to "free up" the current word as eligible for the real forward search. This allows
-  // us to search in place without jumping around between matches as the query grows.
-  executeFind(query, { backwards: true, caseSensitive: !findModeQuery.ignoreCase });
-
-  // We need to restore the scroll position because we might've lost the right position by searching
-  // backwards.
-  window.scrollTo(cachedScrollX, cachedScrollY);
-
-  findModeQueryHasResults = executeFind(query, { caseSensitive: !findModeQuery.ignoreCase });
-}
-
-// :options is an optional dict. valid parameters are 'caseSensitive' and 'backwards'.
-function executeFind(query, options) {
-  options = options || {};
-
-  // rather hacky, but this is our way of signalling to the insertMode listener not to react to the focus
-  // changes that find() induces.
-  var oldFindMode = findMode;
-  findMode = true;
-
-  document.body.classList.add("vimiumFindMode");
-
-  // prevent find from matching its own search query in the HUD
-  HUD.hide(true);
-  // ignore the selectionchange event generated by find()
-  document.removeEventListener("selectionchange",restoreDefaultSelectionHighlight, true);
-  var rv = window.find(query, options.caseSensitive, options.backwards, true, false, true, false);
-  setTimeout(function() {
-    document.addEventListener("selectionchange", restoreDefaultSelectionHighlight, true);
-  }, 0);
-
-  findMode = oldFindMode;
-  // we need to save the anchor node here because <esc> seems to nullify it, regardless of whether we do
-  // preventDefault()
-  findModeAnchorNode = document.getSelection().anchorNode;
-  return rv;
-}
-
-function restoreDefaultSelectionHighlight() {
-  document.body.classList.remove("vimiumFindMode");
-}
-
-function focusFoundLink() {
-  if (findModeQueryHasResults) {
-    var link = getLinkFromSelection();
-    if (link)
-      link.focus();
-  }
-}
-
-function isDOMDescendant(parent, child) {
-  var node = child;
-  while (node !== null) {
-    if (node === parent)
-      return true;
-    node = node.parentNode;
-  }
-  return false;
-}
-
-function selectFoundInputElement() {
-  // if the found text is in an input element, getSelection().anchorNode will be null, so we use activeElement
-  // instead. however, since the last focused element might not be the one currently pointed to by find (e.g.
-  // the current one might be disabled and therefore unable to receive focus), we use the approximate
-  // heuristic of checking that the last anchor node is an ancestor of our element.
-  if (findModeQueryHasResults && domUtils.isSelectable(document.activeElement) &&
-      isDOMDescendant(findModeAnchorNode, document.activeElement)) {
-    domUtils.simulateSelect(document.activeElement);
-    // the element has already received focus via find(), so invoke insert mode manually
-    enterInsertModeWithoutShowingIndicator(document.activeElement);
-  }
-}
-
-function getNextQueryFromRegexMatches(stepSize) {
-  if (!findModeQuery.regexMatches)
-    return ""; // find()ing an empty query always returns false
-
-  var totalMatches = findModeQuery.regexMatches.length;
-  findModeQuery.activeRegexIndex += stepSize + totalMatches;
-  findModeQuery.activeRegexIndex %= totalMatches;
-
-  return findModeQuery.regexMatches[findModeQuery.activeRegexIndex];
-}
-
-function findAndFocus(backwards) {
-  // check if the query has been changed by a script in another frame
-  var mostRecentQuery = settings.get("findModeRawQuery") || "";
-  if (mostRecentQuery !== findModeQuery.rawQuery) {
-    findModeQuery.rawQuery = mostRecentQuery;
-    updateFindModeQuery();
-  }
-
-  var query = findModeQuery.isRegex ? getNextQueryFromRegexMatches(backwards ? -1 : 1) :
-                                      findModeQuery.parsedQuery;
-
-  findModeQueryHasResults = executeFind(query, { backwards: backwards, caseSensitive: !findModeQuery.ignoreCase });
-
-  if (!findModeQueryHasResults) {
-    HUD.showForDuration("No matches for '" + findModeQuery.rawQuery + "'", 1000);
-    return;
-  }
-
-  // if we have found an input element via 'n', pressing <esc> immediately afterwards sends us into insert
-  // mode
-  var elementCanTakeInput = domUtils.isSelectable(document.activeElement) &&
-    isDOMDescendant(findModeAnchorNode, document.activeElement);
-  if (elementCanTakeInput) {
-    handlerStack.push({
-      keydown: function(event) {
-        handlerStack.pop();
-        if (isEscape(event)) {
-          domUtils.simulateSelect(document.activeElement);
-          enterInsertModeWithoutShowingIndicator(document.activeElement);
-          return false; // we have 'consumed' this event, so do not propagate
-        }
-        return true;
-      }
-    });
-  }
-
-  focusFoundLink();
-}
-
-function performFind() { findAndFocus(); }
-
-function performBackwardsFind() { findAndFocus(true); }
-
-function getLinkFromSelection() {
-  var node = window.getSelection().anchorNode;
-  while (node && node !== document.body) {
-    if (node.nodeName.toLowerCase() === 'a') return node;
-    node = node.parentNode;
-  }
-  return null;
-}
-
-// used by the findAndFollow* functions.
-function followLink(linkElement) {
-  if (linkElement.nodeName.toLowerCase() === 'link')
-    window.location.href = linkElement.href;
-  else {
-    // if we can click on it, don't simply set location.href: some next/prev links are meant to trigger AJAX
-    // calls, like the 'more' button on GitHub's newsfeed.
-    linkElement.scrollIntoView();
-    linkElement.focus();
-    domUtils.simulateClick(linkElement);
-  }
-}
-
-/**
- * Find and follow a link which matches any one of a list of strings. If there are multiple such links, they
- * are prioritized for shortness, by their position in :linkStrings, how far down the page they are located,
- * and finally by whether the match is exact. Practically speaking, this means we favor 'next page' over 'the
- * next big thing', and 'more' over 'nextcompany', even if 'next' occurs before 'more' in :linkStrings.
- */
-function findAndFollowLink(linkStrings) {
-  var linksXPath = domUtils.makeXPath(["a", "*[@onclick or @role='link' or contains(@class, 'button')]"]);
-  var links = domUtils.evaluateXPath(linksXPath, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE);
-  var candidateLinks = [];
-
-  // at the end of this loop, candidateLinks will contain all visible links that match our patterns
-  // links lower in the page are more likely to be the ones we want, so we loop through the snapshot backwards
-  for (var i = links.snapshotLength - 1; i >= 0; i--) {
-    var link = links.snapshotItem(i);
-
-    // ensure link is visible (we don't mind if it is scrolled offscreen)
-    var boundingClientRect = link.getBoundingClientRect();
-    if (boundingClientRect.width == 0 || boundingClientRect.height == 0)
-      continue;
-    var computedStyle = window.getComputedStyle(link, null);
-    if (computedStyle.getPropertyValue('visibility') != 'visible' ||
-        computedStyle.getPropertyValue('display') == 'none')
-      continue;
-
-    var linkMatches = false;
-    for (var j = 0; j < linkStrings.length; j++) {
-      if (link.innerText.toLowerCase().indexOf(linkStrings[j]) !== -1) {
-        linkMatches = true;
-        break;
-      }
-    }
-    if (!linkMatches) continue;
-
-    candidateLinks.push(link);
-  }
-
-  if (candidateLinks.length === 0) return;
-
-  function wordCount(link) { return link.innerText.trim().split(/\s+/).length; }
-
-  // We can use this trick to ensure that Array.sort is stable. We need this property to retain the reverse
-  // in-page order of the links.
-  candidateLinks.forEach(function(a,i){ a.originalIndex = i; });
-
-  // favor shorter links, and ignore those that are more than one word longer than the shortest link
-  candidateLinks =
-    candidateLinks
-      .sort(function(a,b) {
-        var wcA = wordCount(a), wcB = wordCount(b);
-        return wcA === wcB ? a.originalIndex - b.originalIndex : wcA - wcB;
-      })
-      .filter(function(a){return wordCount(a) <= wordCount(candidateLinks[0]) + 1});
-
-  // try to get exact word matches first
-  for (var i = 0; i < linkStrings.length; i++)
-    for (var j = 0; j < candidateLinks.length; j++) {
-      var exactWordRegex = new RegExp("\\b" + linkStrings[i] + "\\b", "i");
-      if (exactWordRegex.test(candidateLinks[j].innerText)) {
-        followLink(candidateLinks[j]);
-        return true;
-      }
-    }
-
-  for (var i = 0; i < linkStrings.length; i++)
-    for (var j = 0; j < candidateLinks.length; j++) {
-      if (candidateLinks[j].innerText.toLowerCase().indexOf(linkStrings[i]) !== -1) {
-        followLink(candidateLinks[j]);
-        return true;
-      }
-    }
-
-  return false;
-}
-
-function findAndFollowRel(value) {
-  var relTags = ['link', 'a', 'area'];
-  for (i = 0; i < relTags.length; i++) {
-    var elements = document.getElementsByTagName(relTags[i]);
-    for (j = 0; j < elements.length; j++) {
-      if (elements[j].hasAttribute('rel') && elements[j].rel == value) {
-        followLink(elements[j]);
-        return true;
-      }
-    }
-  }
-}
-
-function goPrevious() {
-  var previousPatterns = settings.get("previousPatterns") || "";
-  var previousStrings = previousPatterns.split(",");
-  findAndFollowRel('prev') || findAndFollowLink(previousStrings);
-}
-
-function goNext() {
-  var nextPatterns = settings.get("nextPatterns") || "";
-  var nextStrings = nextPatterns.split(",");
-  findAndFollowRel('next') || findAndFollowLink(nextStrings);
-}
-
-function showFindModeHUDForQuery() {
-  if (findModeQueryHasResults || findModeQuery.parsedQuery.length == 0)
-    HUD.show("/" + findModeQuery.rawQuery);
-  else
-    HUD.show("/" + findModeQuery.rawQuery + " (No Matches)");
-}
-
-function enterFindMode() {
-  findModeQuery = { rawQuery: "" };
-  findMode = true;
-  HUD.show("/");
-}
-
-function exitFindMode() {
-  findMode = false;
-  HUD.hide();
-}
-
-function showHelpDialog(html, fid) {
-  if (isShowingHelpDialog || !document.body || fid != frameId)
-    return;
-  isShowingHelpDialog = true;
-  var container = document.createElement("div");
-  container.id = "vimiumHelpDialogContainer";
-  container.className = "vimiumReset";
-
-  document.body.appendChild(container);
-
-  container.innerHTML = html;
-  container.getElementsByClassName("closeButton")[0].addEventListener("click", hideHelpDialog, false);
-  container.getElementsByClassName("optionsPage")[0].addEventListener("click",
-      function() { chrome.extension.sendRequest({ handler: "openOptionsPageInNewTab" }); }, false);
-
-  // This is necessary because innerHTML does not evaluate javascript embedded in <script> tags.
-  var scripts = Array.prototype.slice.call(container.getElementsByTagName("script"));
-  scripts.forEach(function(script) { eval(script.text); });
-
-}
-
-function hideHelpDialog(clickEvent) {
-  isShowingHelpDialog = false;
-  var helpDialog = document.getElementById("vimiumHelpDialogContainer");
-  if (helpDialog)
-    helpDialog.parentNode.removeChild(helpDialog);
-  if (clickEvent)
-    clickEvent.preventDefault();
-}
-
-/*
- * A heads-up-display (HUD) for showing Vimium page operations.
- * Note: you cannot interact with the HUD until document.body is available.
- */
-HUD = {
-  _tweenId: -1,
-  _displayElement: null,
-  _upgradeNotificationElement: null,
-
-  // This HUD is styled to precisely mimick the chrome HUD on Mac. Use the "has_popup_and_link_hud.html"
-  // test harness to tweak these styles to match Chrome's. One limitation of our HUD display is that
-  // it doesn't sit on top of horizontal scrollbars like Chrome's HUD does.
-
-  showForDuration: function(text, duration) {
-    HUD.show(text);
-    HUD._showForDurationTimerId = setTimeout(function() { HUD.hide(); }, duration);
-  },
-
-  show: function(text) {
-    if (!HUD.enabled()) return;
-    clearTimeout(HUD._showForDurationTimerId);
-    HUD.displayElement().innerHTML = text;
-    clearInterval(HUD._tweenId);
-    HUD._tweenId = Tween.fade(HUD.displayElement(), 1.0, 150);
-    HUD.displayElement().style.display = "";
-  },
-
-  showUpgradeNotification: function(version) {
-    HUD.upgradeNotificationElement().innerHTML = "Vimium has been updated to " +
-      "<a class='vimiumReset' href='https://chrome.google.com/extensions/detail/dbepggeogbaibhgnhhndojpepiihcmeb'>" +
-      version + "</a>.<a class='vimiumReset close-button' href='#'>x</a>";
-    var links = HUD.upgradeNotificationElement().getElementsByTagName("a");
-    links[0].addEventListener("click", HUD.onUpdateLinkClicked, false);
-    links[1].addEventListener("click", function(event) {
-      event.preventDefault();
-      HUD.onUpdateLinkClicked();
-    });
-    Tween.fade(HUD.upgradeNotificationElement(), 1.0, 150);
-  },
-
-  onUpdateLinkClicked: function(event) {
-    HUD.hideUpgradeNotification();
-    chrome.extension.sendRequest({ handler: "upgradeNotificationClosed" });
-  },
-
-  hideUpgradeNotification: function(clickEvent) {
-    Tween.fade(HUD.upgradeNotificationElement(), 0, 150,
-      function() { HUD.upgradeNotificationElement().style.display = "none"; });
-  },
-
-  /*
-   * Retrieves the HUD HTML element.
-   */
-  displayElement: function() {
-    if (!HUD._displayElement) {
-      HUD._displayElement = HUD.createHudElement();
-      // Keep this far enough to the right so that it doesn't collide with the "popups blocked" chrome HUD.
-      HUD._displayElement.style.right = "150px";
-    }
-    return HUD._displayElement;
-  },
-
-  upgradeNotificationElement: function() {
-    if (!HUD._upgradeNotificationElement) {
-      HUD._upgradeNotificationElement = HUD.createHudElement();
-      // Position this just to the left of our normal HUD.
-      HUD._upgradeNotificationElement.style.right = "315px";
-    }
-    return HUD._upgradeNotificationElement;
-  },
-
-  createHudElement: function() {
-    var element = document.createElement("div");
-    element.className = "vimiumReset vimiumHUD";
-    document.body.appendChild(element);
-    return element;
-  },
-
-  hide: function(immediate) {
-    clearInterval(HUD._tweenId);
-    if (immediate)
-      HUD.displayElement().style.display = "none";
-    else
-      HUD._tweenId = Tween.fade(HUD.displayElement(), 0, 150,
-        function() { HUD.displayElement().style.display = "none"; });
-  },
-
-  isReady: function() { return document.body != null; },
-
-  /* A preference which can be toggled in the Options page. */
-  enabled: function() { return !settings.get("hideHud"); }
-
-};
-
-Tween = {
-  /*
-   * Fades an element's alpha. Returns a timer ID which can be used to stop the tween via clearInterval.
-   */
-  fade: function(element, toAlpha, duration, onComplete) {
-    var state = {};
-    state.duration = duration;
-    state.startTime = (new Date()).getTime();
-    state.from = parseInt(element.style.opacity) || 0;
-    state.to = toAlpha;
-    state.onUpdate = function(value) {
-      element.style.opacity = value;
-      if (value == state.to && onComplete)
-        onComplete();
-    };
-    state.timerId = setInterval(function() { Tween.performTweenStep(state); }, 50);
-    return state.timerId;
-  },
-
-  performTweenStep: function(state) {
-    var elapsed = (new Date()).getTime() - state.startTime;
-    if (elapsed >= state.duration) {
-      clearInterval(state.timerId);
-      state.onUpdate(state.to)
-    } else {
-      var value = (elapsed / state.duration)  * (state.to - state.from) + state.from;
-      state.onUpdate(value);
-    }
-  }
-};
-
-/*
- * Adds the given CSS to the page.
- */
-function addCssToPage(css, id) {
-  var head = document.getElementsByTagName("head")[0];
-  if (!head) {
-    head = document.createElement("head");
-    document.documentElement.appendChild(head);
-  }
-  var style = document.createElement("style");
-  style.id = id;
-  style.type = "text/css";
-  style.appendChild(document.createTextNode(css));
-  head.appendChild(style);
-}
-
-initializePreDomReady();
-window.addEventListener("DOMContentLoaded", initializeOnDomReady);
-
-window.onbeforeunload = function() {
-  chrome.extension.sendRequest({ handler: "updateScrollPosition",
-      scrollX: window.scrollX, scrollY: window.scrollY });
-}
diff --git a/vomnibar.js b/vomnibar.js
deleted file mode 100644
index 4f136635..00000000
--- a/vomnibar.js
+++ /dev/null
@@ -1,232 +0,0 @@
-var vomnibar = (function() {
-  var vomnibarUI = null;  // the dialog instance for this window
-  var completers = { };
-
-  function getCompleter(name) {
-    if (!(name in completers))
-      completers[name] = new BackgroundCompleter(name);
-    return completers[name];
-  }
-
-  /*
-   * Activate the Vomnibox.
-   */
-  function activate(completerName, refreshInterval, initialQueryValue) {
-    var completer = getCompleter(completerName);
-    if (!vomnibarUI)
-      vomnibarUI = new VomnibarUI(10);
-    completer.refresh();
-    vomnibarUI.setCompleter(completer);
-    vomnibarUI.setRefreshInterval(refreshInterval);
-    if (initialQueryValue)
-      vomnibarUI.setQuery(initialQueryValue);
-    vomnibarUI.show();
-  }
-
-  /** User interface for fuzzy completion */
-  var VomnibarUI = Class.extend({
-    init: function(maxResults) {
-      this.prompt = '>';
-      this.maxResults = maxResults;
-      this.refreshInterval = 0;
-      this.initDom();
-    },
-
-    setQuery: function(query) { this.input.value = query; },
-
-    setCompleter: function(completer) {
-      this.completer = completer;
-      this.reset();
-    },
-
-    setRefreshInterval: function(refreshInterval) { this.refreshInterval = refreshInterval; },
-
-    show: function() {
-      this.box.style.display = "block";
-      this.input.focus();
-      handlerStack.push({ keydown: this.onKeydown.bind(this) });
-    },
-
-    hide: function() {
-      this.box.style.display = "none";
-      this.completionList.style.display = "none";
-      this.input.blur();
-      handlerStack.pop();
-    },
-
-    reset: function() {
-      this.input.value = "";
-      this.updateTimer = null;
-      this.completions = [];
-      this.selection = 0;
-      this.update(true);
-    },
-
-    updateSelection: function() {
-      if (this.completions.length > 0)
-        this.selection = Math.min(this.selection, this.completions.length - 1);
-      for (var i = 0; i < this.completionList.children.length; ++i)
-        this.completionList.children[i].className = (i == this.selection) ? "selected" : "";
-    },
-
-    /*
-     * Returns the user's action ("up", "down", "enter", "dismiss" or null) based on their keypress.
-     * We support the arrow keys and other shortcuts for moving, so this method hides that complexity.
-     */
-    actionFromKeyEvent: function(event) {
-      var key = getKeyChar(event);
-      if (isEscape(event))
-        return "dismiss";
-      else if (key == "up" ||
-          (event.shiftKey && event.keyCode == keyCodes.tab) ||
-          (event.ctrlKey && (key == "k" || key == "p")))
-        return "up";
-      else if (key == "down" ||
-        (event.keyCode == keyCodes.tab && !event.shiftKey) ||
-        (event.ctrlKey && (key == "j" || key == "n")))
-        return "down";
-      else if (event.keyCode == keyCodes.enter)
-        return "enter";
-    },
-
-    onKeydown: function(event) {
-      var action = this.actionFromKeyEvent(event);
-      if (!action) return true; // pass through
-
-      if (action == "dismiss") {
-        this.hide();
-      }
-      else if (action == "up") {
-        if (this.selection > 0)
-          this.selection -= 1;
-        this.updateSelection();
-      }
-      else if (action == "down") {
-        if (this.selection < this.completions.length - 1)
-          this.selection += 1;
-        this.updateSelection();
-      }
-      else if (action == "enter") {
-        this.update(true, function() {
-          // Shift+Enter will open the result in a new tab instead of the current tab.
-          var openInNewTab = (event.shiftKey || isPrimaryModifierKey(event));
-          this.completions[this.selection].performAction(openInNewTab);
-          this.hide();
-        }.proxy(this));
-      }
-
-      // It seems like we have to manually supress the event here and still return true.
-      event.stopPropagation();
-      event.preventDefault();
-      return true;
-    },
-
-    updateCompletions: function(callback) {
-      query = this.input.value.replace(/^\s*/, "");
-
-      this.completer.filter(query, this.maxResults, function(completions) {
-        this.completions = completions;
-
-        // update completion list with the new data
-        this.completionList.innerHTML = completions.map(function(completion) {
-          return "<li>" + completion.html + "</li>";
-        }).join('');
-
-        this.completionList.style.display = this.completions.length > 0 ? "block" : "none";
-        this.updateSelection();
-        if (callback) callback();
-      }.proxy(this));
-    },
-
-    update: function(force, callback) {
-      force = force || false; // explicitely default to asynchronous updating
-
-      if (force) {
-        // cancel scheduled update
-        if (this.updateTimer !== null)
-          window.clearTimeout(this.updateTimer);
-        this.updateCompletions(callback);
-      } else if (this.updateTimer !== null) {
-        // an update is already scheduled, don't do anything
-        return;
-      } else {
-        // always update asynchronously for better user experience and to take some load off the CPU
-        // (not every keystroke will cause a dedicated update)
-        this.updateTimer = setTimeout(function() {
-          this.updateCompletions(callback);
-          this.updateTimer = null;
-        }.proxy(this), this.refreshInterval);
-      }
-    },
-
-    initDom: function() {
-      this.box = utils.createElementFromHtml(
-        '<div id="vomnibar" class="vimiumReset">'+
-          '<div class="input">'+
-            '<span class="prompt">' + utils.escapeHtml(this.prompt) + '</span> '+
-            '<input type="text" class="query"></span></div>'+
-          '<ul></ul></div>');
-      this.box.style.display = 'none';
-      document.body.appendChild(this.box);
-
-      this.input = document.querySelector("#vomnibar .query");
-      this.input.addEventListener("input", function() { this.update(); }.bind(this));
-      this.completionList = document.querySelector("#vomnibar ul");
-      this.completionList.style.display = "none";
-    }
-  });
-
-  /*
-   * Sends filter and refresh requests to a Vomnibox completer on the background page.
-   */
-  var BackgroundCompleter = Class.extend({
-    /* - name: The background page completer that you want to interface with. Either "omni" or "tabs". */
-    init: function(name) {
-      this.name = name;
-      this.filterPort = chrome.extension.connect({ name: "filterCompleter" });
-    },
-
-    refresh: function() { chrome.extension.sendRequest({ handler: "refreshCompleter", name: this.name }); },
-
-    filter: function(query, maxResults, callback) {
-      var id = utils.createUniqueId();
-      this.filterPort.onMessage.addListener(function(msg) {
-        if (msg.id != id) return;
-        callback(msg.results.map(function(result) {
-          // functionName will be either "navigateToUrl" or "switchToTab". args will be a URL or a tab ID.
-          var functionToCall = completionActions[result.action.functionName];
-          result.performAction = functionToCall.curry(result.action.args);
-          return result;
-        }));
-      });
-      this.filterPort.postMessage({ id: id, name: this.name, query: query, maxResults: maxResults });
-    }
-  });
-
-  /*
-   * These are the actions we can perform when the user selects a result in the Vomnibox.
-   */
-  var completionActions = {
-    navigateToUrl: function(url, openInNewTab) {
-      // If the URL is a bookmarklet prefixed with javascript:, we shouldn't open that in a new tab.
-      if (url.indexOf("javascript:") == 0)
-        openInNewTab = false;
-      chrome.extension.sendRequest({
-        handler: openInNewTab ? "openUrlInNewTab" : "openUrlInCurrentTab",
-        url: url,
-        selected: openInNewTab
-      });
-    },
-
-    switchToTab: function(tabId) {
-      chrome.extension.sendRequest({ handler: "selectSpecificTab", id: tabId });
-    }
-  };
-
-  // public interface
-  return {
-    activate: function() { activate("omni", 100); },
-    activateWithCurrentUrl: function() { activate("omni", 100, window.location.toString()); },
-    activateTabSelection: function() { activate("tabs", 0); }
-  }
-})();
-- 
cgit v1.2.3