slowed down the whole animation industry

nginx/vue/src/components/util/AutoScroll.vue

@@ -9,9 +9,10 @@ import { useTemplateRef, onMounted, onBeforeUnmount } from "vue";
 
 const container = useTemplateRef("container");
 
-const SPEED = 1; // px per frame
+const SPEED = 0.0005; // % per frame
 const PAUSE = 2000; // ms at top/bottom
 
+let pos = 0;
 let direction = 1; // 1 = down, -1 = up
 let timeoutId;
 let timeoutId2;
@@ -27,17 +28,27 @@ function handleHover() {
 
 function tick() {
     const el = container.value;
-    el.scrollTop += SPEED * direction;
 
-    const reachedBottom = el.scrollTop + el.clientHeight >= el.scrollHeight;
+    const reachedBottom = pos <= 0;
-    const reachedTop = el.scrollTop <= 0;
+    const reachedTop = pos >= 1;
+    console.log("speed");
 
-    if (reachedBottom || reachedTop) {
+    if (reachedBottom) {
-        direction *= -1;
+        pos = 0.001;
+        direction = 1;
+        handleHover();
+        return;
+    } else if (reachedTop) {
+        pos = 0.999;
+        direction = -1;
         handleHover();
         return;
     }
 
+    pos += direction * SPEED;
+
+    el.scrollTop = pos * el.scrollHeight;
+
     timeoutId = requestAnimationFrame(tick);
 }
 

nginx/vue/src/views/home/Intro2.vue

@@ -15,20 +15,19 @@ const itemEls = ref<HTMLDivElement[]>([]);
 
 const phrases = [
     "Welcome to my website",
-    "Eddy is a top G",
+    "I'm looking to do a big revamp",
-    "Thank you for visiting",
+    "A4 sheets of paper are what I'm used to",
     "I'd love to know your recommendations",
-    "Message me on discord or steam",
+    "for very short books",
+    "Message me by any means necessary",
     "I like anime, all kinds of music and sci fic",
-    "I'm sorry the animations are so fast",
-    "Someday I'll slow it down >_< ",
 ];
 
 const items = ref<Item[]>(
     phrases.map((text, i) => ({
         x: i * 20,
         y: i * 20,
-        dx: rand(0, 100) / 100,
+        dx: rand(0, 30) / 100,
         dy: 0.5,
         content: text,
     })),