chore: add secret :^)

src/lib/components/ui/animated-bg/NyanCatBg.svelte

@@ -0,0 +1,92 @@
+<script lang="ts">
+  import NyanCat from '$assets/nyan-cat.gif';
+  import { reduceAnimations } from '@/userSettings';
+  import { fade } from 'svelte/transition';
+
+  //TODO: maybe dynamic background images fetched from ezpp?
+
+  const COUNT = 18;
+
+  function rand(min: number, max: number) {
+    return Math.random() * (max - min) + min;
+  }
+
+  const streaks = Array.from({ length: COUNT })
+    .map((_, i) => {
+      const depth = rand(0, 2);
+
+      const scale = 0.6 + depth * 0.8;
+      const speed = 0.4 + depth * 1.35;
+
+      const distance = 150;
+      const duration = distance / speed;
+
+      return {
+        width: 290 * scale,
+        height: 140 * scale,
+        x: (i / COUNT) * 200 - 50,
+        y: ((i * 137.5) % 100) - 20,
+        opacity: 0.25 + depth * 0.65,
+        duration,
+        delay: rand(0, duration),
+        scale,
+      };
+    })
+    .sort((a, b) => a.scale - b.scale);
+</script>
+
+<div class="absolute bg blur-[2px]">
+  <div
+    class="relative h-full w-full from-0% to-90% bg-gradient-to-b from-transparent to-black z-50"
+  ></div>
+  {#each streaks as s, index (index)}
+    <div
+      class="streak drop-shadow-lg transition-opacity duration-1000"
+      style="
+        width:{s.width}px;
+        height:{s.height}px;
+        left:{s.x}%;
+        top:{s.y}%;
+        opacity:{$reduceAnimations ? 0 : s.opacity};
+        animation-duration:{s.duration}s;
+        animation-delay:-{s.delay}s;
+      "
+    >
+      <img
+        src={NyanCat}
+        alt="nyan cat"
+        class="w-full h-full"
+        style="opacity:{$reduceAnimations ? 0 : s.opacity};"
+      />
+    </div>
+  {/each}
+</div>
+
+<style>
+  .bg {
+    position: fixed;
+    inset: 0;
+    overflow: hidden;
+    background: linear-gradient(
+      180deg,
+      var(--color-blue-800) 0%,
+      var(--color-blue-600) 40%,
+      var(--color-blue-900) 100%
+    );
+  }
+
+  .streak {
+    position: absolute;
+    animation: move linear infinite;
+    will-change: transform;
+  }
+
+  @keyframes move {
+    from {
+      transform: translate(-250vw, 0);
+    }
+    to {
+      transform: translate(250vw, 0);
+    }
+  }
+</style>

src/routes/+layout.svelte

@@ -34,10 +34,13 @@
   import '@fontsource/sora';
   import '@fontsource/space-mono';
   import AnimatedBg from '@/components/ui/animated-bg/AnimatedBg.svelte';
+  import NyanCatBg from '@/components/ui/animated-bg/NyanCatBg.svelte';
+  import { sileo } from 'sileo';
 
   let { children } = $props();
 
   let unsupported_platform = $state<boolean>(false);
+  let secret_enabled = $state<boolean>(false);
 
   function disableReload() {
     if (window.location.hostname !== 'tauri.localhost') {
@@ -87,6 +90,19 @@
     );
   }
 
+  let konami_code = [
+    'ArrowUp',
+    'ArrowUp',
+    'ArrowDown',
+    'ArrowDown',
+    'ArrowLeft',
+    'ArrowRight',
+    'ArrowLeft',
+    'ArrowRight',
+    'b',
+    'a',
+  ];
+
   onMount(async () => {
     window.Buffer = Buffer;
 
@@ -98,6 +114,37 @@
     const isFirstStartup = await $userSettings.init();
     $userAuth.init();
 
+    document.addEventListener('keydown', (e) => {
+      if (secret_enabled) return;
+      if (e.key.toLowerCase() === konami_code[0].toLowerCase()) {
+        konami_code.shift();
+        if (konami_code.length === 0) {
+          sileo.success({
+            title: 'Cheatcode activated!',
+            duration: 3000,
+            fill: '#181825',
+            styles: {
+              description: 'text-center!',
+            },
+          });
+          secret_enabled = true;
+        }
+      } else {
+        konami_code = [
+          'ArrowUp',
+          'ArrowUp',
+          'ArrowDown',
+          'ArrowDown',
+          'ArrowLeft',
+          'ArrowRight',
+          'ArrowLeft',
+          'ArrowRight',
+          'b',
+          'a',
+        ];
+      }
+    });
+
     currentLoadingInfo.set('Loading config...');
     const config_patching = $userSettings.value('patching');
     const config_custom_cursor = $userSettings.value('custom_cursor');
@@ -180,7 +227,11 @@
 
 <main>
   <div class="opacity-30">
-    <AnimatedBg />
+    {#if secret_enabled}
+      <NyanCatBg />
+    {:else}
+      <AnimatedBg />
+    {/if}
   </div>
   {@render children()}
 </main>