Merge branch 'main' into messageadded

sk66641 · Jul 5, 2024 · e5d0fb4 · e5d0fb4
2 parents e831fa2 + db03b28
commit e5d0fb4
Show file tree

Hide file tree

Showing 6 changed files with 73 additions and 37 deletions.
diff --git a/index.html b/index.html
@@ -467,6 +467,7 @@ <h2>Account Not Available</h2>
 </div>
   <script src="https://cdn.jsdelivr.net/particles.js/2.0.0/particles.min.js"></script>
   <script src="js/background.js"></script>
+  <script src="js/social.js"></script>
   <script src="js/script.js"></script>
   <script type="text/javascript">
     function googleTranslateElementInit() {

diff --git a/js/script.js b/js/script.js
@@ -139,7 +139,7 @@ document.addEventListener('DOMContentLoaded', () => {
 
     function startCountdown(duration) {
         countdownValue = duration;
-        document.getElementById('musicDropdown').style.display = 'block';
+        // document.getElementById('musicDropdown').style.display = 'block';
         pauseStartButton.style.display = 'inline-block'; // Show the pause button
         document.querySelector("#reload").style.display = 'inline-block'; // Show the reload button
         addTimeButton.style.display = 'inline-block'; // Show the add time button
@@ -956,36 +956,6 @@ function changeToStatic6() {
     document.getElementById('image6').src = '../assets/images/features/Linear_02.jpg';
 }
 
-// Get the modal
-var accountNotAvailableModal = document.getElementById("accountNotAvailableModal");
-
-// Get the <span> element that closes the modal
-var closeAccountNotAvailableModal = document.getElementById("closeAccountNotAvailableModal");
-
-// Get all social media links
-var socialLinks = document.querySelectorAll(".socialIcons a");
-
-// When the user clicks on <span> (x), close the modal
-closeAccountNotAvailableModal.onclick = function() {
-  accountNotAvailableModal.style.display = "none";
-}
-
-// When the user clicks anywhere outside of the modal, close it
-window.onclick = function(event) {
-  if (event.target == accountNotAvailableModal) {
-    accountNotAvailableModal.style.display = "none";
-  }
-}
-
-// When the user clicks on a social media link, show the modal
-socialLinks.forEach(function(link) {
-  link.onclick = function(event) {
-    event.preventDefault();
-    accountNotAvailableModal.style.display = "block";
-  }
-});
-
-
 let isPlaying = false;
 let CurrentAudio = null;
 
@@ -1023,4 +993,4 @@ document.getElementById('PreviewButton').addEventListener('click', function () {
             previewButton.textContent = 'Preview';
         });
     }
-});
+});
diff --git a/js/social.js b/js/social.js
@@ -0,0 +1,36 @@
+document.addEventListener("DOMContentLoaded", function() {
+    // Get the modal
+    var accountNotAvailableModal = document.getElementById("accountNotAvailableModal");
+
+    // Get the <span> element that closes the modal
+    var closeAccountNotAvailableModal = document.getElementById("closeAccountNotAvailableModal");
+
+    // Get all social media links
+    var socialLinks = document.querySelectorAll(".socialIcons a");
+
+    if (!accountNotAvailableModal || !closeAccountNotAvailableModal || socialLinks.length === 0) {
+      console.error("Required elements are missing");
+      return;
+    }
+
+    // When the user clicks on <span> (x), close the modal
+    closeAccountNotAvailableModal.onclick = function() {
+      accountNotAvailableModal.style.display = "none";
+    }
+
+    // When the user clicks anywhere outside of the modal, close it
+    window.onclick = function(event) {
+      if (event.target == accountNotAvailableModal) {
+        accountNotAvailableModal.style.display = "none";
+      }
+    }
+
+    // When the user clicks on a social media link, show the modal
+    socialLinks.forEach(function(link) {
+      link.onclick = function(event) {
+        event.preventDefault();
+        accountNotAvailableModal.style.display = "block";
+      }
+    });
+  });
+
diff --git a/pages/about.html b/pages/about.html
@@ -1,11 +1,9 @@
 <!DOCTYPE html>
 <html lang="en">
-
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>About - Random Disco Light Simulator</title>
-
     <link rel="icon" href="../assets/images/favicon/favicon.ico" type="image/x-icon" />
     <link rel="stylesheet" href="../css/style.css">
     <link rel="stylesheet" href="../css/about.css">
