aboutsummaryrefslogtreecommitdiff
path: root/src/content
diff options
context:
space:
mode:
Diffstat (limited to 'src/content')
-rw-r--r--src/content/actions/operation.js21
-rw-r--r--src/content/components/common/follow.js16
-rw-r--r--src/content/components/common/keymapper.js3
-rw-r--r--src/content/components/top-content/follow-controller.js12
-rw-r--r--src/content/navigates.js49
-rw-r--r--src/content/scrolls.js163
-rw-r--r--src/content/urls.js26
7 files changed, 217 insertions, 73 deletions
diff --git a/src/content/actions/operation.js b/src/content/actions/operation.js
index 767f14b..b4b2e38 100644
--- a/src/content/actions/operation.js
+++ b/src/content/actions/operation.js
@@ -5,9 +5,12 @@ import * as navigates from 'content/navigates';
import * as urls from 'content/urls';
import * as consoleFrames from 'content/console-frames';
import * as addonActions from './addon';
+import * as properties from 'shared/settings/properties';
// eslint-disable-next-line complexity
-const exec = (operation) => {
+const exec = (operation, repeat, settings) => {
+ let smoothscroll = settings.properties.smoothscroll ||
+ properties.defaults.smoothscroll;
switch (operation.type) {
case operations.ADDON_ENABLE:
return addonActions.enable();
@@ -24,19 +27,19 @@ const exec = (operation) => {
type: messages.FIND_PREV,
}), '*');
case operations.SCROLL_VERTICALLY:
- return scrolls.scrollVertically(window, operation.count);
+ return scrolls.scrollVertically(operation.count, smoothscroll, repeat);
case operations.SCROLL_HORIZONALLY:
- return scrolls.scrollHorizonally(window, operation.count);
+ return scrolls.scrollHorizonally(operation.count, smoothscroll, repeat);
case operations.SCROLL_PAGES:
- return scrolls.scrollPages(window, operation.count);
+ return scrolls.scrollPages(operation.count, smoothscroll, repeat);
case operations.SCROLL_TOP:
- return scrolls.scrollTop(window);
+ return scrolls.scrollTop(smoothscroll, repeat);
case operations.SCROLL_BOTTOM:
- return scrolls.scrollBottom(window);
+ return scrolls.scrollBottom(smoothscroll, repeat);
case operations.SCROLL_HOME:
- return scrolls.scrollHome(window);
+ return scrolls.scrollHome(smoothscroll, repeat);
case operations.SCROLL_END:
- return scrolls.scrollEnd(window);
+ return scrolls.scrollEnd(smoothscroll, repeat);
case operations.FOLLOW_START:
return window.top.postMessage(JSON.stringify({
type: messages.FOLLOW_START,
@@ -60,6 +63,8 @@ const exec = (operation) => {
type: messages.CONSOLE_SHOW_INFO,
text: 'Current url yanked',
});
+ case operations.URLS_PASTE:
+ return urls.paste(window, operation.newTab ? operation.newTab : false);
default:
browser.runtime.sendMessage({
type: messages.BACKGROUND_OPERATION,
diff --git a/src/content/components/common/follow.js b/src/content/components/common/follow.js
index 7717154..42dd897 100644
--- a/src/content/components/common/follow.js
+++ b/src/content/components/common/follow.js
@@ -30,6 +30,21 @@ const inViewport = (win, element, viewSize, framePosition) => {
return true;
};
+const isAriaHiddenOrAriaDisabled = (win, element) => {
+ if (!element || win.document.documentElement === element) {
+ return false;
+ }
+ for (let attr of ['aria-hidden', 'aria-disabled']) {
+ if (element.hasAttribute(attr)) {
+ let hidden = element.getAttribute(attr).toLowerCase();
+ if (hidden === '' || hidden === 'true') {
+ return true;
+ }
+ }
+ }
+ return isAriaHiddenOrAriaDisabled(win, element.parentNode);
+};
+
export default class Follow {
constructor(win, store) {
this.win = win;
@@ -171,6 +186,7 @@ export default class Follow {
style.visibility !== 'hidden' &&
element.type !== 'hidden' &&
element.offsetHeight > 0 &&
+ !isAriaHiddenOrAriaDisabled(win, element) &&
inViewport(win, element, viewSize, framePosition);
});
return filtered;
diff --git a/src/content/components/common/keymapper.js b/src/content/components/common/keymapper.js
index fb8fabe..d9d1b2f 100644
--- a/src/content/components/common/keymapper.js
+++ b/src/content/components/common/keymapper.js
@@ -47,7 +47,8 @@ export default class KeymapperComponent {
return true;
}
let operation = keymaps.get(matched[0]);
- this.store.dispatch(operationActions.exec(operation));
+ this.store.dispatch(operationActions.exec(
+ operation, key.repeat, state.setting));
this.store.dispatch(inputActions.clearKeys());
return true;
}
diff --git a/src/content/components/top-content/follow-controller.js b/src/content/components/top-content/follow-controller.js
index d373177..1e7f3cd 100644
--- a/src/content/components/top-content/follow-controller.js
+++ b/src/content/components/top-content/follow-controller.js
@@ -1,8 +1,7 @@
import * as followControllerActions from 'content/actions/follow-controller';
import messages from 'shared/messages';
import HintKeyProducer from 'content/hint-key-producer';
-
-const DEFAULT_HINT_CHARSET = 'abcdefghijklmnopqrstuvwxyz';
+import * as properties from 'shared/settings/properties';
const broadcastMessage = (win, message) => {
let json = JSON.stringify(message);
@@ -84,7 +83,7 @@ export default class FollowController {
this.store.dispatch(followControllerActions.backspace());
break;
default:
- if (DEFAULT_HINT_CHARSET.includes(key)) {
+ if (this.hintchars().includes(key)) {
this.store.dispatch(followControllerActions.keyPress(key));
}
break;
@@ -93,7 +92,7 @@ export default class FollowController {
}
count() {
- this.producer = new HintKeyProducer(DEFAULT_HINT_CHARSET);
+ this.producer = new HintKeyProducer(this.hintchars());
let doc = this.win.document;
let viewWidth = this.win.innerWidth || doc.documentElement.clientWidth;
let viewHeight = this.win.innerHeight || doc.documentElement.clientHeight;
@@ -135,4 +134,9 @@ export default class FollowController {
type: messages.FOLLOW_REMOVE_HINTS,
});
}
+
+ hintchars() {
+ return this.store.getState().setting.properties.hintchars ||
+ properties.defaults.hintchars;
+ }
}
diff --git a/src/content/navigates.js b/src/content/navigates.js
index 3e12a6f..c9baa30 100644
--- a/src/content/navigates.js
+++ b/src/content/navigates.js
@@ -1,18 +1,18 @@
-const PREV_LINK_PATTERNS = [
- /\bprev\b/i, /\bprevious\b/i, /\bback\b/i,
- /</, /\u2039/, /\u2190/, /\xab/, /\u226a/, /<</
-];
-
-const NEXT_LINK_PATTERNS = [
- /\bnext\b/i,
- />/, /\u203a/, /\u2192/, /\xbb/, /\u226b/, />>/
-];
-
-const findLinkByPatterns = (win, patterns) => {
- const links = win.document.getElementsByTagName('a');
- return Array.prototype.find.call(links, (link) => {
- return patterns.some(ptn => ptn.test(link.textContent));
- });
+const REL_PATTERN = {
+ prev: /^(?:prev(?:ious)?|older)\b|\u2039|\u2190|\xab|\u226a|<</i,
+ next: /^(?:next|newer)\b|\u203a|\u2192|\xbb|\u226b|>>/i,
+};
+
+// Return the last element in the document matching the supplied selector
+// and the optional filter, or null if there are no matches.
+const selectLast = (win, selector, filter) => {
+ let nodes = win.document.querySelectorAll(selector);
+
+ if (filter) {
+ nodes = Array.from(nodes).filter(filter);
+ }
+
+ return nodes.length ? nodes[nodes.length - 1] : null;
};
const historyPrev = (win) => {
@@ -23,16 +23,21 @@ const historyNext = (win) => {
win.history.forward();
};
-const linkCommon = (win, rel, patterns) => {
- let link = win.document.querySelector(`link[rel~=${rel}][href]`);
+// Code common to linkPrev and linkNext which navigates to the specified page.
+const linkRel = (win, rel) => {
+ let link = selectLast(win, `link[rel~=${rel}][href]`);
if (link) {
- win.location = link.getAttribute('href');
+ win.location = link.href;
return;
}
- link = win.document.querySelector(`a[rel~=${rel}]`) ||
- findLinkByPatterns(win, patterns);
+ const pattern = REL_PATTERN[rel];
+
+ link = selectLast(win, `a[rel~=${rel}][href]`) ||
+ // `innerText` is much slower than `textContent`, but produces much better
+ // (i.e. less unexpected) results
+ selectLast(win, 'a[href]', lnk => pattern.test(lnk.innerText));
if (link) {
link.click();
@@ -40,11 +45,11 @@ const linkCommon = (win, rel, patterns) => {
};
const linkPrev = (win) => {
- linkCommon(win, 'prev', PREV_LINK_PATTERNS);
+ linkRel(win, 'prev');
};
const linkNext = (win) => {
- linkCommon(win, 'next', NEXT_LINK_PATTERNS);
+ linkRel(win, 'next');
};
const parent = (win) => {
diff --git a/src/content/scrolls.js b/src/content/scrolls.js
index ef38273..e8e9642 100644
--- a/src/content/scrolls.js
+++ b/src/content/scrolls.js
@@ -1,7 +1,11 @@
const SCROLL_DELTA_X = 48;
const SCROLL_DELTA_Y = 48;
+const SMOOTH_SCROLL_DURATION = 150;
-const isVisible = (win, element) => {
+// 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;
@@ -9,19 +13,19 @@ const isVisible = (win, element) => {
if (rect.right < 0 && rect.bottom < 0) {
return false;
}
- if (win.innerWidth < rect.left && win.innerHeight < rect.top) {
+ if (window.innerWidth < rect.left && window.innerHeight < rect.top) {
return false;
}
- let { display, visibility } = win.getComputedStyle(element);
+ let { display, visibility } = window.getComputedStyle(element);
if (display === 'none' || visibility === 'hidden') {
return false;
}
return true;
};
-const isScrollableStyle = (win, element) => {
- let { overflowX, overflowY } = win.getComputedStyle(element);
+const isScrollableStyle = (element) => {
+ let { overflowX, overflowY } = window.getComputedStyle(element);
return !(overflowX !== 'scroll' && overflowX !== 'auto' &&
overflowY !== 'scroll' && overflowY !== 'auto');
};
@@ -35,15 +39,15 @@ const isOverflowed = (element) => {
// this method is called by each scrolling, and the returned value of this
// method is not cached. That does not cause performance issue because in the
// most pages, the window is root element i,e, documentElement.
-const findScrollable = (win, element) => {
- if (isScrollableStyle(win, element) && isOverflowed(element)) {
+const findScrollable = (element) => {
+ if (isScrollableStyle(element) && isOverflowed(element)) {
return element;
}
let children = Array.prototype
- .filter.call(element.children, e => isVisible(win, e));
+ .filter.call(element.children, e => isVisible(e));
for (let child of children) {
- let scrollable = findScrollable(win, child);
+ let scrollable = findScrollable(child);
if (scrollable) {
return scrollable;
}
@@ -51,68 +55,153 @@ const findScrollable = (win, element) => {
return null;
};
-const scrollTarget = (win) => {
- if (isOverflowed(win.document.documentElement)) {
- return win.document.documentElement;
+const scrollTarget = () => {
+ if (isOverflowed(window.document.documentElement)) {
+ return window.document.documentElement;
}
- if (isOverflowed(win.document.body)) {
- return win.document.body;
+ if (isOverflowed(window.document.body)) {
+ return window.document.body;
}
- let target = findScrollable(win, win.document.documentElement);
+ let target = findScrollable(window.document.documentElement);
if (target) {
return target;
}
- return win.document.documentElement;
+ return window.document.documentElement;
};
-const scrollVertically = (win, count) => {
- let target = scrollTarget(win);
+class SmoothScroller {
+ constructor(element, repeat) {
+ this.element = element;
+ this.repeat = repeat;
+ this.scrolling = scrolling;
+ if (repeat) {
+ this.easing = SmoothScroller.linearEasing;
+ } else {
+ this.easing = SmoothScroller.inOutQuadEasing;
+ }
+ }
+
+ scroll(x, y) {
+ if (this.scrolling[0]) {
+ return;
+ }
+ scrolling[0] = true;
+
+ this.startX = this.element.scrollLeft;
+ this.startY = this.element.scrollTop;
+
+ this.targetX = x;
+ this.targetY = y;
+ this.distanceX = x - this.startX;
+ this.distanceY = y - this.startY;
+ this.timeStart = 0;
+
+ window.requestAnimationFrame(this.loop.bind(this));
+ }
+
+ loop(time) {
+ if (!this.timeStart) {
+ this.timeStart = time;
+ }
+
+ let elapsed = time - this.timeStart;
+ let v = this.easing(elapsed / SMOOTH_SCROLL_DURATION);
+ let nextX = this.startX + this.distanceX * v;
+ let nextY = this.startY + this.distanceY * v;
+
+ window.scrollTo(nextX, nextY);
+
+ if (elapsed < SMOOTH_SCROLL_DURATION) {
+ window.requestAnimationFrame(this.loop.bind(this));
+ } else {
+ scrolling[0] = false;
+ this.element.scrollTo(this.targetX, this.targetY);
+ }
+ }
+
+ static inOutQuadEasing(t) {
+ if (t < 1) {
+ return t * t;
+ }
+ return -(t - 1) * (t - 1) + 1;
+ }
+
+ static linearEasing(t) {
+ return t;
+ }
+}
+
+class RoughtScroller {
+ constructor(element) {
+ this.element = element;
+ }
+
+ scroll(x, y) {
+ this.element.scrollTo(x, y);
+ }
+}
+
+const scroller = (element, smooth, repeat) => {
+ if (smooth) {
+ return new SmoothScroller(element, repeat);
+ }
+ return new RoughtScroller(element);
+};
+
+const scrollVertically = (count, smooth, repeat) => {
+ let target = scrollTarget();
let x = target.scrollLeft;
let y = target.scrollTop + SCROLL_DELTA_Y * count;
- target.scrollTo(x, y);
+ if (repeat && smooth) {
+ y = target.scrollTop + SCROLL_DELTA_Y * count * 4;
+ }
+ scroller(target, smooth, repeat).scroll(x, y);
};
-const scrollHorizonally = (win, count) => {
- let target = scrollTarget(win);
+const scrollHorizonally = (count, smooth, repeat) => {
+ let target = scrollTarget();
let x = target.scrollLeft + SCROLL_DELTA_X * count;
let y = target.scrollTop;
- target.scrollTo(x, y);
+ if (repeat && smooth) {
+ y = target.scrollTop + SCROLL_DELTA_Y * count * 4;
+ }
+ scroller(target, smooth, repeat).scroll(x, y);
};
-const scrollPages = (win, count) => {
- let target = scrollTarget(win);
+const scrollPages = (count, smooth, repeat) => {
+ let target = scrollTarget();
let height = target.clientHeight;
let x = target.scrollLeft;
let y = target.scrollTop + height * count;
- target.scrollTo(x, y);
+ scroller(target, smooth, repeat).scroll(x, y);
};
-const scrollTop = (win) => {
- let target = scrollTarget(win);
+const scrollTop = (smooth, repeat) => {
+ let target = scrollTarget();
let x = target.scrollLeft;
let y = 0;
- target.scrollTo(x, y);
+ scroller(target, smooth, repeat).scroll(x, y);
};
-const scrollBottom = (win) => {
- let target = scrollTarget(win);
+const scrollBottom = (smooth, repeat) => {
+ let target = scrollTarget();
let x = target.scrollLeft;
let y = target.scrollHeight;
- target.scrollTo(x, y);
+ scroller(target, smooth, repeat).scroll(x, y);
};
-const scrollHome = (win) => {
- let target = scrollTarget(win);
+const scrollHome = (smooth, repeat) => {
+ let target = scrollTarget();
let x = 0;
let y = target.scrollTop;
- target.scrollTo(x, y);
+ scroller(target, smooth, repeat).scroll(x, y);
};
-const scrollEnd = (win) => {
- let target = scrollTarget(win);
+const scrollEnd = (smooth, repeat) => {
+ let target = scrollTarget();
let x = target.scrollWidth;
let y = target.scrollTop;
- target.scrollTo(x, y);
+ scroller(target, smooth, repeat).scroll(x, y);
};
export {
diff --git a/src/content/urls.js b/src/content/urls.js
index 8f8a1ac..9b7b284 100644
--- a/src/content/urls.js
+++ b/src/content/urls.js
@@ -1,3 +1,5 @@
+import messages from 'shared/messages';
+
const yank = (win) => {
let input = win.document.createElement('input');
win.document.body.append(input);
@@ -12,4 +14,26 @@ const yank = (win) => {
input.remove();
};
-export { yank };
+const paste = (win, newTab) => {
+ let textarea = win.document.createElement('textarea');
+ win.document.body.append(textarea);
+
+ textarea.style.position = 'fixed';
+ textarea.style.top = '-100px';
+ textarea.contentEditable = 'true';
+ textarea.focus();
+
+ if (win.document.execCommand('paste')) {
+ if (/^(https?|ftp):\/\//.test(textarea.textContent)) {
+ browser.runtime.sendMessage({
+ type: messages.OPEN_URL,
+ url: textarea.textContent,
+ newTab: newTab ? newTab : false,
+ });
+ }
+ }
+
+ textarea.remove();
+};
+
+export { yank, paste };