From f4e46ff6820d334c12b8f3a609ab43b895d3b630 Mon Sep 17 00:00:00 2001
From: emily <ek@kyouma.net>
Date: Sun, 22 Sep 2024 18:36:19 +0200
Subject: [PATCH] Refactor js

---
 src/assets/js/app.js | 20 ++++++--------------
 src/index.html       | 12 ++++++------
 2 files changed, 12 insertions(+), 20 deletions(-)

diff --git a/src/assets/js/app.js b/src/assets/js/app.js
index 11a6ba9..d715c11 100644
--- a/src/assets/js/app.js
+++ b/src/assets/js/app.js
@@ -30,20 +30,12 @@ document.getElementById("hint").addEventListener('click', _ => {
   }
 });
 
-const sites = ['as', 'home', 'about'];
-sites.forEach((item) => {
-  document.querySelectorAll(`.nav-${item}`).forEach((a) => {
-    a.addEventListener('click', _ => {
-      nav(item);
+const sites = document.querySelectorAll('[id^=page-]');
+sites.forEach((site) => {
+  site.querySelectorAll('[class^=nav-]').forEach((button) => {
+    button.addEventListener('click', _ => {
+      site.style.display = 'none';
+      document.querySelector(`#page-${button.className.replace('nav-', '')}`).style.display = '';
     });
   });
 });
-
-function nav(site) {
-  const bg = [...sites];
-  bg.splice(sites.indexOf(site), 1);
-  bg.forEach((item) => {
-    document.getElementById(item).style.display = 'none';
-  });
-  document.getElementById(site).style.display = '';
-}
diff --git a/src/index.html b/src/index.html
index 49cb8bb..6cc2d1b 100644
--- a/src/index.html
+++ b/src/index.html
@@ -12,15 +12,15 @@
 	    <source src="assets/media/sunnyday-av1.mp4" type="video/mp4;codecs=av01.0.08M.08">
 	    <source src="assets/media/sunnyday-avc.mp4" type="video/mp4;codecs=avc1.4D401F">
     </video>
-    <div id="home">
+    <div id="page-home">
         <h1>KYOUMA.NET</h1>
         <h2>BE GAY DO CRIME</h2>
-        <div class="social">
-	    	    <a class="nav-as">as203819</a> $
+        <div class="links">
+	    	    <a class="nav-as203819">as203819</a> $
 	    	    <a class="nav-about">about</a>
         </div>
     </div>
-    <div class="content" id="as" style="display: none">         
+    <div class="content" id="page-as203819" style="display: none">         
         <pre>
    ________      ________        _______      ________      ________      ________       _____      ________
   |\   __  \    |\   ____\      /  ___  \    |\   __  \    |\_____  \    |\   __  \     / __  \    |\  ___  \
@@ -65,7 +65,7 @@
  <a class="nav-home">&lt;- Home</a>                                                                                                  <a class="nav-about">about -&gt;</a>
         </pre>
     </div>
-    <div class="content" id="about" style="display: none">         
+    <div class="content" id="page-about" style="display: none">         
         <pre>
    ________      ________      ________      ___  ___      _________                                               
   |\   __  \    |\   __  \    |\   __  \    |\  \|\  \    |\___   ___\                                             
@@ -107,7 +107,7 @@
 |                                                                         |                                       |
 |                                                                         |                                       |
 +-------------------------------------------------------------------------+---------------------------------------+
- <a class="nav-home">&lt;- Home</a>                                                                                               <a class="nav-as">as203819 -&gt;</a>
+ <a class="nav-home">&lt;- Home</a>                                                                                               <a class="nav-as203819">as203819 -&gt;</a>
         </pre>
     </div>
     <div class="hint" id="hint">HIT ME FOR SOUND</div>