From 057a0b8a4608939af1208b8946876d849e873d37 Mon Sep 17 00:00:00 2001
From: Shin'ya Ueoka <ueokande@i-beam.org>
Date: Sat, 13 Jan 2018 14:48:53 +0900
Subject: remove window from scrolls

---
 src/content/scrolls.js | 60 +++++++++++++++++++++++++-------------------------
 1 file changed, 30 insertions(+), 30 deletions(-)

(limited to 'src/content/scrolls.js')

diff --git a/src/content/scrolls.js b/src/content/scrolls.js
index ef38273..251b222 100644
--- a/src/content/scrolls.js
+++ b/src/content/scrolls.js
@@ -1,7 +1,7 @@
 const SCROLL_DELTA_X = 48;
 const SCROLL_DELTA_Y = 48;
 
-const isVisible = (win, element) => {
+const isVisible = (element) => {
   let rect = element.getBoundingClientRect();
   if (rect.width === 0 || rect.height === 0) {
     return false;
@@ -9,19 +9,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 +35,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,65 +51,65 @@ 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);
+const scrollVertically = (count) => {
+  let target = scrollTarget();
   let x = target.scrollLeft;
   let y = target.scrollTop + SCROLL_DELTA_Y * count;
   target.scrollTo(x, y);
 };
 
-const scrollHorizonally = (win, count) => {
-  let target = scrollTarget(win);
+const scrollHorizonally = (count) => {
+  let target = scrollTarget();
   let x = target.scrollLeft + SCROLL_DELTA_X * count;
   let y = target.scrollTop;
   target.scrollTo(x, y);
 };
 
-const scrollPages = (win, count) => {
-  let target = scrollTarget(win);
+const scrollPages = (count) => {
+  let target = scrollTarget();
   let height = target.clientHeight;
   let x = target.scrollLeft;
   let y = target.scrollTop + height * count;
   target.scrollTo(x, y);
 };
 
-const scrollTop = (win) => {
-  let target = scrollTarget(win);
+const scrollTop = () => {
+  let target = scrollTarget();
   let x = target.scrollLeft;
   let y = 0;
   target.scrollTo(x, y);
 };
 
-const scrollBottom = (win) => {
-  let target = scrollTarget(win);
+const scrollBottom = () => {
+  let target = scrollTarget();
   let x = target.scrollLeft;
   let y = target.scrollHeight;
   target.scrollTo(x, y);
 };
 
-const scrollHome = (win) => {
-  let target = scrollTarget(win);
+const scrollHome = () => {
+  let target = scrollTarget();
   let x = 0;
   let y = target.scrollTop;
   target.scrollTo(x, y);
 };
 
-const scrollEnd = (win) => {
-  let target = scrollTarget(win);
+const scrollEnd = () => {
+  let target = scrollTarget();
   let x = target.scrollWidth;
   let y = target.scrollTop;
   target.scrollTo(x, y);
-- 
cgit v1.2.3


From 42839161bbb1d79c0072b2c2c4cfe67a97f68c97 Mon Sep 17 00:00:00 2001
From: Shin'ya Ueoka <ueokande@i-beam.org>
Date: Sat, 13 Jan 2018 15:24:03 +0900
Subject: add smooth scroll

---
 src/content/scrolls.js | 57 +++++++++++++++++++++++++++++++++++++++++++-------
 1 file changed, 50 insertions(+), 7 deletions(-)

(limited to 'src/content/scrolls.js')

diff --git a/src/content/scrolls.js b/src/content/scrolls.js
index 251b222..8daa36f 100644
--- a/src/content/scrolls.js
+++ b/src/content/scrolls.js
@@ -1,5 +1,6 @@
 const SCROLL_DELTA_X = 48;
 const SCROLL_DELTA_Y = 48;
+const SMOOTH_SCROLL_DURATION = 150;
 
 const isVisible = (element) => {
   let rect = element.getBoundingClientRect();
@@ -65,18 +66,60 @@ const scrollTarget = () => {
   return window.document.documentElement;
 };
 
+const easing = (t) => {
+  if (t < 1) {
+    return t * t;
+  }
+  return -(t - 1) * (t - 1) + 1;
+};
+
+const smoothScroll = (element, x, y) => {
+
+  let startX = element.scrollTop;
+  let startY = element.scrollTop;
+
+  let distanceX = x - startX;
+  let distanceY = y - startY;
+  let timeStart = 0;
+
+  const loop = (timeCurrent) => {
+    if (!timeStart) {
+      timeStart = timeCurrent;
+    }
+
+    let timeElapsed = timeCurrent - timeStart;
+    let t = timeElapsed / SMOOTH_SCROLL_DURATION;
+    let nextX = startX + distanceX * easing(t);
+    let nextY = startY + distanceY * easing(t);
+
+    window.scrollTo(nextX, nextY);
+
+    if (timeElapsed < SMOOTH_SCROLL_DURATION) {
+      window.requestAnimationFrame(loop);
+    } else {
+      element.scrollTo(x, y);
+    }
+  };
+
+  window.requestAnimationFrame(loop);
+};
+
+const roughScroll = (element, x, y) => {
+  element.scrollTo(x, y);
+};
+
 const scrollVertically = (count) => {
   let target = scrollTarget();
   let x = target.scrollLeft;
   let y = target.scrollTop + SCROLL_DELTA_Y * count;
-  target.scrollTo(x, y);
+  roughScroll(target, x, y);
 };
 
 const scrollHorizonally = (count) => {
   let target = scrollTarget();
   let x = target.scrollLeft + SCROLL_DELTA_X * count;
   let y = target.scrollTop;
-  target.scrollTo(x, y);
+  roughScroll(target, x, y);
 };
 
 const scrollPages = (count) => {
@@ -84,35 +127,35 @@ const scrollPages = (count) => {
   let height = target.clientHeight;
   let x = target.scrollLeft;
   let y = target.scrollTop + height * count;
-  target.scrollTo(x, y);
+  roughScroll(target, x, y);
 };
 
 const scrollTop = () => {
   let target = scrollTarget();
   let x = target.scrollLeft;
   let y = 0;
-  target.scrollTo(x, y);
+  roughScroll(target, x, y);
 };
 
 const scrollBottom = () => {
   let target = scrollTarget();
   let x = target.scrollLeft;
   let y = target.scrollHeight;
-  target.scrollTo(x, y);
+  roughScroll(target, x, y);
 };
 
 const scrollHome = () => {
   let target = scrollTarget();
   let x = 0;
   let y = target.scrollTop;
-  target.scrollTo(x, y);
+  roughScroll(target, x, y);
 };
 
 const scrollEnd = () => {
   let target = scrollTarget();
   let x = target.scrollWidth;
   let y = target.scrollTop;
-  target.scrollTo(x, y);
+  roughScroll(target, x, y);
 };
 
 export {
-- 
cgit v1.2.3


From 2ca1b54faacb261e5a25331e030da13d07c09662 Mon Sep 17 00:00:00 2001
From: Shin'ya Ueoka <ueokande@i-beam.org>
Date: Sat, 13 Jan 2018 15:31:39 +0900
Subject: add smoothscroll property

---
 src/content/actions/operation.js           | 19 +++++++++-------
 src/content/components/common/keymapper.js |  2 +-
 src/content/scrolls.js                     | 36 ++++++++++++++++++------------
 src/shared/settings/properties.js          |  2 ++
 4 files changed, 36 insertions(+), 23 deletions(-)

(limited to 'src/content/scrolls.js')

diff --git a/src/content/actions/operation.js b/src/content/actions/operation.js
index 8157127..d2e258c 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, 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(operation.count);
+    return scrolls.scrollVertically(operation.count, smoothscroll);
   case operations.SCROLL_HORIZONALLY:
-    return scrolls.scrollHorizonally(operation.count);
+    return scrolls.scrollHorizonally(operation.count, smoothscroll);
   case operations.SCROLL_PAGES:
-    return scrolls.scrollPages(operation.count);
+    return scrolls.scrollPages(operation.count, smoothscroll);
   case operations.SCROLL_TOP:
-    return scrolls.scrollTop();
+    return scrolls.scrollTop(smoothscroll);
   case operations.SCROLL_BOTTOM:
-    return scrolls.scrollBottom();
+    return scrolls.scrollBottom(smoothscroll);
   case operations.SCROLL_HOME:
-    return scrolls.scrollHome();
+    return scrolls.scrollHome(smoothscroll);
   case operations.SCROLL_END:
-    return scrolls.scrollEnd();
+    return scrolls.scrollEnd(smoothscroll);
   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 fb8fabe..fa8c33a 100644
--- a/src/content/components/common/keymapper.js
+++ b/src/content/components/common/keymapper.js
@@ -47,7 +47,7 @@ export default class KeymapperComponent {
       return true;
     }
     let operation = keymaps.get(matched[0]);
-    this.store.dispatch(operationActions.exec(operation));
+    this.store.dispatch(operationActions.exec(operation, state.setting));
     this.store.dispatch(inputActions.clearKeys());
     return true;
   }
diff --git a/src/content/scrolls.js b/src/content/scrolls.js
index 8daa36f..5aef1df 100644
--- a/src/content/scrolls.js
+++ b/src/content/scrolls.js
@@ -108,54 +108,62 @@ const roughScroll = (element, x, y) => {
   element.scrollTo(x, y);
 };
 
-const scrollVertically = (count) => {
+const scroll = (element, x, y, smooth) => {
+  if (smooth) {
+    smoothScroll(element, x, y);
+  } else {
+    roughScroll(element, x, y);
+  }
+};
+
+const scrollVertically = (count, smooth) => {
   let target = scrollTarget();
   let x = target.scrollLeft;
   let y = target.scrollTop + SCROLL_DELTA_Y * count;
-  roughScroll(target, x, y);
+  scroll(target, x, y, smooth);
 };
 
-const scrollHorizonally = (count) => {
+const scrollHorizonally = (count, smooth) => {
   let target = scrollTarget();
   let x = target.scrollLeft + SCROLL_DELTA_X * count;
   let y = target.scrollTop;
-  roughScroll(target, x, y);
+  scroll(target, x, y, smooth);
 };
 
-const scrollPages = (count) => {
+const scrollPages = (count, smooth) => {
   let target = scrollTarget();
   let height = target.clientHeight;
   let x = target.scrollLeft;
   let y = target.scrollTop + height * count;
-  roughScroll(target, x, y);
+  scroll(target, x, y, smooth);
 };
 
-const scrollTop = () => {
+const scrollTop = (smooth) => {
   let target = scrollTarget();
   let x = target.scrollLeft;
   let y = 0;
-  roughScroll(target, x, y);
+  scroll(target, x, y, smooth);
 };
 
-const scrollBottom = () => {
+const scrollBottom = (smooth) => {
   let target = scrollTarget();
   let x = target.scrollLeft;
   let y = target.scrollHeight;
-  roughScroll(target, x, y);
+  scroll(target, x, y, smooth);
 };
 
-const scrollHome = () => {
+const scrollHome = (smooth) => {
   let target = scrollTarget();
   let x = 0;
   let y = target.scrollTop;
-  roughScroll(target, x, y);
+  scroll(target, x, y, smooth);
 };
 
-const scrollEnd = () => {
+const scrollEnd = (smooth) => {
   let target = scrollTarget();
   let x = target.scrollWidth;
   let y = target.scrollTop;
-  roughScroll(target, x, y);
+  scroll(target, x, y, smooth);
 };
 
 export {
diff --git a/src/shared/settings/properties.js b/src/shared/settings/properties.js
index f695c58..37dc881 100644
--- a/src/shared/settings/properties.js
+++ b/src/shared/settings/properties.js
@@ -4,11 +4,13 @@
 //    mybool: 'boolean',
 const types = {
   hintchars: 'string',
+  smoothscroll: 'boolean',
 };
 
 // describe default values of a property
 const defaults = {
   hintchars: 'abcdefghijklmnopqrstuvwxyz',
+  smoothscroll: false,
 };
 
 export { types, defaults };
-- 
cgit v1.2.3


From 8fea1e5cd298fe04868b7b5ddbfbcc15c9d93f0e Mon Sep 17 00:00:00 2001
From: Shin'ya Ueoka <ueokande@i-beam.org>
Date: Sat, 13 Jan 2018 16:45:47 +0900
Subject: clean scrolls

---
 src/content/scrolls.js | 89 +++++++++++++++++++++++++++++---------------------
 1 file changed, 51 insertions(+), 38 deletions(-)

(limited to 'src/content/scrolls.js')

diff --git a/src/content/scrolls.js b/src/content/scrolls.js
index 5aef1df..2fe06c0 100644
--- a/src/content/scrolls.js
+++ b/src/content/scrolls.js
@@ -66,68 +66,81 @@ const scrollTarget = () => {
   return window.document.documentElement;
 };
 
-const easing = (t) => {
-  if (t < 1) {
-    return t * t;
+class SmoothScroller {
+  constructor(element) {
+    this.element = element;
   }
-  return -(t - 1) * (t - 1) + 1;
-};
 
-const smoothScroll = (element, x, y) => {
+  scroll(x, y) {
+    this.startX = this.element.scrollLeft;
+    this.startY = this.element.scrollTop;
 
-  let startX = element.scrollTop;
-  let startY = element.scrollTop;
+    this.targetX = x;
+    this.targetY = y;
+    this.distanceX = x - this.startX;
+    this.distanceY = y - this.startY;
+    this.timeStart = 0;
 
-  let distanceX = x - startX;
-  let distanceY = y - startY;
-  let timeStart = 0;
+    window.requestAnimationFrame(this.loop.bind(this));
+  }
 
-  const loop = (timeCurrent) => {
-    if (!timeStart) {
-      timeStart = timeCurrent;
+  loop(time) {
+    if (!this.timeStart) {
+      this.timeStart = time;
     }
 
-    let timeElapsed = timeCurrent - timeStart;
-    let t = timeElapsed / SMOOTH_SCROLL_DURATION;
-    let nextX = startX + distanceX * easing(t);
-    let nextY = startY + distanceY * easing(t);
+    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 (timeElapsed < SMOOTH_SCROLL_DURATION) {
-      window.requestAnimationFrame(loop);
+    if (elapsed < SMOOTH_SCROLL_DURATION) {
+      window.requestAnimationFrame(this.loop.bind(this));
     } else {
-      element.scrollTo(x, y);
+      this.element.scrollTo(this.targetX, this.targetY);
     }
-  };
+  }
 
-  window.requestAnimationFrame(loop);
-};
+  // in-out quad easing
+  easing(t) {
+    if (t < 1) {
+      return t * t;
+    }
+    return -(t - 1) * (t - 1) + 1;
+  }
+}
 
-const roughScroll = (element, x, y) => {
-  element.scrollTo(x, y);
-};
+class RoughtScroller {
+  constructor(element) {
+    this.element = element;
+  }
+
+  scroll(x, y) {
+    this.element.scrollTo(x, y);
+  }
+}
 
-const scroll = (element, x, y, smooth) => {
+const scroller = (element, smooth) => {
   if (smooth) {
-    smoothScroll(element, x, y);
-  } else {
-    roughScroll(element, x, y);
+    return new SmoothScroller(element);
   }
+  return new RoughtScroller(element);
 };
 
 const scrollVertically = (count, smooth) => {
   let target = scrollTarget();
   let x = target.scrollLeft;
   let y = target.scrollTop + SCROLL_DELTA_Y * count;
-  scroll(target, x, y, smooth);
+  scroller(target, smooth).scroll(x, y);
 };
 
 const scrollHorizonally = (count, smooth) => {
   let target = scrollTarget();
   let x = target.scrollLeft + SCROLL_DELTA_X * count;
   let y = target.scrollTop;
-  scroll(target, x, y, smooth);
+  scroller(target, smooth).scroll(x, y);
 };
 
 const scrollPages = (count, smooth) => {
@@ -135,35 +148,35 @@ const scrollPages = (count, smooth) => {
   let height = target.clientHeight;
   let x = target.scrollLeft;
   let y = target.scrollTop + height * count;
-  scroll(target, x, y, smooth);
+  scroller(target, smooth).scroll(x, y);
 };
 
 const scrollTop = (smooth) => {
   let target = scrollTarget();
   let x = target.scrollLeft;
   let y = 0;
-  scroll(target, x, y, smooth);
+  scroller(target, smooth).scroll(x, y);
 };
 
 const scrollBottom = (smooth) => {
   let target = scrollTarget();
   let x = target.scrollLeft;
   let y = target.scrollHeight;
-  scroll(target, x, y, smooth);
+  scroller(target, smooth).scroll(x, y);
 };
 
 const scrollHome = (smooth) => {
   let target = scrollTarget();
   let x = 0;
   let y = target.scrollTop;
-  scroll(target, x, y, smooth);
+  scroller(target, smooth).scroll(x, y);
 };
 
 const scrollEnd = (smooth) => {
   let target = scrollTarget();
   let x = target.scrollWidth;
   let y = target.scrollTop;
-  scroll(target, x, y, smooth);
+  scroller(target, smooth).scroll(x, y);
 };
 
 export {
-- 
cgit v1.2.3


From 335b9ca47458b1817ef7705f4d999c25f423fad9 Mon Sep 17 00:00:00 2001
From: Shin'ya Ueoka <ueokande@i-beam.org>
Date: Sat, 13 Jan 2018 19:49:11 +0900
Subject: fix smooth scroll on key repeated

---
 src/content/actions/operation.js           | 16 ++++----
 src/content/components/common/keymapper.js |  3 +-
 src/content/scrolls.js                     | 63 +++++++++++++++++++++---------
 src/shared/utils/keys.js                   |  1 +
 4 files changed, 55 insertions(+), 28 deletions(-)

(limited to 'src/content/scrolls.js')

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,
-- 
cgit v1.2.3


From d1a81a877f0e7364b7d69e214ec74151d76dd25c Mon Sep 17 00:00:00 2001
From: Shin'ya Ueoka <ueokande@i-beam.org>
Date: Mon, 15 Jan 2018 21:56:10 +0900
Subject: focus on visible elements

---
 src/content/focuses.js  |  5 ++++-
 src/content/scrolls.js  | 24 +++---------------------
 src/shared/utils/dom.js | 24 +++++++++++++++++++++++-
 3 files changed, 30 insertions(+), 23 deletions(-)

(limited to 'src/content/scrolls.js')

diff --git a/src/content/focuses.js b/src/content/focuses.js
index c2658b4..a6f6cc8 100644
--- a/src/content/focuses.js
+++ b/src/content/focuses.js
@@ -1,7 +1,10 @@
+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 target = window.document.querySelector(inputSelector + ',textarea');
+  let targets = window.document.querySelectorAll(inputSelector + ',textarea');
+  let target = Array.from(targets).find(doms.isVisible);
   if (target) {
     target.focus();
   }
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/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 };
-- 
cgit v1.2.3