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

56
scripts/Actions.ts
View File

@ -83,38 +83,38 @@ 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
const fullSin = Math.PI / 2
const contentPadding = 24
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 timeStart = Date.now()
let timeEnd = timeStart + duration
const duration = 300.0
const steps = 60
const interval = duration / steps
const fullSin = Math.PI / 2
const contentPadding = 24
let target = element
let scrollHandle: number
let oldScroll = arn.app.content.parentElement.scrollTop
let newScroll = 0
let finalScroll = Math.max(target.offsetTop - contentPadding, 0)
let scrollDistance = finalScroll - oldScroll
let timeStart = Date.now()
let timeEnd = timeStart + duration
let scroll = () => {
let time = Date.now()
let progress = (time - timeStart) / duration
let scroll = () => {
let time = Date.now()
let progress = (time - timeStart) / duration
if(progress > 1.0) {
progress = 1.0
}
arn.app.content.parentElement.scrollTop = oldScroll + scrollDistance * Math.sin(progress * fullSin)
if(time >= timeEnd || arn.app.content.parentElement.scrollTop == newScroll) {
clearInterval(scrollHandle)
}
if(progress > 1.0) {
progress = 1.0
}
scrollHandle = setInterval(scroll, interval)
})
newScroll = oldScroll + scrollDistance * Math.sin(progress * fullSin)
arn.app.content.parentElement.scrollTop = newScroll
if(time < timeEnd && newScroll != finalScroll) {
window.requestAnimationFrame(scroll)
}
}
window.requestAnimationFrame(scroll)
})
}