progress on scrolling thing
All checks were successful
Rebuild signaller for deprived.dev to rebuild site / test_service (push) Successful in 17s

This commit is contained in:
BOTAlex 2025-05-12 20:44:22 +02:00
parent 71ad89b197
commit 50c08b6b67

View file

@ -1,20 +1,54 @@
<script lang="ts">
import svelteLogo from "$lib/svelteLogos/svelte-logo.png"
import { browser } from '$app/environment';
import { onDestroy, onMount } from "svelte";
const buildTime = __BUILD_TIME__;
let scrollY = 0;
const unscrollSpeed = 100;
let unscrollScrollDiv: HTMLDivElement;
let totalScroll = 0;
let unscrollInterval: number |undefined = undefined;
let lastScrollTime = 0; // Used to have delay before unscrolling
const unscrollDelay = 2000;
onMount(()=>{
totalScroll = document.documentElement.scrollHeight - window.innerHeight
unscrollInterval = setInterval(() => {
console.log("Time with delay: " + (Date.now() - -unscrollDelay) + " Other " + lastScrollTime);
if (Date.now() < lastScrollTime - -unscrollDelay){
console.log("nah");
return
}
if(totalScroll - unscrollScrollDiv.scrollHeight < scrollY) {
window.scrollTo({ top: Math.max(scrollY - unscrollSpeed, totalScroll - unscrollScrollDiv.scrollHeight), behavior: 'smooth' });
}
}, 10);
});
function onScroll(){
lastScrollTime = Date.now();
// console.log("scroll");
}
onDestroy(()=>{
clearInterval(unscrollInterval);
});
export let hideOnPrint: boolean;
</script>
<svelte:window bind:scrollY />
<svelte:window bind:scrollY on:scroll={()=>{onScroll();}} on:touchmove={()=>{onScroll();}}/>
<div class="w-full">
<!-- Keep scrolling thing -->
<div class="h-64 w-full">
<div bind:this={unscrollScrollDiv} class="h-64 w-full">
</div>
<!-- About footer -->
<div class="{hideOnPrint ? 'hide-on-print' : ''} sticky bottom-0 flex flex-col justify-center pt-8 bg-base-300 mt-8">
<div class="flex justify-center">