Implement FPS Counter with Cookie Management Across Multiple Games

- Added functionality to display an FPS counter in various games based on a cookie setting.
- Introduced a utility function to retrieve cookies and check if the FPS counter is enabled.
- Updated the FPS calculation logic to start or hide the counter based on user preferences.
- Ensured consistent implementation across multiple HTML files, including games like "Bubble Game", "Basketball Legends", and others.
- Enhanced the main index and settings pages to manage FPS counter visibility and added a clock feature.

Fanf.html

@@ -46,7 +46,25 @@ function yes(){
 }
 </style>
 <script>
-const fpsCounter = document.getElementById("fps-counter"); // Moved this to the correct place
+    const fpsCounter = document.getElementById("fps-counter");
+
+    // Utility function to get a cookie
+    function getCookie(name) {
+        const cookies = document.cookie.split(';');
+        for (let i = 0; i < cookies.length; i++) {
+            const cookie = cookies[i].trim();
+            if (cookie.startsWith(name + '=')) {
+                return cookie.substring(name.length + 1);
+            }
+        }
+        return null;
+    }
+
+    // Check if FPS Counter is enabled
+    const fpsCounterEnabled = getCookie('fpsCounter') === 'true';
+
+    if (fpsCounterEnabled) {
+        fpsCounter.style.display = 'block'; // Show FPS counter
 
         function calculateFPS() {
             let lastFrameTime = performance.now();
@@ -67,5 +85,8 @@ function calculateFPS() {
             frameLoop();
         }
 
-calculateFPS(); // Ensure the FPS calculation starts
+        calculateFPS(); // Start FPS calculation
+    } else {
+        fpsCounter.style.display = 'none'; // Hide FPS counter
+    }
 </script>

WebGames-master/WebGames-master/BubbleGame/index.html

@@ -81,7 +81,25 @@
 }
 </style>
 <script>
-const fpsCounter = document.getElementById("fps-counter"); // Moved this to the correct place
+  const fpsCounter = document.getElementById("fps-counter");
+
+  // Utility function to get a cookie
+  function getCookie(name) {
+      const cookies = document.cookie.split(';');
+      for (let i = 0; i < cookies.length; i++) {
+          const cookie = cookies[i].trim();
+          if (cookie.startsWith(name + '=')) {
+              return cookie.substring(name.length + 1);
+          }
+      }
+      return null;
+  }
+
+  // Check if FPS Counter is enabled
+  const fpsCounterEnabled = getCookie('fpsCounter') === 'true';
+
+  if (fpsCounterEnabled) {
+      fpsCounter.style.display = 'block'; // Show FPS counter
 
       function calculateFPS() {
           let lastFrameTime = performance.now();
@@ -102,5 +120,8 @@ function calculateFPS() {
           frameLoop();
       }
 
-calculateFPS(); // Ensure the FPS calculation starts
+      calculateFPS(); // Start FPS calculation
+  } else {
+      fpsCounter.style.display = 'none'; // Hide FPS counter
+  }
 </script>

WebGames-master/WebGames-master/games/Basketball-Legends-2020-gh-pages/Basketball-Legends-2020-gh-pages/index.html

@@ -47,7 +47,25 @@
 }
 </style>
 <script>
-const fpsCounter = document.getElementById("fps-counter"); // Moved this to the correct place
+    const fpsCounter = document.getElementById("fps-counter");
+
+    // Utility function to get a cookie
+    function getCookie(name) {
+        const cookies = document.cookie.split(';');
+        for (let i = 0; i < cookies.length; i++) {
+            const cookie = cookies[i].trim();
+            if (cookie.startsWith(name + '=')) {
+                return cookie.substring(name.length + 1);
+            }
+        }
+        return null;
+    }
+
+    // Check if FPS Counter is enabled
+    const fpsCounterEnabled = getCookie('fpsCounter') === 'true';
+
+    if (fpsCounterEnabled) {
+        fpsCounter.style.display = 'block'; // Show FPS counter
 
         function calculateFPS() {
             let lastFrameTime = performance.now();
@@ -68,5 +86,8 @@ function calculateFPS() {
             frameLoop();
         }
 
-calculateFPS(); // Ensure the FPS calculation starts
+        calculateFPS(); // Start FPS calculation
+    } else {
+        fpsCounter.style.display = 'none'; // Hide FPS counter
+    }
 </script>

WebGames-master/WebGames-master/games/HexGL-master/HexGL-master/index.html

@@ -142,7 +142,25 @@
 }
 </style>
 <script>
