diff --git a/src/content/actions/operation.js b/src/content/actions/operation.js index d2e258c..1c0a5fb 100644 --- a/src/content/actions/operation.js +++ b/src/content/actions/operation.js @@ -8,7 +8,7 @@ import * as addonActions from './addon'; import * as properties from 'shared/settings/properties'; // eslint-disable-next-line complexity -const exec = (operation, settings) => { +const exec = (operation, repeat, settings) => { let smoothscroll = settings.properties.smoothscroll || properties.defaults.smoothscroll; switch (operation.type) { @@ -27,19 +27,19 @@ const exec = (operation, settings) => { type: messages.FIND_PREV, }), '*'); case operations.SCROLL_VERTICALLY: - return scrolls.scrollVertically(operation.count, smoothscroll); + return scrolls.scrollVertically(operation.count, smoothscroll, repeat); case operations.SCROLL_HORIZONALLY: - return scrolls.scrollHorizonally(operation.count, smoothscroll); + return scrolls.scrollHorizonally(operation.count, smoothscroll, repeat); case operations.SCROLL_PAGES: - return scrolls.scrollPages(operation.count, smoothscroll); + return scrolls.scrollPages(operation.count, smoothscroll, repeat); case operations.SCROLL_TOP: - return scrolls.scrollTop(smoothscroll); + return scrolls.scrollTop(smoothscroll, repeat); case operations.SCROLL_BOTTOM: - return scrolls.scrollBottom(smoothscroll); + return scrolls.scrollBottom(smoothscroll, repeat); case operations.SCROLL_HOME: - return scrolls.scrollHome(smoothscroll); + return scrolls.scrollHome(smoothscroll, repeat); case operations.SCROLL_END: - return scrolls.scrollEnd(smoothscroll); + return scrolls.scrollEnd(smoothscroll, repeat); case operations.FOLLOW_START: return window.top.postMessage(JSON.stringify({ type: messages.FOLLOW_START, diff --git a/src/content/components/common/keymapper.js b/src/content/components/common/keymapper.js index fa8c33a..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, state.setting)); + this.store.dispatch(operationActions.exec( + operation, key.repeat, state.setting)); this.store.dispatch(inputActions.clearKeys()); return true; } diff --git a/src/content/scrolls.js b/src/content/scrolls.js index 2fe06c0..e8e9642 100644 --- a/src/content/scrolls.js +++ b/src/content/scrolls.js @@ -2,6 +2,9 @@ const SCROLL_DELTA_X = 48; const SCROLL_DELTA_Y = 48; 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) { @@ -67,11 +70,23 @@ const scrollTarget = () => { }; class SmoothScroller { - constructor(element) { + 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; @@ -99,17 +114,21 @@ class SmoothScroller { if (elapsed < SMOOTH_SCROLL_DURATION) { window.requestAnimationFrame(this.loop.bind(this)); } else { + scrolling[0] = false; this.element.scrollTo(this.targetX, this.targetY); } } - // in-out quad easing - easing(t) { + static inOutQuadEasing(t) { if (t < 1) { return t * t; } return -(t - 1) * (t - 1) + 1; } + + static linearEasing(t) { + return t; + } } class RoughtScroller { @@ -122,61 +141,67 @@ class RoughtScroller { } } -const scroller = (element, smooth) => { +const scroller = (element, smooth, repeat) => { if (smooth) { - return new SmoothScroller(element); + return new SmoothScroller(element, repeat); } return new RoughtScroller(element); }; -const scrollVertically = (count, smooth) => { +const scrollVertically = (count, smooth, repeat) => { let target = scrollTarget(); let x = target.scrollLeft; let y = target.scrollTop + SCROLL_DELTA_Y * count; - scroller(target, smooth).scroll(x, y); + if (repeat && smooth) { + y = target.scrollTop + SCROLL_DELTA_Y * count * 4; + } + scroller(target, smooth, repeat).scroll(x, y); }; -const scrollHorizonally = (count, smooth) => { +const scrollHorizonally = (count, smooth, repeat) => { let target = scrollTarget(); let x = target.scrollLeft + SCROLL_DELTA_X * count; let y = target.scrollTop; - scroller(target, smooth).scroll(x, y); + if (repeat && smooth) { + y = target.scrollTop + SCROLL_DELTA_Y * count * 4; + } + scroller(target, smooth, repeat).scroll(x, y); }; -const scrollPages = (count, smooth) => { +const scrollPages = (count, smooth, repeat) => { let target = scrollTarget(); let height = target.clientHeight; let x = target.scrollLeft; let y = target.scrollTop + height * count; - scroller(target, smooth).scroll(x, y); + scroller(target, smooth, repeat).scroll(x, y); }; -const scrollTop = (smooth) => { +const scrollTop = (smooth, repeat) => { let target = scrollTarget(); let x = target.scrollLeft; let y = 0; - scroller(target, smooth).scroll(x, y); + scroller(target, smooth, repeat).scroll(x, y); }; -const scrollBottom = (smooth) => { +const scrollBottom = (smooth, repeat) => { let target = scrollTarget(); let x = target.scrollLeft; let y = target.scrollHeight; - scroller(target, smooth).scroll(x, y); + scroller(target, smooth, repeat).scroll(x, y); }; -const scrollHome = (smooth) => { +const scrollHome = (smooth, repeat) => { let target = scrollTarget(); let x = 0; let y = target.scrollTop; - scroller(target, smooth).scroll(x, y); + scroller(target, smooth, repeat).scroll(x, y); }; -const scrollEnd = (smooth) => { +const scrollEnd = (smooth, repeat) => { let target = scrollTarget(); let x = target.scrollWidth; let y = target.scrollTop; - scroller(target, smooth).scroll(x, y); + scroller(target, smooth, repeat).scroll(x, y); }; export { diff --git a/src/shared/utils/keys.js b/src/shared/utils/keys.js index fba8ce3..8a86dfb 100644 --- a/src/shared/utils/keys.js +++ b/src/shared/utils/keys.js @@ -18,6 +18,7 @@ const fromKeyboardEvent = (e) => { return { key: modifierdKeyName(e.key), + repeat: e.repeat, shiftKey: shift, ctrlKey: e.ctrlKey, altKey: e.altKey,