Fluidity

Zakinane · May 27, 2024 · 3e3af69 · 3e3af69
1 parent 0bbc0f8
commit 3e3af69
Show file tree

Hide file tree

Showing 8 changed files with 42 additions and 34 deletions.
diff --git a/app.js b/app.js
@@ -6,8 +6,6 @@ document.addEventListener("DOMContentLoaded", function () {
   var StartButton = document.querySelector(".Start");
 
 
-  audio.setAttribute("autoplay", "true");
-
   BoutonAudio.addEventListener("click", function () {
     if (audio.paused) {
       BoutonAudio.setAttribute("src", "img/SoundON.png");

diff --git a/assets/enemyDeath.mp3 b/assets/enemyDeath.mp3
diff --git a/assets/pioupiou.mp3 b/assets/pioupiou.mp3
diff --git a/assets/youDeath.mp3 b/assets/youDeath.mp3
diff --git a/game/game.html b/game/game.html
@@ -10,6 +10,7 @@
 
   <body>
     <audio class="moneyAudio" src="../assets/money.mp3" hidden></audio>
+    <audio class="pioupiou" src="../assets/pioupiou.mp3"></audio>
     <div class="container">
       <div class="controls">
         <h2 style="padding-bottom: 30px">Controls :</h2>

diff --git a/game/game.js b/game/game.js
@@ -1,11 +1,12 @@
-//SCREEN
+////////////////////////////////SCREEN
 const screen = document.querySelector(".screen");
 function getScreenBounds() {
   const rect = screen.getBoundingClientRect();
   return { left: rect.left, right: rect.right };
 }
 
-//AUDIO
+////////////////////////////////AUDIO
+//ost
 document.addEventListener("DOMContentLoaded", function () {
   var BoutonAudio = document.querySelector(".SoundButton");
   var audio = document.querySelector(".audio");
@@ -24,62 +25,70 @@ document.addEventListener("DOMContentLoaded", function () {
     ReplayIntro.removeAttribute("hidden");
   });
 });
+//others
+const pioupiou = document.querySelector(".pioupiou");
 
-//ME
+///////////////////////////////////////////////ME
 const You = document.querySelector(".You");
 
 function getXpos() {
   return You.getBoundingClientRect().left;
 }
-
 //money
-You.addEventListener("click", function(){
+You.addEventListener("click", function () {
   var audioMoney = document.querySelector(".moneyAudio");
   audioMoney.play();
 });
 
-//ACTIONS
+/////////////////////////////////////////////ACTIONS
 function goLeft() {
   let Xpos = getXpos();
   const { left: MAX_LEFT } = getScreenBounds();
-  if (Xpos - 20 > MAX_LEFT) {
-    You.style.left = You.offsetLeft - 20 + "px";
+  if (Xpos - 10 > MAX_LEFT) {
+    You.style.left = You.offsetLeft - 10 + "px";
   }
 }
 
 function goRight() {
   let Xpos = getXpos();
   const { right: MAX_RIGHT } = getScreenBounds();
-  if (Xpos + You.offsetWidth + 20 < MAX_RIGHT) {
-    You.style.left = You.offsetLeft + 20 + "px";
+  if (Xpos + You.offsetWidth + 10 < MAX_RIGHT) {
+    You.style.left = You.offsetLeft + 10 + "px";
   }
 }
 
-function Shoot(){
+function Shoot() {
   let Xpos = getXpos();
-  const projectile = document.createElement("img")
-  projectile.src("../img/moneyyy");
-  projectile.classList.add = "projectile";
-
+  const projectile = document.createElement("img");
+  projectile.src = "../img/moneyyyy.png";
+  projectile.classList.add("projectile");
+  pioupiou.play();
 }
 
+//////////////////////////CONTROLS
+//Fluidity
+var keys = {};
 
-//CONTROLS
-document.addEventListener("keydown", (event) => {
-  const touche = event.code;
-  console.log(touche);
-  switch (touche) {
-    case "Space":
-      Shoot();
-      break;
-    case "ArrowLeft":
-      goLeft();
-      break;
-    case "ArrowRight":
-      goRight();
-      break;
-  }
+document.addEventListener("keydown", (key) => {
+  keys[key.code] = true;
+});
+document.addEventListener("keyup", (key) => {
+  keys[key.code] = false;
 });
 
-//DEATH
+function Controls() {
+  if (keys["Space"]) {
+    Shoot();
+  }
+  if (keys["ArrowLeft"]) {
+    goLeft();
+  }
+  if (keys["ArrowRight"]) {
+    goRight();
+  }
 
+  requestAnimationFrame(Controls); //?
+}
+Controls();
+
+//DEATH
diff --git a/img/plankton.png b/img/plankton.png
diff --git a/index.html b/index.html
@@ -28,7 +28,7 @@ <h5>SHOOT</h5>
         <div>
           <div class="ReplayIntro" hidden>Click to replay Intro Song</div>
           <img src="img/SoundON.png" class="SoundButton" />
-          <audio src="assets/gameIntro.mp3"></audio>
+          <audio src="assets/gameIntro.mp3" autoplay="true"></audio>
         </div>
         <div>
           Coded by