diff --git a/README.md b/README.md
index 5703a25..75b50a7 100644
--- a/README.md
+++ b/README.md
@@ -50,6 +50,7 @@ The default mappings are as follows:
- [[, ]]: find prev or next links and open it
- gu: go to parent directory
- gU: go to root directory
+- gi, G: focus first input
#### Misc
- zi, zo: zoom-in/zoom-out
diff --git a/src/content/actions/operation.js b/src/content/actions/operation.js
index b4b2e38..5fd0f48 100644
--- a/src/content/actions/operation.js
+++ b/src/content/actions/operation.js
@@ -2,6 +2,7 @@ import operations from 'shared/operations';
import messages from 'shared/messages';
import * as scrolls from 'content/scrolls';
import * as navigates from 'content/navigates';
+import * as focuses from 'content/focuses';
import * as urls from 'content/urls';
import * as consoleFrames from 'content/console-frames';
import * as addonActions from './addon';
@@ -57,6 +58,8 @@ const exec = (operation, repeat, settings) => {
return navigates.parent(window);
case operations.NAVIGATE_ROOT:
return navigates.root(window);
+ case operations.FOCUS_INPUT:
+ return focuses.focusInput();
case operations.URLS_YANK:
urls.yank(window);
return consoleFrames.postMessage(window.document, {
diff --git a/src/content/focuses.js b/src/content/focuses.js
new file mode 100644
index 0000000..a6f6cc8
--- /dev/null
+++ b/src/content/focuses.js
@@ -0,0 +1,13 @@
+import * as doms from 'shared/utils/dom';
+
+const focusInput = () => {
+ let inputTypes = ['email', 'number', 'search', 'tel', 'text', 'url'];
+ let inputSelector = inputTypes.map(type => `input[type=${type}]`).join(',');
+ let targets = window.document.querySelectorAll(inputSelector + ',textarea');
+ let target = Array.from(targets).find(doms.isVisible);
+ if (target) {
+ target.focus();
+ }
+};
+
+export { focusInput };
diff --git a/src/content/scrolls.js b/src/content/scrolls.js
index e8e9642..0d1f7c8 100644
--- a/src/content/scrolls.js
+++ b/src/content/scrolls.js
@@ -1,3 +1,5 @@
+import * as doms from 'shared/utils/dom';
+
const SCROLL_DELTA_X = 48;
const SCROLL_DELTA_Y = 48;
const SMOOTH_SCROLL_DURATION = 150;
@@ -5,25 +7,6 @@ const SMOOTH_SCROLL_DURATION = 150;
// dirty way to store scrolling state on globally
let scrolling = [false];
-const isVisible = (element) => {
- let rect = element.getBoundingClientRect();
- if (rect.width === 0 || rect.height === 0) {
- return false;
- }
- if (rect.right < 0 && rect.bottom < 0) {
- return false;
- }
- if (window.innerWidth < rect.left && window.innerHeight < rect.top) {
- return false;
- }
-
- let { display, visibility } = window.getComputedStyle(element);
- if (display === 'none' || visibility === 'hidden') {
- return false;
- }
- return true;
-};
-
const isScrollableStyle = (element) => {
let { overflowX, overflowY } = window.getComputedStyle(element);
return !(overflowX !== 'scroll' && overflowX !== 'auto' &&
@@ -44,8 +27,7 @@ const findScrollable = (element) => {
return element;
}
- let children = Array.prototype
- .filter.call(element.children, e => isVisible(e));
+ let children = Array.from(element.children).filter(doms.isVisible);
for (let child of children) {
let scrollable = findScrollable(child);
if (scrollable) {
diff --git a/src/settings/components/form/keymaps-form.jsx b/src/settings/components/form/keymaps-form.jsx
index 4e08616..0e4a223 100644
--- a/src/settings/components/form/keymaps-form.jsx
+++ b/src/settings/components/form/keymaps-form.jsx
@@ -36,6 +36,7 @@ const KeyMapFields = [
['navigate.link.prev', 'Open previous link'],
['navigate.parent', 'Go to parent directory'],
['navigate.root', 'Go to root directory'],
+ ['focus.input', 'Focus input'],
], [
['find.start', 'Start find mode'],
['find.next', 'Find next word'],
diff --git a/src/shared/operations.js b/src/shared/operations.js
index 4172f8b..008e9eb 100644
--- a/src/shared/operations.js
+++ b/src/shared/operations.js
@@ -31,6 +31,9 @@ export default {
NAVIGATE_PARENT: 'navigate.parent',
NAVIGATE_ROOT: 'navigate.root',
+ // Focus
+ FOCUS_INPUT: 'focus.input',
+
// Tabs
TAB_CLOSE: 'tabs.close',
TAB_CLOSE_FORCE: 'tabs.close.force',
diff --git a/src/shared/settings/default.js b/src/shared/settings/default.js
index c85a079..3c4dcac 100644
--- a/src/shared/settings/default.js
+++ b/src/shared/settings/default.js
@@ -45,6 +45,7 @@ export default {
"]]": { "type": "navigate.link.next" },
"gu": { "type": "navigate.parent" },
"gU": { "type": "navigate.root" },
+ "gi": { "type": "focus.input" },
"y": { "type": "urls.yank" },
"p": { "type": "urls.paste", "newTab": false },
"P": { "type": "urls.paste", "newTab": true },
diff --git a/src/shared/utils/dom.js b/src/shared/utils/dom.js
index d4fd68a..f138c33 100644
--- a/src/shared/utils/dom.js
+++ b/src/shared/utils/dom.js
@@ -81,4 +81,26 @@ const viewportRect = (e) => {
};
};
-export { isContentEditable, viewportRect };
+const isVisible = (element) => {
+ let rect = element.getBoundingClientRect();
+ if (rect.width === 0 || rect.height === 0) {
+ return false;
+ }
+ if (rect.right < 0 && rect.bottom < 0) {
+ return false;
+ }
+ if (window.innerWidth < rect.left && window.innerHeight < rect.top) {
+ return false;
+ }
+ if (element.nodeName === 'INPUT' && element.type.toLowerCase() === 'hidden') {
+ return false;
+ }
+
+ let { display, visibility } = window.getComputedStyle(element);
+ if (display === 'none' || visibility === 'hidden') {
+ return false;
+ }
+ return true;
+};
+
+export { isContentEditable, viewportRect, isVisible };