Smooth scrolling

This commit is contained in:
Eduard Urbach 2017-07-05 21:12:33 +02:00
parent 4a76c12803
commit ca1c5838bf

View File

@ -83,7 +83,6 @@ export function diff(arn: AnimeNotifier, element: HTMLElement) {
let url = element.dataset.url || (element as HTMLAnchorElement).getAttribute("href")
arn.diff(url).then(() => {
arn.requestIdleCallback(() => {
const duration = 300.0
const steps = 60
const interval = duration / steps
@ -93,8 +92,9 @@ export function diff(arn: AnimeNotifier, element: HTMLElement) {
let target = element
let scrollHandle: number
let oldScroll = arn.app.content.parentElement.scrollTop
let newScroll = Math.max(target.offsetTop - contentPadding, 0)
let scrollDistance = newScroll - oldScroll
let newScroll = 0
let finalScroll = Math.max(target.offsetTop - contentPadding, 0)
let scrollDistance = finalScroll - oldScroll
let timeStart = Date.now()
let timeEnd = timeStart + duration
@ -106,15 +106,15 @@ export function diff(arn: AnimeNotifier, element: HTMLElement) {
progress = 1.0
}
arn.app.content.parentElement.scrollTop = oldScroll + scrollDistance * Math.sin(progress * fullSin)
newScroll = oldScroll + scrollDistance * Math.sin(progress * fullSin)
arn.app.content.parentElement.scrollTop = newScroll
if(time >= timeEnd || arn.app.content.parentElement.scrollTop == newScroll) {
clearInterval(scrollHandle)
if(time < timeEnd && newScroll != finalScroll) {
window.requestAnimationFrame(scroll)
}
}
scrollHandle = setInterval(scroll, interval)
})
window.requestAnimationFrame(scroll)
})
}