3 files changed, 157 insertions, 0 deletions
diff --git a/src/content/footer-line.css b/src/content/footer-line.css
new file mode 100644
index 0000000..041776c
--- /dev/null
+++ b/src/content/footer-line.css
@@ -0,0 +1,46 @@
+.vimvixen-footerline {
+  border-top: 1px solid gray;
+  bottom: 0;
+  box-sizing: border-box;
+  font-family: monospace;
+  font-size: 12px;
+  left: 0;
+  margin: 0;
+  padding: 0;
+  position: fixed;
+  right: 0;
+  z-index: 10000;
+}
+
+.vimvixen-footerline-title {
+  background-color: lightgray;
+  font-weight: bold;
+  margin: 0;
+  padding: 0;
+}
+
+.vimvixen-footerline-container-outer {
+  background-color: white;
+  position: relative;
+}
+
+.vimvixen-footerline-container-outer:before {
+  content: ':';
+  background-color: white;
+  float: left;
+  text-align: right;
+  width: 12px;
+}
+
+.vimvixen-footerline-container-inner {
+  position: absolute;
+  left: 12px;
+  right: 0;
+}
+
+.vimvixen-footerline-input {
+  margin: 0;
+  padding: 0;
+  width: 100%;
+  border: none;
+}
diff --git a/src/content/footer-line.js b/src/content/footer-line.js
new file mode 100644
index 0000000..fc1dc7b
--- /dev/null
+++ b/src/content/footer-line.js
@@ -0,0 +1,78 @@
+import './footer-line.css';
+
+export default class FooterLine {
+  constructor(doc, initial = '') {
+    this.initUi(doc);
+
+    this.enteredCallback = () => {}
+    this.promptChangeCallback = () => {}
+
+    this.input.addEventListener('blur', this.handleBlur.bind(this));
+    this.input.addEventListener('keydown', this.handleKeydown.bind(this));
+    this.input.addEventListener('keyup', this.handleKeyup.bind(this));
+    this.input.value = initial;
+  }
+
+  initUi(doc) {
+    this.title = doc.createElement('p');
+    this.title.className = 'vimvixen-footerline-title';
+
+    let containerInner = doc.createElement('div');
+    containerInner.className = 'vimvixen-footerline-container-inner';
+
+    let containerOuter = doc.createElement('div');
+    containerOuter.className = 'vimvixen-footerline-container-outer';
+
+    this.input = doc.createElement('input');
+    this.input.className = 'vimvixen-footerline-input';
+
+    this.wrapper = doc.createElement('div');
+    this.wrapper.className = 'vimvixen-footerline';
+
+    containerOuter.append(containerInner);
+    containerInner.append(this.input);
+    this.wrapper.append(this.title);
+    this.wrapper.append(containerOuter);
+    doc.body.append(this.wrapper)
+  }
+
+  focus() {
+    this.input.focus();
+  }
+
+  remove() {
+    this.wrapper.remove();
+  }
+
+  onPromptChange(callback) {
+    this.promptChangeCallback = callback;
+  }
+
+  onEntered(callback) {
+    this.enteredCallback = callback;
+  }
+
+  handleBlur() {
+    this.remove();
+  }
+
+  handleKeydown(e) {
+    this.prevValue = e.target.value;
+    switch(e.keyCode) {
+    case KeyboardEvent.DOM_VK_ESCAPE:
+      this.remove();
+      break;
+    case KeyboardEvent.DOM_VK_RETURN:
+      this.enteredCallback(e);
+      break;
+    }
+  }
+
+  handleKeyup(e) {
+    if (e.target.value === this.prevValue) {
+      return;
+    }
+    this.promptChangeCallback(e);
+    this.prevValue = e.target.value;
+  }
+}
diff --git a/src/content/index.js b/src/content/index.js
index 03efc5e..17ab308 100644
--- a/src/content/index.js
+++ b/src/content/index.js
@@ -1,12 +1,45 @@
 import * as scrolls from './scrolls';
+import FooterLine from './footer-line';
 import * as actions from '../shared/actions';
 
+var footer = null;
+
+const createFooterLine = (initial = '') => {
+  footer = new FooterLine(document, initial);
+  footer.onPromptChange((e) => {
+    let request = {
+      type: 'event.cmd.suggest',
+      text: e.target.value
+    };
+    browser.runtime.sendMessage(request);
+  });
+  footer.onEntered((e) => {
+    let request = {
+      type: 'event.cmd.enter',
+      text: e.target.value
+    };
+    browser.runtime.sendMessage(request);
+  });
+  footer.focus();
+}
+
 const invokeEvent = (action) => {
   if (typeof action === 'undefined' || action === null) {
     return;
   }
 
   switch (action[0]) {
+  case actions.CMD_OPEN:
+    createFooterLine();
+    break;
+  case actions.CMD_TABS_OPEN:
+    if (action[1] || false) {
+      // alter url
+      createFooterLine('open ' + window.location.href);
+    } else {
+      createFooterLine('open ');
+    }
+    break;
   case actions.SCROLL_UP:
     scrolls.scrollUp(window, action[1] || 1);
     break;