1 files changed, 87 insertions, 77 deletions

diff --git a/src/console/components/console.js b/src/console/components/console.js
index 5028e2a..7bc3364 100644
--- a/src/console/components/console.js
+++ b/src/console/components/console.js
@@ -1,45 +1,44 @@
 import messages from 'shared/messages';
 import * as consoleActions from 'console/actions/console';
 
+const inputShownMode = (state) => {
+  return ['command', 'find'].includes(state.mode);
+};
+
 export default class ConsoleComponent {
   constructor(wrapper, store) {
     this.wrapper = wrapper;
-    this.prevState = {};
-    this.completionOrigin = '';
     this.store = store;
+    this.prevMode = '';
 
     let doc = this.wrapper.ownerDocument;
     let input = doc.querySelector('#vimvixen-console-command-input');
+
     input.addEventListener('blur', this.onBlur.bind(this));
     input.addEventListener('keydown', this.onKeyDown.bind(this));
     input.addEventListener('input', this.onInput.bind(this));
 
-    this.hideCommand();
-    this.hideMessage();
-
     store.subscribe(() => {
       this.update();
     });
+    this.update();
   }
 
   onBlur() {
-    return browser.runtime.sendMessage({
-      type: messages.CONSOLE_BLURRED,
-    });
+    let state = this.store.getState();
+    if (state.mode === 'command') {
+      this.hideCommand();
+    }
   }
 
   onKeyDown(e) {
-    let doc = this.wrapper.ownerDocument;
-    let input = doc.querySelector('#vimvixen-console-command-input');
-
     switch (e.keyCode) {
     case KeyboardEvent.DOM_VK_ESCAPE:
-      return input.blur();
+      return this.hideCommand();
     case KeyboardEvent.DOM_VK_RETURN:
-      return browser.runtime.sendMessage({
-        type: messages.CONSOLE_ENTERED,
-        text: e.target.value
-      }).then(this.onBlur);
+      e.stopPropagation();
+      e.preventDefault();
+      return this.onEntered(e.target.value);
     case KeyboardEvent.DOM_VK_TAB:
       if (e.shiftKey) {
         this.store.dispatch(consoleActions.completionPrev());
@@ -52,94 +51,105 @@ export default class ConsoleComponent {
     }
   }
 
+  onEntered(value) {
+    let state = this.store.getState();
+    if (state.mode === 'command') {
+      browser.runtime.sendMessage({
+        type: messages.CONSOLE_ENTER_COMMAND,
+        text: value,
+      });
+      this.hideCommand();
+    } else if (state.mode === 'find') {
+      this.hideCommand();
+      window.top.postMessage(JSON.stringify({
+        type: messages.CONSOLE_ENTER_FIND,
+        text: value,
+      }), '*');
+    }
+  }
+
   onInput(e) {
-    let doc = this.wrapper.ownerDocument;
-    let input = doc.querySelector('#vimvixen-console-command-input');
-    this.completionOrigin = input.value;
+    this.store.dispatch(consoleActions.setConsoleText(e.target.value));
 
+    let source = e.target.value;
     return browser.runtime.sendMessage({
       type: messages.CONSOLE_QUERY_COMPLETIONS,
-      text: e.target.value,
+      text: source,
     }).then((completions) => {
-      this.store.dispatch(consoleActions.setCompletions(completions));
+      this.store.dispatch(consoleActions.setCompletions(source, completions));
     });
   }
 
-  update() {
-    let state = this.store.getState();
-    if (this.prevState.mode !== 'command' && state.mode === 'command') {
-      this.showCommand(state.commandText);
-    } else if (state.mode !== 'command') {
-      this.hideCommand();
-    }
+  onInputShown(state) {
+    let doc = this.wrapper.ownerDocument;
+    let input = doc.querySelector('#vimvixen-console-command-input');
 
-    if (state.mode === 'error' || state.mode === 'info') {
-      this.showMessage(state.mode, state.messageText);
-    } else {
-      this.hideMessage();
-    }
+    input.focus();
+    window.focus();
 
-    if (state.groupSelection >= 0 && state.itemSelection >= 0) {
-      let group = state.completions[state.groupSelection];
-      let item = group.items[state.itemSelection];
-      this.setCommandValue(item.content);
-    } else if (state.completions.length > 0 &&
-      JSON.stringify(this.prevState.completions) ===
-        JSON.stringify(state.completions)) {
-      // Reset input only completion groups not changed (unselected an item in
-      // completion) in order to avoid to override previous input
-      this.setCommandCompletionOrigin();
+    if (state.mode === 'command') {
+      this.onInput({ target: input });
     }
+  }
 
-    this.prevState = state;
+  hideCommand() {
+    this.store.dispatch(consoleActions.hideCommand());
+    window.top.postMessage(JSON.stringify({
+      type: messages.CONSOLE_UNFOCUS,
+    }), '*');
   }
 
-  showCommand(text) {
-    let doc = this.wrapper.ownerDocument;
-    let command = doc.querySelector('#vimvixen-console-command');
-    let input = doc.querySelector('#vimvixen-console-command-input');
+  update() {
+    let state = this.store.getState();
 
-    command.style.display = 'block';
-    input.value = text;
-    input.focus();
+    this.updateMessage(state);
+    this.updateCommand(state);
+    this.updatePrompt(state);
 
-    window.focus();
-    this.onInput({ target: input });
+    if (this.prevMode !== state.mode && inputShownMode(state)) {
+      this.onInputShown(state);
+    }
+    this.prevMode = state.mode;
   }
 
-  hideCommand() {
+  updateMessage(state) {
     let doc = this.wrapper.ownerDocument;
-    let command = doc.querySelector('#vimvixen-console-command');
-    command.style.display = 'none';
-  }
+    let box = doc.querySelector('.vimvixen-console-message');
+    let display = 'none';
+    let classList = ['vimvixen-console-message'];
 
-  setCommandValue(value) {
-    let doc = this.wrapper.ownerDocument;
-    let input = doc.querySelector('#vimvixen-console-command-input');
-    input.value = value;
+    if (state.mode === 'error' || state.mode === 'info') {
+      display = 'block';
+      classList.push('vimvixen-console-' + state.mode);
+    }
+
+    box.className = classList.join(' ');
+    box.style.display = display;
+    box.textContent = state.messageText;
   }
 
-  setCommandCompletionOrigin() {
+  updateCommand(state) {
     let doc = this.wrapper.ownerDocument;
+    let command = doc.querySelector('#vimvixen-console-command');
     let input = doc.querySelector('#vimvixen-console-command-input');
-    input.value = this.completionOrigin;
-  }
 
-  showMessage(mode, text) {
-    let doc = this.wrapper.ownerDocument;
-    let error = doc.querySelector('#vimvixen-console-message');
-    error.classList.remove(
-      'vimvixen-console-info',
-      'vimvixen-console-error'
-    );
-    error.classList.add('vimvixen-console-' + mode);
-    error.textContent = text;
-    error.style.display = 'block';
+    let display = 'none';
+    if (inputShownMode(state)) {
+      display = 'block';
+    }
+
+    command.style.display = display;
+    input.value = state.consoleText;
   }
 
-  hideMessage() {
+  updatePrompt(state) {
+    let classList = ['vimvixen-console-command-prompt'];
+    if (inputShownMode(state)) {
+      classList.push('prompt-' + state.mode);
+    }
+
     let doc = this.wrapper.ownerDocument;
-    let error = doc.querySelector('#vimvixen-console-message');
-    error.style.display = 'none';
+    let ele = doc.querySelector('.vimvixen-console-command-prompt');
+    ele.className = classList.join(' ');
   }
 }