From f6f077ba4f10d4a77b684ca3205a14b1493f8a93 Mon Sep 17 00:00:00 2001
From: Sevi <149007003+sevithescss@users.noreply.github.com>
Date: Mon, 28 Oct 2024 14:00:33 -0700
Subject: [PATCH] testing the settings function

---
 index.html    |  6 ++++++
 settings.html | 51 +++++++++++++++++++++++----------------------------
 2 files changed, 29 insertions(+), 28 deletions(-)
diff --git a/index.html b/index.html
index 2c4fa38..870b1af 100644
--- a/index.html
+++ b/index.html
@@ -140,6 +140,12 @@
         <p class="copy-link" id="discordLink" style="color: black;">https://discord.gg/czV7M8JXXM</p>
         <button class="copy-btn" onclick="copyLink()" style="background-color: rgb(76, 175, 80);">Copy Link</button>
         <button class="cancel-btn" onclick="closeModal()" style="background-color: rgb(76, 175, 80);">Close</button>
+        <script>
+          window.addEventListener('message', (event) => {
+              // Set the received color as the background color of the page
+              document.body.style.backgroundColor = event.data;
+          });
+      </script>
       </div>
     </div>
     <script src="js/popup.js"></script>
diff --git a/settings.html b/settings.html
index 9443d40..bf23446 100644
--- a/settings.html
+++ b/settings.html
@@ -1,35 +1,30 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>DON'T USE OR YOU WILL BE STUCK ON ONE BACKGROUND</title>
-  <script>
-    // Function to apply the background color on page load
-    function applySavedBackgroundColor() {
-      const savedColor = localStorage.getItem('backgroundColor');
-      if (savedColor) {
-        document.body.style.backgroundColor = savedColor;
-      }
-    }
-
-    // Function to change the background color and save it
-    function changeBackgroundColor(color) {
-      document.body.style.backgroundColor = color;
-      localStorage.setItem('backgroundColor', color);
-    }
-
-    // Apply the saved background color when the page loads
-    window.onload = applySavedBackgroundColor;
-  </script>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Page 1 - Color Controller</title>
+    <script>
+        let newWindow;
+        
+        function openPage2() {
+            newWindow = window.open('index.html', 'main');
+        }
+        
+        function changeWindowColor(color) {
+            if (newWindow) {
+                newWindow.postMessage(color, '*');
+            } else {
+                alert('Please open the main page first.');
+            }
+        }
+    </script>
 </head>
 <body>
-
-  <h2>Choose Background Color</h2>
-  <button onclick="changeBackgroundColor('lightblue')">Light Blue</button>
-  <button onclick="changeBackgroundColor('lightgreen')">Light Green</button>
-  <button onclick="changeBackgroundColor('lightcoral')">Light Coral</button>
-  <button onclick="changeBackgroundColor('white')">Reset</button>
-
+    <h1>Open and Control Background Color of Page 2</h1>
+    <button onclick="openPage2()">Open Main Page</button><br><br>
+    <button onclick="changeWindowColor('lightblue')">Light Blue</button>
+    <button onclick="changeWindowColor('lightgreen')">Light Green</button>
+    <button onclick="changeWindowColor('lightcoral')">Light Coral</button>
 </body>
 </html>