-const fpsCounter = document.getElementById("fps-counter"); // Moved this to the correct place
+  const fpsCounter = document.getElementById("fps-counter");
+
+  // Utility function to get a cookie
+  function getCookie(name) {
+      const cookies = document.cookie.split(';');
+      for (let i = 0; i < cookies.length; i++) {
+          const cookie = cookies[i].trim();
+          if (cookie.startsWith(name + '=')) {
+              return cookie.substring(name.length + 1);
+          }
+      }
+      return null;
+  }
+
+  // Check if FPS Counter is enabled
+  const fpsCounterEnabled = getCookie('fpsCounter') === 'true';
+
+  if (fpsCounterEnabled) {
+      fpsCounter.style.display = 'block'; // Show FPS counter
 
       function calculateFPS() {
           let lastFrameTime = performance.now();
@@ -163,5 +181,8 @@ function calculateFPS() {
           frameLoop();
       }
 
-calculateFPS(); // Ensure the FPS calculation starts
+      calculateFPS(); // Start FPS calculation
+  } else {
+      fpsCounter.style.display = 'none'; // Hide FPS counter
+  }
 </script>

WebGames-master/WebGames-master/games/Learn-To-Fly-2-main/Learn-To-Fly-2-main/index.html

@@ -38,7 +38,25 @@
 }
 </style>
 <script>
-const fpsCounter = document.getElementById("fps-counter"); // Moved this to the correct place
+  const fpsCounter = document.getElementById("fps-counter");
+
+  // Utility function to get a cookie
+  function getCookie(name) {
+      const cookies = document.cookie.split(';');
+      for (let i = 0; i < cookies.length; i++) {
+          const cookie = cookies[i].trim();
+          if (cookie.startsWith(name + '=')) {
+              return cookie.substring(name.length + 1);
+          }
+      }
+      return null;
+  }
+
+  // Check if FPS Counter is enabled
+  const fpsCounterEnabled = getCookie('fpsCounter') === 'true';
+
+  if (fpsCounterEnabled) {
+      fpsCounter.style.display = 'block'; // Show FPS counter
 
       function calculateFPS() {
           let lastFrameTime = performance.now();
@@ -59,5 +77,8 @@ function calculateFPS() {
           frameLoop();
       }
 
-calculateFPS(); // Ensure the FPS calculation starts
+      calculateFPS(); // Start FPS calculation
+  } else {
+      fpsCounter.style.display = 'none'; // Hide FPS counter
+  }
 </script>

WebGames-master/WebGames-master/games/Slope-Game-main/Slope-Game-main/index.html

@@ -81,7 +81,25 @@ Drop a star on the repo if you enjoy.
 }
 </style>
 <script>
-const fpsCounter = document.getElementById("fps-counter"); // Moved this to the correct place
+  const fpsCounter = document.getElementById("fps-counter");
+
+  // Utility function to get a cookie
+  function getCookie(name) {
+      const cookies = document.cookie.split(';');
+      for (let i = 0; i < cookies.length; i++) {
+          const cookie = cookies[i].trim();
+          if (cookie.startsWith(name + '=')) {
+              return cookie.substring(name.length + 1);
+          }
+      }
+      return null;
+  }
+
+  // Check if FPS Counter is enabled
+  const fpsCounterEnabled = getCookie('fpsCounter') === 'true';
+
+  if (fpsCounterEnabled) {
+      fpsCounter.style.display = 'block'; // Show FPS counter
 
       function calculateFPS() {
           let lastFrameTime = performance.now();
@@ -102,5 +120,8 @@ function calculateFPS() {
           frameLoop();
       }
 
-calculateFPS(); // Ensure the FPS calculation starts
+      calculateFPS(); // Start FPS calculation
+  } else {
+      fpsCounter.style.display = 'none'; // Hide FPS counter
+  }
 </script>

WebGames-master/WebGames-master/games/Snow-Rider3D-main/Snow-Rider3D-main/index.html

@@ -38,8 +38,27 @@
   z-index: 1000; /* Ensure it stays on top */
 }
 </style>
+
 <script>
