From 5a082b4ea51d283a20c5499c13fd48d9bed67fd2 Mon Sep 17 00:00:00 2001 From: Shin'ya Ueoka Date: Sun, 13 Aug 2017 21:32:24 +0900 Subject: add command-line bar --- src/background/key-queue.js | 1 + src/content/footer-line.css | 29 +++++++++++++++++++++++++++++ src/content/footer-line.js | 39 +++++++++++++++++++++++++++++++++++++++ src/content/index.js | 8 ++++++++ src/shared/actions.js | 2 ++ 5 files changed, 79 insertions(+) create mode 100644 src/content/footer-line.css create mode 100644 src/content/footer-line.js (limited to 'src') diff --git a/src/background/key-queue.js b/src/background/key-queue.js index 666eec3..acbb6e0 100644 --- a/src/background/key-queue.js +++ b/src/background/key-queue.js @@ -2,6 +2,7 @@ import * as keys from './keys'; import * as actions from '../shared/actions'; const DEFAULT_KEYMAP = [ + { keys: [{ code: KeyboardEvent.DOM_VK_SEMICOLON, shift: true }], action: [ actions.CMD_OPEN ]}, { keys: [{ code: KeyboardEvent.DOM_VK_K }], action: [ actions.SCROLL_UP, 1 ]}, { keys: [{ code: KeyboardEvent.DOM_VK_J }], action: [ actions.SCROLL_DOWN, 1 ]}, { keys: [{ code: KeyboardEvent.DOM_VK_G }, { code: KeyboardEvent.DOM_VK_G }], action: [ actions.SCROLL_TOP ]}, diff --git a/src/content/footer-line.css b/src/content/footer-line.css new file mode 100644 index 0000000..ce35143 --- /dev/null +++ b/src/content/footer-line.css @@ -0,0 +1,29 @@ +.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-input{ + background-color: white; + bottom: 0; + 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..2a931f3 --- /dev/null +++ b/src/content/footer-line.js @@ -0,0 +1,39 @@ +import './footer-line.css'; + +export default class FooterLine { + constructor(doc) { + this.title = doc.createElement('p'); + this.title.className = 'vimvixen-footerline-title'; + + this.input = doc.createElement('input'); + this.input.className = 'vimvixen-footerline-input'; + + this.wrapper = doc.createElement('div'); + this.wrapper.className = 'vimvixen-footerline'; + + this.wrapper.append(this.title); + this.wrapper.append(this.input); + doc.body.append(this.wrapper) + + this.input.addEventListener('blur', this.handleBlur.bind(this)); + this.input.addEventListener('keydown', this.handleKeydown.bind(this)); + } + + focus() { + this.input.focus(); + } + + remove() { + this.wrapper.remove(); + } + + handleBlur() { + this.remove(); + } + + handleKeydown(e) { + if (e.keyCode === KeyboardEvent.DOM_VK_ESCAPE) { + this.remove(); + } + } +} diff --git a/src/content/index.js b/src/content/index.js index 03efc5e..8cf0aed 100644 --- a/src/content/index.js +++ b/src/content/index.js @@ -1,12 +1,20 @@ import * as scrolls from './scrolls'; +import FooterLine from './footer-line'; import * as actions from '../shared/actions'; +var footer = null; + const invokeEvent = (action) => { if (typeof action === 'undefined' || action === null) { return; } switch (action[0]) { + case actions.CMD_OPEN: + footer = new FooterLine(document); + footer.input.value = ':'; + footer.focus(); + break; case actions.SCROLL_UP: scrolls.scrollUp(window, action[1] || 1); break; diff --git a/src/shared/actions.js b/src/shared/actions.js index 3e3cbd0..4c9fec4 100644 --- a/src/shared/actions.js +++ b/src/shared/actions.js @@ -1,3 +1,4 @@ +export const CMD_OPEN = 'cmd.open'; export const TABS_PREV = 'tabs.prev'; export const TABS_NEXT = 'tabs.next'; export const SCROLL_UP = 'scroll.up'; @@ -11,6 +12,7 @@ const BACKGROUND_ACTION_SET = new Set([ ]); const CONTENT_ACTION_SET = new Set([ + CMD_OPEN, SCROLL_UP, SCROLL_DOWN, SCROLL_TOP, -- cgit v1.2.3 From f66b7a1c2105bec2549f1fac640ff906a9d5184e Mon Sep 17 00:00:00 2001 From: Shin'ya Ueoka Date: Mon, 14 Aug 2017 21:51:15 +0900 Subject: fix command-line box --- src/content/footer-line.css | 21 ++++++++++++++++++-- src/content/footer-line.js | 48 ++++++++++++++++++++++++++++++++++++++++----- 2 files changed, 62 insertions(+), 7 deletions(-) (limited to 'src') diff --git a/src/content/footer-line.css b/src/content/footer-line.css index ce35143..041776c 100644 --- a/src/content/footer-line.css +++ b/src/content/footer-line.css @@ -19,9 +19,26 @@ padding: 0; } -.vimvixen-footerline-input{ +.vimvixen-footerline-container-outer { background-color: white; - bottom: 0; + 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%; diff --git a/src/content/footer-line.js b/src/content/footer-line.js index 2a931f3..39d8eaf 100644 --- a/src/content/footer-line.js +++ b/src/content/footer-line.js @@ -2,21 +2,37 @@ import './footer-line.css'; export default class FooterLine { constructor(doc) { + 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)); + } + + 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(this.input); + this.wrapper.append(containerOuter); doc.body.append(this.wrapper) - - this.input.addEventListener('blur', this.handleBlur.bind(this)); - this.input.addEventListener('keydown', this.handleKeydown.bind(this)); } focus() { @@ -27,13 +43,35 @@ export default class FooterLine { this.wrapper.remove(); } + onPromptChange(callback) { + this.promptChangeCallback = callback; + } + + onEntered(callback) { + this.enteredCallback = callback; + } + handleBlur() { this.remove(); } handleKeydown(e) { - if (e.keyCode === KeyboardEvent.DOM_VK_ESCAPE) { + 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; } } -- cgit v1.2.3 From 9a808f45ed4acba8c8dc8af4738c582ac417bd49 Mon Sep 17 00:00:00 2001 From: Shin'ya Ueoka Date: Tue, 15 Aug 2017 17:32:12 +0900 Subject: implement simple open/tabopen command --- src/background/commands.js | 2 ++ src/background/index.js | 54 +++++++++++++++++++++++++++++++--------------- src/content/index.js | 15 ++++++++++++- 3 files changed, 53 insertions(+), 18 deletions(-) create mode 100644 src/background/commands.js (limited to 'src') diff --git a/src/background/commands.js b/src/background/commands.js new file mode 100644 index 0000000..8bd52e5 --- /dev/null +++ b/src/background/commands.js @@ -0,0 +1,2 @@ +export const OPEN = 'open'; +export const TABOPEN = 'tabopen'; diff --git a/src/background/index.js b/src/background/index.js index 604ea92..e8882c5 100644 --- a/src/background/index.js +++ b/src/background/index.js @@ -1,18 +1,28 @@ import * as actions from '../shared/actions'; import * as tabs from './tabs'; +import * as commands from './commands'; import KeyQueue from './key-queue'; const queue = new KeyQueue(); -const keyDownHandle = (request) => { - return queue.push({ +const keyDownHandle = (request, sender, sendResponse) => { + let action = queue.push({ code: request.code, shift: request.shift, ctrl: request.ctrl, alt: request.alt, meta: request.meta - }) -} + }); + if (!action) { + return; + } + + if (actions.isBackgroundAction(action[0])) { + doBackgroundAction(sender, action); + } else if (actions.isContentAction(action[0])) { + sendResponse(action); + } +}; const doBackgroundAction = (sender, action) => { switch(action[0]) { @@ -25,22 +35,32 @@ const doBackgroundAction = (sender, action) => { } } -browser.runtime.onMessage.addListener((request, sender, sendResponse) => { - let action = null; - - switch (request.type) { - case 'event.keydown': - action = keyDownHandle(request); - break; - } +const normalizeUrl = (string) => { + return 'http://' + string; +} - if (action == null) { +const cmdEnterHandle = (request, sender) => { + let words = request.text.split(' ').filter((s) => s.length > 0); + switch (words[0]) { + case commands.OPEN: + browser.tabs.update(sender.tab.id, { url: normalizeUrl(words[1]) }); + return; + case commands.TABOPEN: + browser.tabs.create({ url: normalizeUrl(words[1]) }); return; } +}; - if (actions.isBackgroundAction(action[0])) { - doBackgroundAction(sender, action); - } else if (actions.isContentAction(action[0])) { - sendResponse(action); +browser.runtime.onMessage.addListener((request, sender, sendResponse) => { + switch (request.type) { + case 'event.keydown': + keyDownHandle(request, sender, sendResponse); + break; + case 'event.cmd.enter': + cmdEnterHandle(request, sender, sendResponse); + break; + case 'event.cmd.suggest': + // TODO make suggestion and return via sendResponse + break; } }); diff --git a/src/content/index.js b/src/content/index.js index 8cf0aed..ed33961 100644 --- a/src/content/index.js +++ b/src/content/index.js @@ -12,7 +12,20 @@ const invokeEvent = (action) => { switch (action[0]) { case actions.CMD_OPEN: footer = new FooterLine(document); - footer.input.value = ':'; + 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(); break; case actions.SCROLL_UP: -- cgit v1.2.3 From 36680ed8fe1d2b3d703affe400eb7e42a00e0df3 Mon Sep 17 00:00:00 2001 From: Shin'ya Ueoka Date: Tue, 15 Aug 2017 22:00:05 +0900 Subject: implement o/O command --- src/background/index.js | 6 +++++- src/background/key-queue.js | 2 ++ src/content/footer-line.js | 3 ++- src/content/index.js | 44 ++++++++++++++++++++++++++++---------------- src/shared/actions.js | 2 ++ 5 files changed, 39 insertions(+), 18 deletions(-) (limited to 'src') diff --git a/src/background/index.js b/src/background/index.js index e8882c5..8544c0f 100644 --- a/src/background/index.js +++ b/src/background/index.js @@ -36,7 +36,11 @@ const doBackgroundAction = (sender, action) => { } const normalizeUrl = (string) => { - return 'http://' + string; + try { + return new URL(string).href + } catch (e) { + return 'http://' + string; + } } const cmdEnterHandle = (request, sender) => { diff --git a/src/background/key-queue.js b/src/background/key-queue.js index acbb6e0..3f25791 100644 --- a/src/background/key-queue.js +++ b/src/background/key-queue.js @@ -3,6 +3,8 @@ import * as actions from '../shared/actions'; const DEFAULT_KEYMAP = [ { keys: [{ code: KeyboardEvent.DOM_VK_SEMICOLON, shift: true }], action: [ actions.CMD_OPEN ]}, + { keys: [{ code: KeyboardEvent.DOM_VK_O }], action: [ actions.CMD_TABS_OPEN, false ]}, + { keys: [{ code: KeyboardEvent.DOM_VK_O, shift: true }], action: [ actions.CMD_TABS_OPEN, true ]}, { keys: [{ code: KeyboardEvent.DOM_VK_K }], action: [ actions.SCROLL_UP, 1 ]}, { keys: [{ code: KeyboardEvent.DOM_VK_J }], action: [ actions.SCROLL_DOWN, 1 ]}, { keys: [{ code: KeyboardEvent.DOM_VK_G }, { code: KeyboardEvent.DOM_VK_G }], action: [ actions.SCROLL_TOP ]}, diff --git a/src/content/footer-line.js b/src/content/footer-line.js index 39d8eaf..fc1dc7b 100644 --- a/src/content/footer-line.js +++ b/src/content/footer-line.js @@ -1,7 +1,7 @@ import './footer-line.css'; export default class FooterLine { - constructor(doc) { + constructor(doc, initial = '') { this.initUi(doc); this.enteredCallback = () => {} @@ -10,6 +10,7 @@ export default class FooterLine { 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) { diff --git a/src/content/index.js b/src/content/index.js index ed33961..17ab308 100644 --- a/src/content/index.js +++ b/src/content/index.js @@ -4,6 +4,25 @@ 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; @@ -11,22 +30,15 @@ const invokeEvent = (action) => { switch (action[0]) { case actions.CMD_OPEN: - footer = new FooterLine(document); - 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(); + 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); diff --git a/src/shared/actions.js b/src/shared/actions.js index 4c9fec4..e1bf1e8 100644 --- a/src/shared/actions.js +++ b/src/shared/actions.js @@ -1,4 +1,5 @@ export const CMD_OPEN = 'cmd.open'; +export const CMD_TABS_OPEN = 'cmd.tabs.open'; export const TABS_PREV = 'tabs.prev'; export const TABS_NEXT = 'tabs.next'; export const SCROLL_UP = 'scroll.up'; @@ -13,6 +14,7 @@ const BACKGROUND_ACTION_SET = new Set([ const CONTENT_ACTION_SET = new Set([ CMD_OPEN, + CMD_TABS_OPEN, SCROLL_UP, SCROLL_DOWN, SCROLL_TOP, -- cgit v1.2.3 From dc860d32f50e2fc21a4f38663bfb0b9099a77513 Mon Sep 17 00:00:00 2001 From: Shin'ya Ueoka Date: Wed, 16 Aug 2017 20:26:02 +0900 Subject: implement d/u command --- manifest.json | 5 ++++- src/background/index.js | 6 ++++++ src/background/key-queue.js | 2 ++ src/background/tabs.js | 22 +++++++++++++++++++++- src/shared/actions.js | 4 ++++ 5 files changed, 37 insertions(+), 2 deletions(-) (limited to 'src') diff --git a/manifest.json b/manifest.json index 2621c5e..1d511fa 100644 --- a/manifest.json +++ b/manifest.json @@ -11,5 +11,8 @@ ], "background": { "scripts": ["build/background.js"] - } + }, + "permissions": [ + "sessions" + ] } diff --git a/src/background/index.js b/src/background/index.js index 8544c0f..f3bd65a 100644 --- a/src/background/index.js +++ b/src/background/index.js @@ -26,6 +26,12 @@ const keyDownHandle = (request, sender, sendResponse) => { const doBackgroundAction = (sender, action) => { switch(action[0]) { + case actions.TABS_CLOSE: + tabs.closeTab(sender.tab.id); + break; + case actions.TABS_REOPEN: + tabs.reopenTab(); + break; case actions.TABS_PREV: tabs.selectPrevTab(sender.tab.index, actions[1] || 1); break; diff --git a/src/background/key-queue.js b/src/background/key-queue.js index 3f25791..d753bc1 100644 --- a/src/background/key-queue.js +++ b/src/background/key-queue.js @@ -9,6 +9,8 @@ const DEFAULT_KEYMAP = [ { keys: [{ code: KeyboardEvent.DOM_VK_J }], action: [ actions.SCROLL_DOWN, 1 ]}, { keys: [{ code: KeyboardEvent.DOM_VK_G }, { code: KeyboardEvent.DOM_VK_G }], action: [ actions.SCROLL_TOP ]}, { keys: [{ code: KeyboardEvent.DOM_VK_G, shift: true }], action: [ actions.SCROLL_BOTTOM ]}, + { keys: [{ code: KeyboardEvent.DOM_VK_D }], action: [ actions.TABS_CLOSE ]}, + { keys: [{ code: KeyboardEvent.DOM_VK_U }], action: [ actions.TABS_REOPEN]}, { keys: [{ code: KeyboardEvent.DOM_VK_H }], action: [ actions.TABS_PREV, 1 ]}, { keys: [{ code: KeyboardEvent.DOM_VK_L }], action: [ actions.TABS_NEXT, 1 ]}, ] diff --git a/src/background/tabs.js b/src/background/tabs.js index 000bd7d..899284d 100644 --- a/src/background/tabs.js +++ b/src/background/tabs.js @@ -1,3 +1,23 @@ +const closeTab = (id) => { + browser.tabs.remove(id); +}; + +const reopenTab = () => { + browser.sessions.getRecentlyClosed({ + maxResults: 1 + }).then((sessions) => { + if (sessions.length === 0) { + return; + } + let session = sessions[0]; + if (session.tab) { + browser.sessions.restore(session.tab.sessionId); + } else { + browser.sessions.restore(session.window.sessionId); + } + }); +}; + const selectPrevTab = (current, count) => { chrome.tabs.query({ currentWindow: true }, (tabs) => { if (tabs.length < 2) { @@ -20,4 +40,4 @@ const selectNextTab = (current, count) => { }); }; -export { selectNextTab, selectPrevTab }; +export { closeTab, reopenTab, selectNextTab, selectPrevTab }; diff --git a/src/shared/actions.js b/src/shared/actions.js index e1bf1e8..be25d72 100644 --- a/src/shared/actions.js +++ b/src/shared/actions.js @@ -1,5 +1,7 @@ export const CMD_OPEN = 'cmd.open'; export const CMD_TABS_OPEN = 'cmd.tabs.open'; +export const TABS_CLOSE = 'tabs.close'; +export const TABS_REOPEN = 'tabs.reopen'; export const TABS_PREV = 'tabs.prev'; export const TABS_NEXT = 'tabs.next'; export const SCROLL_UP = 'scroll.up'; @@ -8,6 +10,8 @@ export const SCROLL_TOP = 'scroll.top'; export const SCROLL_BOTTOM = 'scroll.bottom'; const BACKGROUND_ACTION_SET = new Set([ + TABS_CLOSE, + TABS_REOPEN, TABS_PREV, TABS_NEXT ]); -- cgit v1.2.3