fix: hero

bestest-design · Aug 31, 2024 · ae80f43 · ae80f43
1 parent 0c22881
commit ae80f43
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 7 deletions.
diff --git a/index.html b/index.html
@@ -21,7 +21,7 @@
   <link rel="stylesheet" media="all" href="main.css?v1" uncache />
   <script src="https://cdn.tailwindcss.com?plugins=typography,aspect-ratio,container-queries"></script>
   <script src="js/tconfig.js?v1.3" uncache></script>
-  <script src="js/main.js?v1.11" uncache></script>
+  <script src="js/main.js?v1.12" uncache></script>
 </head>
 
 <body class="font-mono">
@@ -37,7 +37,7 @@
 
   <hero id="kur" class="min-h-screen text-gray-300 flex justify-center items-center">
     <h1 class="opacity-0 absolute top-0">SINTĒZE</h1>
-    <img alt="SINTĒZE 2024" id="logo" class="mx-auto my-0 w-[25rem] h-auto flex justify-center items-center"
+    <img alt="SINTĒZE 2024" id="logo" class="mx-auto my-0 w-[20rem] h-auto flex justify-center items-center"
       src="assets/sinteze.svg" />
   </hero>
 

diff --git a/js/main.js b/js/main.js
@@ -32,28 +32,30 @@ document.addEventListener("DOMContentLoaded", function () {
     let bass =
       dataArray.slice(0, bufferLength / 8).reduce((a, b) => a + b, 0) /
       (bufferLength / 8);
-    bass = (bass / 5);
+    bass = bass / 5;
 
     // Calculate midrange frequencies (middle 2/8 to 4/8 of the dataArray)
     let midrange =
       dataArray
         .slice(bufferLength / 4, bufferLength / 2)
         .reduce((a, b) => a + b, 0) /
       (bufferLength / 4);
-    midrange = (midrange / 20);
+    midrange = midrange / 20;
 
     // Calculate high-end frequencies (last 1/8 of the dataArray)
     let highEnd =
       dataArray.slice((bufferLength * 7) / 8).reduce((a, b) => a + b, 0) /
-      (bufferLength / 8);
-    highEnd = (highEnd / 50);
+      (bufferLength / 4);
+    highEnd = highEnd / 20;
 
     console.log(`bass : ${bass}`);
     console.log(`midrange : ${midrange}`);
     console.log(`highEnd : ${highEnd}`);
 
     // Adjust logo size using the frequencies
-    let newSize = !audio.paused ? Math.max(20, bass * (highEnd + midrange)) : 25;
+    let newSize = !audio.paused
+      ? Math.min(80, Math.max(20, bass * (highEnd + midrange) * 0.5))
+      : 20;
 
     console.log(`newSize : ${newSize}rem`);