From 944683a2d8f9a165c490d05c350fdc689bdb6c85 Mon Sep 17 00:00:00 2001 From: Shin'ya Ueoka Date: Sun, 8 Oct 2017 08:58:11 +0900 Subject: use key instead of keyCode in follow --- src/components/follow.js | 64 +++++++++++------------------------------------- 1 file changed, 14 insertions(+), 50 deletions(-) (limited to 'src/components/follow.js') diff --git a/src/components/follow.js b/src/components/follow.js index 9221759..365bb20 100644 --- a/src/components/follow.js +++ b/src/components/follow.js @@ -5,21 +5,6 @@ import HintKeyProducer from 'content/hint-key-producer'; const DEFAULT_HINT_CHARSET = 'abcdefghijklmnopqrstuvwxyz'; -const availableKey = (keyCode) => { - return ( - KeyboardEvent.DOM_VK_0 <= keyCode && keyCode <= KeyboardEvent.DOM_VK_9 || - KeyboardEvent.DOM_VK_A <= keyCode && keyCode <= KeyboardEvent.DOM_VK_Z - ); -}; - -const isNumericKey = (code) => { - return KeyboardEvent.DOM_VK_0 <= code && code <= KeyboardEvent.DOM_VK_9; -}; - -const isAlphabeticKey = (code) => { - return KeyboardEvent.DOM_VK_A <= code && code <= KeyboardEvent.DOM_VK_Z; -}; - const inWindow = (window, element) => { let { top, left, bottom, right @@ -49,8 +34,7 @@ export default class FollowComponent { this.create(); } else if (prevState.enabled && !this.state.enabled) { this.remove(); - } else if (JSON.stringify(prevState.keys) !== - JSON.stringify(this.state.keys)) { + } else if (prevState.keys !== this.state.keys) { this.updateHints(); } } @@ -60,23 +44,21 @@ export default class FollowComponent { return; } - let { keyCode } = e; - switch (keyCode) { - case KeyboardEvent.DOM_VK_ENTER: - case KeyboardEvent.DOM_VK_RETURN: - this.activate(this.hintElements[ - FollowComponent.codeChars(this.state.keys)].target); + let { key } = e; + switch (key) { + case 'Enter': + this.activate(this.hintElements[this.state.keys].target); return; - case KeyboardEvent.DOM_VK_ESCAPE: + case 'Escape': this.store.dispatch(followActions.disable()); return; - case KeyboardEvent.DOM_VK_BACK_SPACE: - case KeyboardEvent.DOM_VK_DELETE: + case 'Backspace': + case 'Delete': this.store.dispatch(followActions.backspace()); break; default: - if (availableKey(keyCode)) { - this.store.dispatch(followActions.keyPress(keyCode)); + if (DEFAULT_HINT_CHARSET.includes(key)) { + this.store.dispatch(followActions.keyPress(key)); } break; } @@ -86,18 +68,18 @@ export default class FollowComponent { } updateHints() { - let chars = FollowComponent.codeChars(this.state.keys); + let keys = this.state.keys; let shown = Object.keys(this.hintElements).filter((key) => { - return key.startsWith(chars); + return key.startsWith(keys); }); let hidden = Object.keys(this.hintElements).filter((key) => { - return !key.startsWith(chars); + return !key.startsWith(keys); }); if (shown.length === 0) { this.remove(); return; } else if (shown.length === 1) { - this.activate(this.hintElements[chars].target); + this.activate(this.hintElements[keys].target); this.remove(); } @@ -177,24 +159,6 @@ export default class FollowComponent { }); } - static codeChars(codes) { - const CHARCODE_ZERO = '0'.charCodeAt(0); - const CHARCODE_A = 'a'.charCodeAt(0); - - let chars = ''; - - for (let code of codes) { - if (isNumericKey(code)) { - chars += String.fromCharCode( - code - KeyboardEvent.DOM_VK_0 + CHARCODE_ZERO); - } else if (isAlphabeticKey(code)) { - chars += String.fromCharCode( - code - KeyboardEvent.DOM_VK_A + CHARCODE_A); - } - } - return chars; - } - static getTargetElements(doc) { let all = doc.querySelectorAll('a,button,input,textarea'); let filtered = Array.prototype.filter.call(all, (element) => { -- cgit v1.2.3 From e2aae9cff249db0617f082a34a8a3a4f5dd1f4f1 Mon Sep 17 00:00:00 2001 From: Shin'ya Ueoka Date: Sun, 8 Oct 2017 09:56:54 +0900 Subject: follow from content-input --- src/components/content-input.js | 3 +++ src/components/follow.js | 12 +++--------- src/content/index.js | 3 +++ 3 files changed, 9 insertions(+), 9 deletions(-) (limited to 'src/components/follow.js') diff --git a/src/components/content-input.js b/src/components/content-input.js index 0f15937..9568caf 100644 --- a/src/components/content-input.js +++ b/src/components/content-input.js @@ -49,6 +49,9 @@ export default class ContentInputComponent { let stop = false; for (let listener of this.onKeyListeners) { stop = stop || listener(e.key, e.ctrlKey); + if (stop) { + break; + } } if (stop) { e.preventDefault(); diff --git a/src/components/follow.js b/src/components/follow.js index 365bb20..25db0c4 100644 --- a/src/components/follow.js +++ b/src/components/follow.js @@ -22,9 +22,6 @@ export default class FollowComponent { this.store = store; this.hintElements = {}; this.state = {}; - - let doc = wrapper.ownerDocument; - doc.addEventListener('keydown', this.onKeyDown.bind(this)); } update() { @@ -39,12 +36,11 @@ export default class FollowComponent { } } - onKeyDown(e) { + key(key) { if (!this.state.enabled) { - return; + return false; } - let { key } = e; switch (key) { case 'Enter': this.activate(this.hintElements[this.state.keys].target); @@ -62,9 +58,7 @@ export default class FollowComponent { } break; } - - e.stopPropagation(); - e.preventDefault(); + return true; } updateHints() { diff --git a/src/content/index.js b/src/content/index.js index ad891ca..d380291 100644 --- a/src/content/index.js +++ b/src/content/index.js @@ -13,6 +13,9 @@ const followComponent = new FollowComponent(window.document.body, store); const contentInputComponent = new ContentInputComponent(window.document.body, store); const keymapperComponent = new KeymapperComponent(store); +contentInputComponent.onKey((key, ctrl) => { + return followComponent.key(key, ctrl); +}); contentInputComponent.onKey((key, ctrl) => { return keymapperComponent.key(key, ctrl); }); -- cgit v1.2.3 From 370e20d76ad52daad0f3fcae33372434b45e3bac Mon Sep 17 00:00:00 2001 From: Shin'ya Ueoka Date: Sun, 8 Oct 2017 10:00:06 +0900 Subject: disable follow after activate --- src/components/follow.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'src/components/follow.js') diff --git a/src/components/follow.js b/src/components/follow.js index 25db0c4..eedbd4d 100644 --- a/src/components/follow.js +++ b/src/components/follow.js @@ -74,7 +74,7 @@ export default class FollowComponent { return; } else if (shown.length === 1) { this.activate(this.hintElements[keys].target); - this.remove(); + this.store.dispatch(followActions.disable()); } shown.forEach((key) => { -- cgit v1.2.3