-const fpsCounter = document.getElementById("fps-counter"); // Moved this to the correct place
+    const fpsCounter = document.getElementById("fps-counter");
+
+    // Utility function to get a cookie
+    function getCookie(name) {
+        const cookies = document.cookie.split(';');
+        for (let i = 0; i < cookies.length; i++) {
+            const cookie = cookies[i].trim();
+            if (cookie.startsWith(name + '=')) {
+                return cookie.substring(name.length + 1);
+            }
+        }
+        return null;
+    }
+
+    // Check if FPS Counter is enabled
+    const fpsCounterEnabled = getCookie('fpsCounter') === 'true';
+
+    if (fpsCounterEnabled) {
+        fpsCounter.style.display = 'block'; // Show FPS counter
 
         function calculateFPS() {
             let lastFrameTime = performance.now();
@@ -60,5 +79,8 @@ function calculateFPS() {
             frameLoop();
         }
 
-calculateFPS(); // Ensure the FPS calculation starts
+        calculateFPS(); // Start FPS calculation
+    } else {
+        fpsCounter.style.display = 'none'; // Hide FPS counter
+    }
 </script>

WebGames-master/WebGames-master/games/tanuki-sunset-master/index.html

@@ -38,7 +38,25 @@
 }
 </style>
 <script>
