diff --git a/src/renderer/components/editorWithTabs/editor.vue b/src/renderer/components/editorWithTabs/editor.vue index e24393fe..94fe6db2 100644 --- a/src/renderer/components/editorWithTabs/editor.vue +++ b/src/renderer/components/editorWithTabs/editor.vue @@ -693,7 +693,13 @@ export default { this.editor.on('selectionChange', changes => { const { y } = changes.cursorCoords if (this.typewriter) { - animatedScrollTo(container, container.scrollTop + y - STANDAR_Y, 100) + const startPosition = container.scrollTop + const toPosition = startPosition + y - STANDAR_Y + + // Prevent micro shakes and unnecessary scrolling. + if (Math.abs(startPosition - toPosition) > 2) { + animatedScrollTo(container, toPosition, 100) + } } // Used to fix #628: auto scroll cursor to visible if the cursor is too low. diff --git a/src/renderer/util/index.js b/src/renderer/util/index.js index b81bf93b..3d3eb2db 100644 --- a/src/renderer/util/index.js +++ b/src/renderer/util/index.js @@ -19,14 +19,6 @@ export const delay = time => { return p } -// help functions -const easeInOutQuad = function (t, b, c, d) { - t /= d / 2 - if (t < 1) return c / 2 * t * t + b - t-- - return -c / 2 * (t * (t - 2) - 1) + b -} - const ID_PREFEX = 'mt-' let id = 0 const DOTU = 'DOTU' @@ -160,35 +152,36 @@ export const animatedScrollTo = function (element, to, duration, callback) { const start = element.scrollTop const change = to - start const animationStart = +new Date() - let animating = true - let lastpos = null + + // Prevent animation on small steps + if (Math.abs(change) <= 6) { + element.scrollTop = to + return + } + + const easeInOutQuad = function (t, b, c, d) { + t /= d / 2 + if (t < 1) return (c / 2) * t * t + b + t-- + return (-c / 2) * (t * (t - 2) - 1) + b + } const animateScroll = function () { - if (!animating) { - return - } - requestAnimationFrame(animateScroll) const now = +new Date() const val = Math.floor(easeInOutQuad(now - animationStart, start, change, duration)) - if (lastpos) { - if (lastpos === element.scrollTop) { - lastpos = val - element.scrollTop = val - } else { - animating = false - } - } else { - lastpos = val - element.scrollTop = val - } + + element.scrollTop = val + if (now > animationStart + duration) { element.scrollTop = to - animating = false if (callback) { callback() } + } else { + requestAnimationFrame(animateScroll) } } + requestAnimationFrame(animateScroll) }