chroe: delayedCall

Author: anig1scur

public/imgs/meidi/17.png

@@ -18,10 +18,12 @@
     scroll();
   }
 
-  function scroll() {
+  async function scroll() {
     if (!textEl) return;
     gsap.killTweensOf(textEl);
 
+    await gsap.delayedCall(0.02, () => {});
+
     const totalWidth = textEl.scrollWidth;
     const singleCopyWidth = totalWidth / 2;
     const viewportWidth = textEl.parentElement?.clientWidth || 0;
@@ -44,7 +46,7 @@
   }
 
   onMount(() => {
-    scroll();
+    setTimeout(scroll, 50);
   });
 
   onDestroy(() => {
@@ -53,15 +55,15 @@
 </script>
 
 {#if visible && wikiText}
-  <div class="fixed top-0 left-0 w-full bg-white/70 backdrop-blur-sm shadow-xs z-50 h-8 lg:h-10 flex items-center">
+  <div class="fixed top-0 left-0 w-full bg-white/70 backdrop-blur-sm shadow-xs z-10 h-8 flex items-center">
     <div class="relative overflow-hidden flex-1 h-full">
       <div
         bind:this={textEl}
         class="absolute whitespace-nowrap text-sm lg:text-base will-change-transform text-[var(--textColor)] top-0 left-24 h-full flex items-center"
       >
         {#each Array(2) as _}
           {#each lines as line}
-            <span class="pl-3">•</span>
+            <span class="pl-3">•&nbsp;</span>
             {line}
           {/each}
         {/each}

src/components/WikiHeader.svelte

@@ -78,7 +78,7 @@ export const assets = {
     {
       audio: asset('audios/meidi.mp3'),
       video: asset('videos/meidi-eat.webm'),
-      photo: 16,
+      photo: 17,
     },
     {
       audio: asset('audios/jojo.m4a'),

src/config.ts

@@ -28,7 +28,7 @@ export class IconManager {
 
 
   private boundHandleClick: (event: MouseEvent) => void;
-  private maxZIndex: number = 1;
+  private maxZIndex: number = 11;
 
   constructor (
     scene: THREE.Scene,
@@ -267,7 +267,7 @@ export class IconManager {
     const visibleIcons: THREE.Mesh[] = [];
     if ((this.videoIcon.material as THREE.MeshBasicMaterial).opacity > 0) visibleIcons.push(this.videoIcon);
     if ((this.audioIcon.material as THREE.MeshBasicMaterial).opacity > 0) visibleIcons.push(this.audioIcon);
-  if ((this.photoIcon.material as THREE.MeshBasicMaterial).opacity > 0) visibleIcons.push(this.photoIcon);
+    if ((this.photoIcon.material as THREE.MeshBasicMaterial).opacity > 0) visibleIcons.push(this.photoIcon);
 
     if (visibleIcons.length === 0) return;