[feat] 코드 리팩토링 -3

junseok44 · Nov 4, 2023 · 8dfa433 · 8dfa433
1 parent 005f95b
commit 8dfa433
Show file tree

Hide file tree

Showing 14 changed files with 17,350 additions and 12,418 deletions.
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1 @@
+/TODO
diff --git a/TODO.md b/TODO.md
diff --git a/assets/hit.wav b/assets/hit.wav
diff --git a/index.html b/index.html
@@ -10,9 +10,6 @@
       .buttonContainer {
         display: flex;
         flex-direction: column;
-        /* position: absolute; */
-        /* top: 10px; */
-        /* right: 10px; */
         z-index: 1;
       }
       button {
@@ -50,8 +47,16 @@
         <button onkeydown="preventSpacebarClick(event);" class="replayBtn">
           다시 시작
         </button>
+        <button onkeydown="preventSpacebarClick(event);" class="songSelectBtn">
+          노래 선곡
+        </button>
       </div>
     </div>
+    <script>
+      function onYouTubeIframeAPIReady() {
+        ytPlayer.onYouTubeIframeAPIReady();
+      }
+    </script>
     <script>
       function preventSpacebarClick(event) {
         if (event.key === " " || event.keyCode === 32) {
@@ -65,6 +70,8 @@
     <script src="objects/RecordNote.js"></script>
     <script src="objects/Note.js"></script>
 
+    <script src="system/YouTubePlayer.js"></script>
+    <script src="system/SongLibrary.js"></script>
     <script src="system/GameManager.js"></script>
     <script src="system/LoadYTPlayer.js"></script>
     <script src="system/NotePlayer.js"></script>

diff --git a/sketch.js b/sketch.js
@@ -1,41 +1,54 @@
 const recordBtn = document.querySelector(".recordBtn");
 recordBtn.addEventListener("click", () => {
-  if (System.mode == System.MODE.WAITING) {
-    System.startRecording();
-  } else if (System.mode == System.MODE.RECORD) {
-    System.stopRecording();
+  if (system.mode == System.MODE.WAITING) {
+    system.startRecording();
+  } else if (system.mode == System.MODE.RECORD) {
+    system.stopRecording();
   } else if (
-    System.mode == System.MODE.PAUSE ||
-    System.mode == System.MODE.PLAY
+    system.mode == System.MODE.PAUSE ||
+    system.mode == System.MODE.PLAY
   ) {
-    System.startRecording();
+    system.startRecording();
   }
 });
 
 // WAITING -> play -> pause -> play
 const playBtn = document.querySelector(".playBtn");
 playBtn.addEventListener("click", () => {
-  if (System.mode == System.MODE.WAITING) {
-    System.startPlaying();
-  } else if (System.mode == System.MODE.PLAY) {
-    System.pause();
-  } else if (System.mode == System.MODE.PAUSE) {
-    System.resume();
+  if (system.mode == System.MODE.WAITING) {
+    system.startPlaying();
+  } else if (system.mode == System.MODE.PLAY) {
+    system.pause();
+  } else if (system.mode == System.MODE.PAUSE) {
+    system.resume();
   }
 });
 
 // play -> WAITING
 const replayBtn = document.querySelector(".replayBtn");
 replayBtn.addEventListener("click", () => {
-  if (System.mode == System.MODE.PAUSE) {
-    System.replay();
+  if (system.mode == System.MODE.PAUSE) {
+    system.replay();
   }
 });
 
+const songSelectBtn = document.querySelector(".songSelectBtn");
+songSelectBtn.addEventListener("click", () => {
+  system.backToSelect();
+});
+
+let system;
 let gameManager;
 let notePlayer;
 let recorder;
+let ytPlayer;
 let ui;
+let songLibrary;
+let hitSound;
+
+function preload() {
+  hitSound = loadSound("assets/hit.wav");
+}
 
 function setup() {
   let canvas = createCanvas(1000, 1000);
@@ -48,32 +61,32 @@ function setup() {
 
   gameManager = new GameManager();
   gameManager.setLevel(1, 20);
+
   recorder = new Recorder();
-  notePlayer = new NotePlayer(gameManager);
-  ui = new UI(gameManager, notePlayer, recorder);
+  songLibrary = new SongLibrary();
+  ytPlayer = new YouTubePlayer();
 
-  System.changeMode(System.MODE.SELECT);
-  // System.loadData(2);
+  notePlayer = new NotePlayer(gameManager);
+  ui = new UI(gameManager, notePlayer, recorder, songLibrary.songData);
+  system = new System(songLibrary, recorder, ytPlayer, gameManager, notePlayer);
 }
 
 function draw() {
   background(255);
   System.checkKeyReleased();
   ui.displayUI();
-  switch (System.mode) {
+  switch (system.mode) {
     case System.MODE.SELECT:
       ui.displaySelectUI();
       break;
     case System.MODE.PLAY:
       if (notePlayer.isPlayerEnd) {
-        System.gameEnd();
+        system.gameEnd();
       } else {
         ui.displayPlayUI();
       }
       playBtn.innerText = "일시중지";
       notePlayer.play();
-      YTplayer.playVideo();
-
       break;
     case System.MODE.WAITING:
       ui.displayWaitingUI();
@@ -90,23 +103,21 @@ function draw() {
       ui.displayPauseUI();
       playBtn.innerText = "재생하기";
       notePlayer.pause();
-      YTplayer.pauseVideo();
       break;
   }
 }
 
 function keyPressed() {
-  if (keyCode == 65 && System.mode == System.MODE.WAITING) {
-    System.startPlaying();
+  if (keyCode == 65 && system.mode == System.MODE.WAITING) {
+    system.startPlaying();
   }
-
-  if (keyCode == 32 && System.mode == System.MODE.PLAY) {
-    System.changeMode(System.MODE.PAUSE);
-  } else if (keyCode == 32 && System.mode == System.MODE.PAUSE) {
-    System.changeMode(System.MODE.PLAY);
+  if (keyCode == 32 && system.mode == System.MODE.PLAY) {
+    system.pause();
+  } else if (keyCode == 32 && system.mode == System.MODE.PAUSE) {
+    system.resume();
   }
-  if (keyCode == 82 && System.mode == System.MODE.PAUSE) {
-    System.replay();
+  if (keyCode == 82 && system.mode == System.MODE.PAUSE) {
+    system.replay();
   }
 }