No commit message

entities/boss.js

@@ -64,6 +64,7 @@ class Boss extends Entity {
     }
 
     onLaserAnimation() {
+        this.assets.playAudio(this.assets.boss_gun, false, 0.1);
         this.throwUpTimeLimit = Math.random() * 3 + 2;
         this.throwUpTime = 0;
         this.laserAnimationOn = false;
@@ -136,6 +137,7 @@ class Boss extends Entity {
         }
 
         if (this.life <= 0) {
+            this.assets.playAudio(this.assets["monster_die" + parseInt(Math.random() * 4)], false, 0.1);
             this.dispose = true;
             for (var a = 0; a < 20; a++) {
                 var particle = null;

entities/flyingmonster.js

@@ -39,6 +39,7 @@ class FlyingMonster extends Entity {
             }
         }
         if (this.life <= 0) {
+            this.assets.playAudio(this.assets["robot_die" + parseInt(Math.random() * 2)], false, 0.1);
             this.dispose = true;
             for (var a = 0; a < 5; a++) {
                 var particle = null;
@@ -64,6 +65,7 @@ class FlyingMonster extends Entity {
         if (this.shootTime >= this.shootTimeLimit) {
             var diffVector = this.position.sub(this.player.position);
             if (diffVector.lengthWithOutSqrt() <= this.map.tileWidth * this.map.tileWidth) {
+                this.assets.playAudio(this.assets.boss_gun, false, 0.1);
                 var radians = Math.atan2(diffVector.y, diffVector.x);
                 var bullet = null;
                 if (this.level.bulletsPooling.hasObjects()) {

entities/monster.js

@@ -60,6 +60,7 @@ class Monster extends Entity {
         }
 
         if (this.life <= 0) {
+            this.assets.playAudio(this.assets["monster_die" + parseInt(Math.random() * 4)], false, 0.1);
             this.dispose = true;
             for (var a = 0; a < 10; a++) {
                 var particle = null;

entities/player.js

@@ -46,6 +46,7 @@ class Player extends Entity {
         this.gunRadiansDir = Math.atan2(this.cursor.position.y - (this.position.y - this.camera.position.y), this.cursor.position.x - (this.position.x - this.camera.position.x));
         this.shootTime += dt;
         if (this.shootTime >= this.shootTimeLimit && this.cursor.isPressed) {
+            this.assets.playAudio(this.assets.player_gun, false, 0.1);
             var bullet = null;
             if (this.level.bulletsPooling.hasObjects()) {
                 bullet = this.level.bulletsPooling.get();

index.html

@@ -48,6 +48,12 @@
             var sceneManager = null;
 
             window.onload = function() {
+                canvas = document.getElementById("engine");
+                canvas.style = "border: 1px solid #ccc; background-color: #ff7f15";
+                var context = canvas.getContext("2d");
+                context.fillStyle = 'white';
+                context.textAlign = "center";
+                context.fillText("loading...", canvas.width / 2, canvas.height / 2);
                 var assets = Assets.getInstance();
                 assets.loadAll(onLoadAssets, null);
             };
@@ -58,8 +64,6 @@
             }
 
             function onLoadAtlas() {
-                canvas = document.getElementById("engine");
-                canvas.style = "border: 1px solid #ccc; background-color: #ff7f15";
                 document.onkeydown = onKeyDown;
                 document.onkeyup = onKeyUp;
                 cursor = Cursor.getInstance();

levels/level1.js

@@ -76,8 +76,14 @@ class Level1 {
         var tiles2 = [1 * this.map.mapWidth + 262, 2 * this.map.mapWidth + 262, 3 * this.map.mapWidth + 262, 4 * this.map.mapWidth + 262];
 
         this.cinematics = [
-            new Cinematic(this.player, this.map, this.camera, this.map.tileWidth * 42, this.map.tiles[1 * this.map.mapWidth + 42], tiles1),
-            new Cinematic(this.player, this.map, this.camera, this.map.tileWidth * 263, this.map.tiles[0 * this.map.mapWidth + 263], tiles2)
+            new Cinematic(this.player, this.map, this.camera, this.map.tileWidth * 42, this.map.tiles[1 * this.map.mapWidth + 42], tiles1, null),
+            new Cinematic(this.player, this.map, this.camera, this.map.tileWidth * 263, this.map.tiles[0 * this.map.mapWidth + 263], tiles2, function() {
+                if (!this.isPlayingBossMusic) {
+                    this.isPlayingBossMusic = true;
+                    this.music.stop();
+                    this.music = this.assets.playAudio(this.assets.boss, true, 0.2);
+                }
+            }.bind(this))
         ];
 
         this.checkpoints = [
@@ -207,6 +213,10 @@ class Level1 {
                this.monsters.push(new Boss(267, 1, this, this.map.tileWidth * 1.5, 150, this.player, true, 4));
             }).bind(this), new Vector(263 * this.map.tileWidth + this.map.tileWidth * 0.5, 11 * this.map.tileHeight + this.map.tileHeight * 0.5)),
         ];
+
+        this.assets = Assets.getInstance();
+        this.music = this.assets.playAudio(this.assets.main, true, 0.2);
+        this.isPlayingBossMusic = false;
     }
 
     update(dt) {
@@ -346,14 +356,15 @@ class Level1 {
 
 class Cinematic {
 
-    constructor(player, map, camera, xOffsetTo, targetTile, blockTiles) {
+    constructor(player, map, camera, xOffsetTo, targetTile, blockTiles, callBack) {
         this.isCinematicOn = false;
         this.xOffsetTo = xOffsetTo;
         this.targetTile = targetTile;
         this.player = player;
         this.map = map;
         this.camera = camera;
         this.blockTiles = blockTiles;
+        this.callBack = callBack;
     }
 
     update(dt) {
@@ -370,6 +381,9 @@ class Cinematic {
         }
 
         if (this.isCinematicOn) {
+            if (this.callBack !== null) {
+                this.callBack();
+            }
             this.camera.xOffset += (this.xOffsetTo - this.camera.xOffset) * dt;
             this.camera.minX = this.xOffsetTo + this.map.canvasWidth * 0.5;
             if (Math.abs(this.camera.xOffset - this.xOffsetTo) <= 10) {

scenes/gamescene.js

@@ -7,11 +7,11 @@ class GameScene extends Scene {
         var tileWidth = canvasWidth / 5;
         var tileHeight = canvasHeight / 4;
         this.config.offsetY = canvasHeight;
-        var assets = Assets.getInstance();
-        canvas.width = assets.spritesAtlas.width;
-        canvas.height = assets.spritesAtlas.height;
-        this.context.drawImage(assets.spritesAtlas, 0, 0);
-        var pixelData = this.context.getImageData(0, 0, assets.spritesAtlas.width, assets.spritesAtlas.height).data;
+        this.assets = Assets.getInstance();
+        canvas.width = this.assets.spritesAtlas.width;
+        canvas.height = this.assets.spritesAtlas.height;
+        this.context.drawImage(this.assets.spritesAtlas, 0, 0);
+        var pixelData = this.context.getImageData(0, 0, this.assets.spritesAtlas.width, this.assets.spritesAtlas.height).data;
         canvas.width = canvasWidth;
         canvas.height = canvasHeight;
         this.currentLevel = new Level1(pixelData, tileWidth, tileHeight, canvasWidth, canvasHeight);

utils/assets.js

@@ -10,8 +10,8 @@ class Assets {
         this.srcs = ["assets/sprites/sprites.png"];
         this.keys = ["spritesAtlas"];
         this.audio = {};
-        this.audio.srcs = [];
-        this.audio.keys = [];
+        this.audio.srcs = ["assets/sounds/boss.mp3", "assets/sounds/boss_gun.mp3", "assets/sounds/main.mp3", "assets/sounds/monster_die0.mp3", "assets/sounds/monster_die1.mp3", "assets/sounds/monster_die2.mp3", "assets/sounds/monster_die3.mp3", "assets/sounds/player_gun.mp3", "assets/sounds/robot_die0.mp3", "assets/sounds/robot_die1.mp3"];
+        this.audio.keys = ["boss", "boss_gun", "main", "monster_die0", "monster_die1", "monster_die2", "monster_die3", "player_gun", "robot_die0", "robot_die1"];
         window.AudioContext = window.AudioContext || window.webkitAudioContext;
         this.audioContext = new AudioContext();
     }