-const fpsCounter = document.getElementById("fps-counter"); // Moved this to the correct place
+  const fpsCounter = document.getElementById("fps-counter");
+
+  // Utility function to get a cookie
+  function getCookie(name) {
+      const cookies = document.cookie.split(';');
+      for (let i = 0; i < cookies.length; i++) {
+          const cookie = cookies[i].trim();
+          if (cookie.startsWith(name + '=')) {
+              return cookie.substring(name.length + 1);
+          }
+      }
+      return null;
+  }
+
+  // Check if FPS Counter is enabled
+  const fpsCounterEnabled = getCookie('fpsCounter') === 'true';
+
+  if (fpsCounterEnabled) {
+      fpsCounter.style.display = 'block'; // Show FPS counter
 
       function calculateFPS() {
           let lastFrameTime = performance.now();
@@ -59,5 +77,8 @@ function calculateFPS() {
           frameLoop();
       }
 
-calculateFPS(); // Ensure the FPS calculation starts
+      calculateFPS(); // Start FPS calculation
+  } else {
+      fpsCounter.style.display = 'none'; // Hide FPS counter
+  }
 </script>

WebGames-master/WebGames-master/games/zTunnel-Rush.html

@@ -162,7 +162,25 @@ window.JOT_formatRelativeToNow=function(a,b){a=((new Date).getTime()-a)/6E4;if(1
 }
 </style>
 <script>
-const fpsCounter = document.getElementById("fps-counter"); // Moved this to the correct place
+  const fpsCounter = document.getElementById("fps-counter");
+
+  // Utility function to get a cookie
+  function getCookie(name) {
+      const cookies = document.cookie.split(';');
+      for (let i = 0; i < cookies.length; i++) {
+          const cookie = cookies[i].trim();
+          if (cookie.startsWith(name + '=')) {
+              return cookie.substring(name.length + 1);
+          }
+      }
+      return null;
+  }
+
+  // Check if FPS Counter is enabled
+  const fpsCounterEnabled = getCookie('fpsCounter') === 'true';
+
+  if (fpsCounterEnabled) {
+      fpsCounter.style.display = 'block'; // Show FPS counter
 
       function calculateFPS() {
           let lastFrameTime = performance.now();
@@ -183,5 +201,8 @@ function calculateFPS() {
           frameLoop();
       }
 
-calculateFPS(); // Ensure the FPS calculation starts
+      calculateFPS(); // Start FPS calculation
+  } else {
+      fpsCounter.style.display = 'none'; // Hide FPS counter
+  }
 </script>

WebGames-master/WebGames-master/index.html

@@ -240,6 +240,14 @@
                 <div class="game-title">Fnaf Collection</div>
             </a>
         </div>
+
+
+
+
+
+
+
+        
         <div class="game">
             <a href="games/The-Shadow-Reform.html">
                 <img src="assets/kaertt.png" alt="The Shadow Reform">

games/flasharchive-main/flasharchive-main/html/hs-ftc.html

@@ -34,7 +34,25 @@
   }
   </style>
   <script>
-  const fpsCounter = document.getElementById("fps-counter"); // Moved this to the correct place
+    const fpsCounter = document.getElementById("fps-counter");
+
+    // Utility function to get a cookie
+    function getCookie(name) {
+        const cookies = document.cookie.split(';');
+        for (let i = 0; i < cookies.length; i++) {
+            const cookie = cookies[i].trim();
+            if (cookie.startsWith(name + '=')) {
+                return cookie.substring(name.length + 1);
+            }
+        }
+        return null;
+    }
+
+    // Check if FPS Counter is enabled
+    const fpsCounterEnabled = getCookie('fpsCounter') === 'true';
+
+    if (fpsCounterEnabled) {
+        fpsCounter.style.display = 'block'; // Show FPS counter
 
         function calculateFPS() {
             let lastFrameTime = performance.now();
@@ -55,5 +73,8 @@
             frameLoop();
         }
 
-  calculateFPS(); // Ensure the FPS calculation starts
+        calculateFPS(); // Start FPS calculation
+    } else {
+        fpsCounter.style.display = 'none'; // Hide FPS counter
+    }
 </script>

games/flasharchive-main/flasharchive-main/html/hs-ita-1.html

@@ -34,7 +34,25 @@
 }
 </style>
 <script>
-const fpsCounter = document.getElementById("fps-counter"); // Moved this to the correct place
+  const fpsCounter = document.getElementById("fps-counter");
+
+  // Utility function to get a cookie
+  function getCookie(name) {
+      const cookies = document.cookie.split(';');
+      for (let i = 0; i < cookies.length; i++) {
+          const cookie = cookies[i].trim();
+          if (cookie.startsWith(name + '=')) {
+              return cookie.substring(name.length + 1);
+          }
+      }
+      return null;
+  }
+
+  // Check if FPS Counter is enabled
+  const fpsCounterEnabled = getCookie('fpsCounter') === 'true';
+
+  if (fpsCounterEnabled) {
+      fpsCounter.style.display = 'block'; // Show FPS counter
 
       function calculateFPS() {
           let lastFrameTime = performance.now();
@@ -55,5 +73,8 @@ function calculateFPS() {
           frameLoop();
       }
 
-calculateFPS(); // Ensure the FPS calculation starts
+      calculateFPS(); // Start FPS calculation
+  } else {
+      fpsCounter.style.display = 'none'; // Hide FPS counter
+  }
 </script>

games/henreystikman/BreakingTheBank.html

@@ -28,7 +28,25 @@
 }
 </style>
 <script>
-const fpsCounter = document.getElementById("fps-counter"); // Moved this to the correct place
+    const fpsCounter = document.getElementById("fps-counter");
+
+    // Utility function to get a cookie
+    function getCookie(name) {
+        const cookies = document.cookie.split(';');
+        for (let i = 0; i < cookies.length; i++) {
+            const cookie = cookies[i].trim();
+            if (cookie.startsWith(name + '=')) {
+                return cookie.substring(name.length + 1);
+            }
+        }
+        return null;
+    }
+
+    // Check if FPS Counter is enabled
+    const fpsCounterEnabled = getCookie('fpsCounter') === 'true';
+
+    if (fpsCounterEnabled) {
+        fpsCounter.style.display = 'block'; // Show FPS counter
 
         function calculateFPS() {
             let lastFrameTime = performance.now();
@@ -49,5 +67,8 @@ function calculateFPS() {
             frameLoop();
         }
 
-calculateFPS(); // Ensure the FPS calculation starts
+        calculateFPS(); // Start FPS calculation
+    } else {
+        fpsCounter.style.display = 'none'; // Hide FPS counter
+    }
 </script>

games/henreystikman/Crossing The Pit.html

@@ -31,7 +31,25 @@
 }
 </style>
 <script>
-const fpsCounter = document.getElementById("fps-counter"); // Moved this to the correct place
+    const fpsCounter = document.getElementById("fps-counter");
+
+    // Utility function to get a cookie
+    function getCookie(name) {
+        const cookies = document.cookie.split(';');
+        for (let i = 0; i < cookies.length; i++) {
+            const cookie = cookies[i].trim();
+            if (cookie.startsWith(name + '=')) {
+                return cookie.substring(name.length + 1);
+            }
+        }
+        return null;
+    }
+
+    // Check if FPS Counter is enabled
+    const fpsCounterEnabled = getCookie('fpsCounter') === 'true';
+
+    if (fpsCounterEnabled) {
+        fpsCounter.style.display = 'block'; // Show FPS counter
 
         function calculateFPS() {
             let lastFrameTime = performance.now();
@@ -52,5 +70,8 @@ function calculateFPS() {
             frameLoop();
         }
 
-calculateFPS(); // Ensure the FPS calculation starts
+        calculateFPS(); // Start FPS calculation
+    } else {
+        fpsCounter.style.display = 'none'; // Hide FPS counter
+    }
 </script>

games/henreystikman/Escaping The Prison.html

@@ -28,7 +28,25 @@
 }
 </style>
 <script>
-const fpsCounter = document.getElementById("fps-counter"); // Moved this to the correct place
+    const fpsCounter = document.getElementById("fps-counter");
+
+    // Utility function to get a cookie
+    function getCookie(name) {
+        const cookies = document.cookie.split(';');
+        for (let i = 0; i < cookies.length; i++) {
+            const cookie = cookies[i].trim();
+            if (cookie.startsWith(name + '=')) {
+                return cookie.substring(name.length + 1);
+            }
+        }
+        return null;
+    }
+
+    // Check if FPS Counter is enabled
+    const fpsCounterEnabled = getCookie('fpsCounter') === 'true';
+
+    if (fpsCounterEnabled) {
+        fpsCounter.style.display = 'block'; // Show FPS counter
 
         function calculateFPS() {
             let lastFrameTime = performance.now();
@@ -49,5 +67,8 @@ function calculateFPS() {
             frameLoop();
         }
 
-calculateFPS(); // Ensure the FPS calculation starts
+        calculateFPS(); // Start FPS calculation
+    } else {
+        fpsCounter.style.display = 'none'; // Hide FPS counter
+    }
 </script>

games/henreystikman/Stealing_the_Diamond.html

@@ -31,7 +31,25 @@
 }
 </style>
 <script>
-const fpsCounter = document.getElementById("fps-counter"); // Moved this to the correct place
+    const fpsCounter = document.getElementById("fps-counter");
+
+    // Utility function to get a cookie
+    function getCookie(name) {
+        const cookies = document.cookie.split(';');
+        for (let i = 0; i < cookies.length; i++) {
+            const cookie = cookies[i].trim();
+            if (cookie.startsWith(name + '=')) {
+                return cookie.substring(name.length + 1);
+            }
+        }
+        return null;
+    }
+
+    // Check if FPS Counter is enabled
+    const fpsCounterEnabled = getCookie('fpsCounter') === 'true';
+
+    if (fpsCounterEnabled) {
+        fpsCounter.style.display = 'block'; // Show FPS counter
 
         function calculateFPS() {
             let lastFrameTime = performance.now();
@@ -52,5 +70,8 @@ function calculateFPS() {
             frameLoop();
         }
 
-calculateFPS(); // Ensure the FPS calculation starts
+        calculateFPS(); // Start FPS calculation
+    } else {
+        fpsCounter.style.display = 'none'; // Hide FPS counter
+    }
 </script>

index.html

@@ -82,6 +82,7 @@
     </style>
 </head>
 <body>
+    <div id="clock" style="font-size: 1.5rem; margin-top: 10px; font-family: 'Orbitron', sans-serif; color: var(--text-color); display: none;"></div>
     <h1>Moon Gaming</h1>
     <div class="button-container">
         <button class="button" onclick="location.href='setting.html'">Settings</button>
@@ -133,6 +134,58 @@
         // Apply saved mode on load
         const darkModeEnabled = getCookie('darkMode') === 'true';
         applyDarkMode(darkModeEnabled);
+
+        // Clock Functionality
+        function updateClock() {
+            const now = new Date();
+            const hours = String(now.getHours()).padStart(2, '0');
+            const minutes = String(now.getMinutes()).padStart(2, '0');
+            const seconds = String(now.getSeconds()).padStart(2, '0');
+            const timeString = `${hours}:${minutes}:${seconds}`;
+            const dateString = now.toDateString(); // Get the current date as a string
+            document.getElementById('clock').innerHTML = `${dateString} <br> ${timeString}`;
+        }
+
+        // Update the clock every second
+        setInterval(updateClock, 1000);
+        updateClock(); // Initialize clock immediately
+
+        // Ensure FPS Counter is enabled by default
+        if (getCookie('fpsCounter') === null) {
+            setCookie('fpsCounter', 'true', 30); // Default to enabled
+        }
+
+        // Check if FPS Counter is enabled
+        const fpsCounterEnabled = getCookie('fpsCounter') === 'true';
+
+        if (fpsCounterEnabled) {
+            const fpsCounter = document.getElementById('fpsCounter');
+            let lastFrameTime = performance.now();
+            let frames = 0;
+
+            function calculateFPS() {
+                const now = performance.now();
+                frames++;
+
+                if (now - lastFrameTime >= 1000) {
+                    const fps = Math.round(frames / ((now - lastFrameTime) / 1000));
+                    fpsCounter.textContent = `FPS: ${fps}`;
+                    frames = 0;
+                    lastFrameTime = now;
+                }
+
+                requestAnimationFrame(calculateFPS);
+            }
+
+            calculateFPS(); // Start FPS calculation
+        }
+
+        // Check if Date and Time is enabled
+        const dateTimeEnabled = getCookie('dateTime') === 'true';
+
+        if (dateTimeEnabled) {
+            document.getElementById('clock').style.display = 'block'; // Show the clock
+        }
     </script>
 </body>
 </html>

setting.html

@@ -91,6 +91,10 @@
             <span>Enable Text-to-Speech</span>
             <button id="toggleTextToSpeech">Enable</button>
         </div>
+        <div class="setting-item">
+            <span>Show Date and Time</span>
+            <button id="toggleDateTime">Enable</button>
+        </div>
         <div class="setting-item clear-cookies">
             <span>Clear Cookies</span>
             <button id="clearCookies">Clear</button>
@@ -237,6 +241,27 @@
         // Apply saved Text-to-Speech preference on load
         applyTextToSpeechSetting(textToSpeechEnabled);
 
+        // Date and Time Toggle
+        const toggleDateTimeButton = document.getElementById('toggleDateTime');
+        const dateTimeEnabled = getCookie('dateTime') === 'true';
+
+        function applyDateTimeSetting(enabled) {
+            if (enabled) {
+                toggleDateTimeButton.textContent = 'Disable';
+            } else {
+                toggleDateTimeButton.textContent = 'Enable';
+            }
+        }
+
+        toggleDateTimeButton.addEventListener('click', () => {
+            const isDateTimeEnabled = getCookie('dateTime') === 'true';
+            setCookie('dateTime', !isDateTimeEnabled, 30); // Save preference for 30 days
+            applyDateTimeSetting(!isDateTimeEnabled);
+        });
+
+        // Apply saved Date and Time preference on load
+        applyDateTimeSetting(dateTimeEnabled);
+
         // Regional Settings
         const regionSelect = document.getElementById('regionSelect');
         const savedRegion = getCookie('region') || 'us'; // Default to 'us'
@@ -279,6 +304,7 @@
             applyFPSCounterSetting(false); // Default: FPS Counter disabled
             applyMaturityFilterSetting(false); // Default: Maturity Filter disabled
             applyTextToSpeechSetting(false); // Default: Text-to-Speech disabled
+            applyDateTimeSetting(false); // Default: Date and Time disabled
 
             alert('Settings have been reset to default!');
         });

stikpage.ht.html

@@ -28,7 +28,25 @@
 }
 </style>
 <script>
-const fpsCounter = document.getElementById("fps-counter"); // Moved this to the correct place
+    const fpsCounter = document.getElementById("fps-counter");
+
+    // Utility function to get a cookie
+    function getCookie(name) {
+        const cookies = document.cookie.split(';');
+        for (let i = 0; i < cookies.length; i++) {
+            const cookie = cookies[i].trim();
+            if (cookie.startsWith(name + '=')) {
+                return cookie.substring(name.length + 1);
+            }
+        }
+        return null;
+    }
+
+    // Check if FPS Counter is enabled
+    const fpsCounterEnabled = getCookie('fpsCounter') === 'true';
+
+    if (fpsCounterEnabled) {
+        fpsCounter.style.display = 'block'; // Show FPS counter
 
         function calculateFPS() {
             let lastFrameTime = performance.now();
@@ -49,5 +67,8 @@ function calculateFPS() {
             frameLoop();
         }
 
-calculateFPS(); // Ensure the FPS calculation starts
+        calculateFPS(); // Start FPS calculation
+    } else {
+        fpsCounter.style.display = 'none'; // Hide FPS counter
+    }
 </script>