update

index.html

@@ -28,14 +28,15 @@ <h1>NEW ROUND?</h1>
     <div class="menu">
       <h1>Press Enter to start</h1>
     </div>
+    <div id="game"></div>
   </main>
   <script src="js/coins.js"></script>
   <script src="js/obstacles.js"></script>
   <script src="js/firstaid.js"></script>
   <script src="js/background.js"></script>
   <script src="js/foreground.js"></script>
   <script src="js/shot.js"></script>
-  <script src="js/Shotvillan.js"></script>
+  <script src="js/shotvillan.js"></script>
   <script src="js/tesla.js"></script>
   <script src="js/villan.js"></script>
   <script src="js/player.js"></script>

js/background.js

@@ -20,6 +20,7 @@ class Background {
     // TransitionEvent
     // Level #2
     if (this.turns >= 30 && this.turns < 60) {
+      song.rate(1.03)
       game.backgroundImagesNight.forEach(bgImg => {
         bgImg.x -= bgImg.speed
         image(bgImg.src, bgImg.x, 0, width, height)
@@ -30,7 +31,7 @@ class Background {
         }
       })
     }
-
+    // level #3
     if (this.turns >= 60) {
       game.backgroundImages.forEach(bgImg => {
         bgImg.x = 0;

js/foreground.js

@@ -5,7 +5,7 @@ class Foreground {
     this.turns = 0;
   }
   draw() {
-    // Level 1
+    // Level #1
     if (game.background.turns < 30) {
       image(game.dogImage, this.x2 + 400, 0, width, height);
       image(game.foregroundImage, this.x, 0, width, height);
@@ -21,7 +21,7 @@ class Foreground {
       }
     }
     // transition
-    // Level 2
+    // Level #2
     if (game.background.turns >= 30 && game.background.turns < 60) {
       image(game.foregroundImageNight, this.x, 0, width, height)
       image(game.foregroundImageNight, this.x + width, 0, width, height)
@@ -31,7 +31,7 @@ class Foreground {
       }
     }
 
-    // final Level
+    //  Level #3
     if (game.background.turns >= 60) {
       image(game.dogImage, this.x2 + 400, 0, width, height);
       image(game.foregroundImage, this.x, 0, width, height);

js/game.js

@@ -6,7 +6,6 @@ class Game {
     this.playerImage;
     this.backgroundImages;
     this.foregroundImage;
-    this.mySound;
 
     this.coins = [];
     this.coinImage;
@@ -204,6 +203,7 @@ class Game {
     text(`LEVEL ${this.player.level}`, 460, 50);
     pop();
     if (this.background.turns === 30) {
+
       game.player.level = 2;
       game.gameSpeed = 1.5;
     }

js/main.js

@@ -3,10 +3,12 @@ let song;
 let menuSong;
 
 function setup() {
-  createCanvas(1000, 600);
+  let canvas = createCanvas(1000, 600);
+  canvas.parent('game')
   if (menuSong.isLoaded()) {
     menuSong.loop();
   }
+
 }
 
 function preload() {