aboutsummaryrefslogtreecommitdiff
path: root/src/pages/console.js
blob: 1e1b3fd1b5507af0bd4ff0bb3d322b14eee7272a (plain) (blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
import './console.scss';
import messages from '../content/messages';
import CompletionComponent from '../components/completion';
import completionReducer from '../reducers/completion';
import * as store from '../store';
import * as completionActions from '../actions/completion';

const completionStore = store.createStore(completionReducer);
let completionComponent = null;

window.addEventListener('load', () => {
  let wrapper = document.querySelector('#vimvixen-console-completion');
  completionComponent = new CompletionComponent(wrapper, completionStore);
});

// TODO consider object-oriented
let prevValue = '';
let completionOrigin = '';
let prevState = {};

completionStore.subscribe(() => {
  completionComponent.update();

  let state = completionStore.getState();
  let input = window.document.querySelector('#vimvixen-console-command-input');

  if (state.groupSelection >= 0) {
    let item = state.groups[state.groupSelection].items[state.itemSelection];
    input.value = item.content;
  } else if (state.groups.length > 0) {
    input.value = completionOrigin;
  }
});

const handleBlur = () => {
  return browser.runtime.sendMessage({
    type: messages.CONSOLE_BLURRED,
  });
};

const handleKeydown = (e) => {
  let input = window.document.querySelector('#vimvixen-console-command-input');

  switch (e.keyCode) {
  case KeyboardEvent.DOM_VK_ESCAPE:
    return input.blur();
  case KeyboardEvent.DOM_VK_RETURN:
    return browser.runtime.sendMessage({
      type: messages.CONSOLE_ENTERED,
      text: e.target.value
    });
  case KeyboardEvent.DOM_VK_TAB:
    if (e.shiftKey) {
      completionStore.dispatch(completionActions.selectPrev());
    } else {
      completionStore.dispatch(completionActions.selectNext());
    }
    e.stopPropagation();
    e.preventDefault();
    break;
  }
};

const handleKeyup = (e) => {
  if (e.keyCode === KeyboardEvent.DOM_VK_TAB) {
    return;
  }
  if (e.target.value === prevValue) {
    return;
  }

  let input = window.document.querySelector('#vimvixen-console-command-input');
  completionOrigin = input.value;

  prevValue = e.target.value;
  return browser.runtime.sendMessage({
    type: messages.CONSOLE_CHANGEED,
    text: e.target.value
  });
};

window.addEventListener('load', () => {
  let input = window.document.querySelector('#vimvixen-console-command-input');
  input.addEventListener('blur', handleBlur);
  input.addEventListener('keydown', handleKeydown);
  input.addEventListener('keyup', handleKeyup);
});

const updateCompletions = (completions) => {
  completionStore.dispatch(completionActions.setItems(completions));
};

const update = (state) => {
  let error = window.document.querySelector('#vimvixen-console-error');
  let command = window.document.querySelector('#vimvixen-console-command');
  let input = window.document.querySelector('#vimvixen-console-command-input');

  error.style.display = state.errorShown ? 'block' : 'none';
  error.textContent = state.errorText;

  command.style.display = state.commandShown ? 'block' : 'none';
  if (state.commandShown && !prevState.commandShown) {
    input.value = state.commandText;
    input.focus();
  }
  if (JSON.stringify(state.completions) !==
    JSON.stringify(prevState.completions)) {
    updateCompletions(state.completions);
  }

  prevState = state;
};

browser.runtime.onMessage.addListener((action) => {
  if (action.type === messages.STATE_UPDATE) {
    return update(action.state.console);
  }
});

window.addEventListener('load', () => {
  let error = window.document.querySelector('#vimvixen-console-error');
  let command = window.document.querySelector('#vimvixen-console-command');
  error.style.display = 'none';
  command.style.display = 'none';
});