web/notify.moe
Code Issues Pull Requests Activity

Smooth scrolling

Browse Source
This commit is contained in:
Eduard Urbach 2017-07-05 21:12:33 +02:00
parent 4a76c12803
commit ca1c5838bf
1 changed files with 28 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
scripts/Actions.ts
View File

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