made blob colors and gradients truly dynamic/random

2 files changed, 20 insertions, 0 deletions

diff --git a/src/js/dynamicBlob.js b/src/js/dynamicBlob.js
index 067b4de7..2530e946 100644
--- a/src/js/dynamicBlob.js
+++ b/src/js/dynamicBlob.js
@@ -7,7 +7,26 @@ function loadScript(src) {
     document.body.appendChild(script);
 }
 
+function getRandomColor() {
+    var letters = '0123456789ABCDEF';
+    var color = '#';
+    for (var i = 0; i < 6; i++) {
+        color += letters[Math.floor(Math.random() * 16)];
+    }
+    return color;
+}
+
+function generateGradient() {
+    var gradient = 'linear-gradient(to right';
+    var colorCount = Math.floor(Math.random() * 5) + 2;
+    for (var i = 0; i < colorCount; i++) {
+        gradient += ', ' + getRandomColor();
+    }
+    gradient += ')';
+    return gradient;
+}
 
+blob.style.background = generateGradient();
 
 
 var blobItem;
diff --git a/src/js/mouseblob.js b/src/js/mouseblob.js
index 37aec6f2..4823618c 100644
--- a/src/js/mouseblob.js
+++ b/src/js/mouseblob.js
@@ -27,6 +27,7 @@
 //     }, { duration: 1000, fill: "forwards" });
 // }
 
+
 window.onpointermove = event => {
         const { pageX, pageY } = event;