Issue#17/music

README.md

@@ -1,6 +1,8 @@
 # REFLEXIO
 A web game based on reflection written purely in HTML5 and Javascript.
 
+Background music by <nosoapradio.us>, used under a Creative Commons Attribution License.
+
 ### Play Online!
 The game is live on:
 >[ketangupta.in/reflexio]

scripts/mainmenu.js

@@ -1,8 +1,9 @@
 function mainMenu()
 {
-	gameArena.clearRect(0,0, width, height);
+  bgm.pause();
+
+  gameArena.clearRect(0,0, width, height);
 	drawMovingSpace();
-
 	var hoverCheck = 0;
 	var colorCheck;
 
@@ -87,7 +88,10 @@ function mainMenu_click()
 		clearInterval(gameTimer);
 		update();
 		lastClickCounter = 0;
-		if(volume) menu_click.play();
+		if(volume) {
+      menu_click.play();
+      nextBGM();
+    }
 	}
 	if(mousex >= midx-200*(width/1220) && mousex <= midx+200*(width/1220) && mousey >= midy-20*(width/1220) && mousey <= midy+50*(width/1220))
 	{

scripts/script.js

@@ -13,13 +13,25 @@ var volume = 1;
 var particles = 1;
 var runtime1 = 0;
 
-
 var menu_click = new Audio();                     // why loading ??
 menu_click.onload = function() {          
 	loading++;
 }
 menu_click.src = "sounds/sound1.wav";
 
+availBGM = [
+            "bgm1.mp3",
+            "bgm2.mp3",
+            "bgm3.mp3"
+           ];
+
+var bgm = new Audio();
+var bgmIterator = -1;
+
+bgm.addEventListener('ended', function() {
+    nextBGM();
+});
+
 var mainShip = new Image();
 mainShip.onload = function() {
 	loading++;
@@ -454,3 +466,11 @@ function drawRightRoundedRectangle(x, y, width, height, color, lineWidth)
 	gameArena.lineTo(x, y);
 	gameArena.stroke();
 }
+
+function nextBGM() {
+  if (volume) {
+    bgmIterator = (bgmIterator + 1) % availBGM.length;
+    bgm.src = "sounds/" + availBGM[bgmIterator];
+    bgm.play();
+  }
+}