may have fixed a bug where tabbing out makes a gap in the animation. Needs further testing

globalScript.js

@@ -131,7 +131,7 @@ document.addEventListener("DOMContentLoaded", async function() {
 }, false)
 
 
-window.addEventListener("resize", () => {
+window.addEventListener("resize", function() {
   calcPixelDensity()
 
   switch (CURRENT_PAGE) {
@@ -146,12 +146,28 @@ window.addEventListener("resize", () => {
 
 let prevAnimationState = isAnimating
 
-document.addEventListener("visibilitychange", function (event) {
+
+document.addEventListener("visibilitychange", function() {
   if (document.hidden) {
-    prevAnimationState = isAnimating
+    prevAnimationState = isAnimating;
-    isAnimating = false
+    isAnimating = false;
   }
   else {
-    isAnimating = prevAnimationState
+    isAnimating = prevAnimationState;
+  }
+});
+
+/*
+window.addEventListener("blur", function() {
+  if (document.visibilityState === "visible") {
+    prevAnimationState = isAnimating;
+    isAnimating = false;
+  }
+});
+*/
+
+window.addEventListener("focus", function() {
+  if (!document.hidden) {
+    isAnimating = prevAnimationState;
   }
 });

synthwaveEffect.js

@@ -4,7 +4,7 @@ const scene = new THREE.Scene()
 const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000)
 const renderer = new THREE.WebGLRenderer({ alpha: true })
 
-// TODO: when tabbing out it sometimes doesnt pause the animation
+// TODO: when tabbing out it sometimes doesnt pause the animation (maybe fixed? Needs more testing)
 // TODO: add pixelation shader
 
 if (!renderer) {