@@ -14,7 +12,6 @@
         crossorigin="anonymous" referrerpolicy="no-referrer" />
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
 </head>
-
 <body>
     <div>
         <button id="backToTopBtn" title="Back to Top" aria-label="Back to Top"><i class="fas fa-arrow-up"></i></button>
@@ -139,6 +136,15 @@ <h1 id="changingHeading" style="font-family: Arial, sans-serif; font-size: 30px;
     <script src="../js/background.js"></script>
     <script src="../js/script.js"></script>
     <script src="../js/backToTopBtn.js"></script> 
+    <script src="../js/social.js"></script> 
+    <div id="accountNotAvailableModal" class="account-not-available-modal">
+        <div class="account-not-available-modal-content">
+            <span class="close" id="closeAccountNotAvailableModal">&times;</span>
+            <h2>Account Not Available</h2>
+            <p>We apologize for the inconvenience, but our social media accounts are currently unavailable. We are working diligently to bring them online as soon as possible.</p>
+            <p>In the meantime, if you have any questions or need assistance, please feel free to reach out to us through our website's feedback form. We appreciate your understanding and patience during this time.</p>
+            <p>Thank you for your continued support! </p>
+        </div>
+    </div>
 </body>
-
 </html>
diff --git a/pages/features.html b/pages/features.html
@@ -169,6 +169,16 @@ <h1 id="changingHeading" style="font-family: Arial, sans-serif; font-size: 30px;
     <script src="../js/background.js"></script>
     <script src="../js/script.js"></script>
     <script src="../js/backToTopBtn.js"></script>
+    <script src="../js/social.js"></script>
+    <div id="accountNotAvailableModal" class="account-not-available-modal">
+        <div class="account-not-available-modal-content">
+          <span class="close" id="closeAccountNotAvailableModal">&times;</span>
+          <h2>Account Not Available</h2>
+          <p>We apologize for the inconvenience, but our social media accounts are currently unavailable. We are working diligently to bring them online as soon as possible.</p>
+          <p>In the meantime, if you have any questions or need assistance, please feel free to reach out to us through our website's feedback form. We appreciate your understanding and patience during this time.</p>
+          <p>Thank you for your continued support! </p>      
+        </div>
+      </div>
 </body>
 
 </html>
diff --git a/pages/feedback.html b/pages/feedback.html
@@ -4,7 +4,7 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Features - Random Disco Light Simulator</title>
+    <title>Feedback - Random Disco Light Simulator</title>
 
     <link rel="icon" href="../assets/images/favicon/favicon.ico" type="image/x-icon" />
     <link rel="stylesheet" href="../css/style.css">
@@ -16,6 +16,7 @@
 </head>
 
 <body>
+    <button id="backToTopBtn" title="Back to Top" aria-label="Back to Top"><i class="fas fa-arrow-up"></i></button>
     <div class="snowflakes" style="display: block;">
         <div id="particles-js"></div>
     </div>
@@ -130,6 +131,7 @@ <h1 id="changingHeading" style="font-family: Arial, sans-serif; font-size: 30px;
                 reserved.
             </p>
         </div>
+
     </footer>
     <script src="https://cdn.jsdelivr.net/particles.js/2.0.0/particles.min.js"></script>
     <script src="../js/background.js"></script>
@@ -148,6 +150,17 @@ <h1 id="changingHeading" style="font-family: Arial, sans-serif; font-size: 30px;
 
         });
     </script>
+    <script src="../js/backToTopBtn.js"></script>
+    <script src="../js/social.js"></script>
+    <div id="accountNotAvailableModal" class="account-not-available-modal">
+        <div class="account-not-available-modal-content">
+          <span class="close" id="closeAccountNotAvailableModal">&times;</span>
+          <h2>Account Not Available</h2>
+          <p>We apologize for the inconvenience, but our social media accounts are currently unavailable. We are working diligently to bring them online as soon as possible.</p>
+          <p>In the meantime, if you have any questions or need assistance, please feel free to reach out to us through our website's feedback form. We appreciate your understanding and patience during this time.</p>
+          <p>Thank you for your continued support! </p>      
+        </div>
+      </div>
 </body>
 
 </html>