feat: auto-snap to next section when hero scroll reaches 100%

This commit is contained in:
2026-07-30 13:06:18 +03:00
parent 9246400da4
commit 24bbac5d65
@@ -38,6 +38,7 @@ export default function CloudRevealSection() {
const currentFrameRef = useRef(0) const currentFrameRef = useRef(0)
const [loaded, setLoaded] = useState(false) const [loaded, setLoaded] = useState(false)
const [loadProgress, setLoadProgress] = useState(0) const [loadProgress, setLoadProgress] = useState(0)
const hasSnapped = useRef(false)
const { scrollYProgress } = useScroll({ const { scrollYProgress } = useScroll({
target: sectionRef, target: sectionRef,
@@ -102,11 +103,26 @@ export default function CloudRevealSection() {
useMotionValueEvent(scrollYProgress, 'change', (progress) => { useMotionValueEvent(scrollYProgress, 'change', (progress) => {
if (!loaded) return if (!loaded) return
// Frame güncelle
const frameIndex = Math.min(Math.floor(progress * (TOTAL_FRAMES - 1)), TOTAL_FRAMES - 1) const frameIndex = Math.min(Math.floor(progress * (TOTAL_FRAMES - 1)), TOTAL_FRAMES - 1)
if (frameIndex !== currentFrameRef.current) { if (frameIndex !== currentFrameRef.current) {
currentFrameRef.current = frameIndex currentFrameRef.current = frameIndex
drawFrame(frameIndex) drawFrame(frameIndex)
} }
// %100'de bir sonraki bölüme snap et
if (progress >= 0.99 && !hasSnapped.current) {
hasSnapped.current = true
const next = document.getElementById('proje')
if (next) {
next.scrollIntoView({ behavior: 'smooth' })
}
}
// Geri scroll yapılırsa snap'i sıfırla
if (progress < 0.9) {
hasSnapped.current = false
}
}) })
useEffect(() => { useEffect(() => {