refactor: use one onMount on SmoothScroll
This commit is contained in:
@@ -1,30 +1,19 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { browser } from '$app/environment'
|
|
||||||
import { onMount } from 'svelte'
|
import { onMount } from 'svelte'
|
||||||
import Lenis from '@studio-freight/lenis'
|
import Lenis from '@studio-freight/lenis'
|
||||||
import { smoothScroll } from '$utils/stores'
|
import { smoothScroll } from '$utils/stores'
|
||||||
|
|
||||||
let smoothScrollRAF = 0
|
let smoothScrollRAF = 0
|
||||||
|
|
||||||
|
onMount(() => {
|
||||||
// Setup smooth scroll
|
// Setup smooth scroll
|
||||||
if (browser) {
|
|
||||||
$smoothScroll = new Lenis({
|
$smoothScroll = new Lenis({
|
||||||
duration: 1.2,
|
duration: 1.2,
|
||||||
easing: (t: number) => Math.min(1, 1.001 - Math.pow(2, -10 * t)), // https://easings.net/
|
easing: (t: number) => Math.min(1, 1.001 - Math.pow(2, -10 * t)), // https://easings.net/
|
||||||
smoothWheel: true,
|
smoothWheel: true,
|
||||||
orientation: 'vertical',
|
orientation: 'vertical',
|
||||||
})
|
})
|
||||||
}
|
|
||||||
|
|
||||||
// Lenis RAF
|
|
||||||
const update = (time: number) => {
|
|
||||||
$smoothScroll.raf(time)
|
|
||||||
smoothScrollRAF = requestAnimationFrame(update)
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
onMount(() => {
|
|
||||||
// Enable smooth scroll
|
// Enable smooth scroll
|
||||||
requestAnimationFrame(update)
|
requestAnimationFrame(update)
|
||||||
|
|
||||||
@@ -34,4 +23,10 @@
|
|||||||
$smoothScroll.destroy()
|
$smoothScroll.destroy()
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
// Lenis RAF
|
||||||
|
const update = (time: number) => {
|
||||||
|
$smoothScroll.raf(time)
|
||||||
|
smoothScrollRAF = requestAnimationFrame(update)
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
Reference in New Issue
Block a user