\n\n \n \n \n \n \n\n"
},
{
"path": "js/spaceinvaders.js",
"content": "/*\n spaceinvaders.js\n\n the core logic for the space invaders game.\n\n*/\n\n/* \n Game Class\n\n The Game class represents a Space Invaders game.\n Create an instance of it, change any of the default values\n in the settings, and call 'start' to run the game.\n\n Call 'initialise' before 'start' to set the canvas the game\n will draw to.\n\n Call 'moveShip' or 'shipFire' to control the ship.\n\n Listen for 'gameWon' or 'gameLost' events to handle the game\n ending.\n*/\n\n// Constants for the keyboard.\nvar KEY_LEFT = 37;\nvar KEY_RIGHT = 39;\nvar KEY_SPACE = 32;\n\n// Creates an instance of the Game class.\nfunction Game() {\n\n // Set the initial config.\n this.config = {\n bombRate: 0.05,\n bombMinVelocity: 50,\n bombMaxVelocity: 50,\n invaderInitialVelocity: 25,\n invaderAcceleration: 0,\n invaderDropDistance: 20,\n rocketVelocity: 120,\n rocketMaxFireRate: 2,\n gameWidth: 400,\n gameHeight: 300,\n fps: 50,\n debugMode: false,\n invaderRanks: 5,\n invaderFiles: 10,\n shipSpeed: 120,\n levelDifficultyMultiplier: 0.2,\n pointsPerInvader: 5,\n limitLevelIncrease: 25\n };\n\n // All state is in the variables below.\n this.lives = 3;\n this.width = 0;\n this.height = 0;\n this.gameBounds = {left: 0, top: 0, right: 0, bottom: 0};\n this.intervalId = 0;\n this.score = 0;\n this.level = 1;\n\n // The state stack.\n this.stateStack = [];\n\n // Input/output\n this.pressedKeys = {};\n this.gameCanvas = null;\n\n // All sounds.\n this.sounds = null;\n\n // The previous x position, used for touch.\n this.previousX = 0;\n}\n\n// Initialis the Game with a canvas.\nGame.prototype.initialise = function(gameCanvas) {\n\n // Set the game canvas.\n this.gameCanvas = gameCanvas;\n\n // Set the game width and height.\n this.width = gameCanvas.width;\n this.height = gameCanvas.height;\n\n // Set the state game bounds.\n this.gameBounds = {\n left: gameCanvas.width / 2 - this.config.gameWidth / 2,\n right: gameCanvas.width / 2 + this.config.gameWidth / 2,\n top: gameCanvas.height / 2 - this.config.gameHeight / 2,\n bottom: gameCanvas.height / 2 + this.config.gameHeight / 2,\n };\n};\n\nGame.prototype.moveToState = function(state) {\n \n // If we are in a state, leave it.\n if(this.currentState() && this.currentState().leave) {\n this.currentState().leave(game);\n this.stateStack.pop();\n }\n \n // If there's an enter function for the new state, call it.\n if(state.enter) {\n state.enter(game);\n }\n \n // Set the current state.\n this.stateStack.pop();\n this.stateStack.push(state);\n };\n\n// Start the Game.\nGame.prototype.start = function() {\n\n // Move into the 'welcome' state.\n this.moveToState(new WelcomeState());\n\n // Set the game variables.\n this.lives = 3;\n this.config.debugMode = /debug=true/.test(window.location.href);\n\n // Start the game loop.\n var game = this;\n this.intervalId = setInterval(function () { GameLoop(game);}, 1000 / this.config.fps);\n\n};\n\n// Returns the current state.\nGame.prototype.currentState = function() {\n return this.stateStack.length > 0 ? this.stateStack[this.stateStack.length - 1] : null;\n};\n\n// Mutes or unmutes the game.\nGame.prototype.mute = function(mute) {\n\n // If we've been told to mute, mute.\n if(mute === true) {\n this.sounds.mute = true;\n } else if (mute === false) {\n this.sounds.mute = false;\n } else {\n // Toggle mute instead...\n this.sounds.mute = this.sounds.mute ? false : true;\n }\n};\n\n// The main loop.\nfunction GameLoop(game) {\n var currentState = game.currentState();\n if(currentState) {\n\n // Delta t is the time to update/draw.\n var dt = 1 / game.config.fps;\n\n // Get the drawing context.\n var ctx = this.gameCanvas.getContext(\"2d\");\n \n // Update if we have an update function. Also draw\n // if we have a draw function.\n if(currentState.update) {\n currentState.update(game, dt);\n }\n if(currentState.draw) {\n currentState.draw(game, dt, ctx);\n }\n }\n}\n\nGame.prototype.pushState = function(state) {\n\n // If there's an enter function for the new state, call it.\n if(state.enter) {\n state.enter(game);\n }\n // Set the current state.\n this.stateStack.push(state);\n};\n\nGame.prototype.popState = function() {\n\n // Leave and pop the state.\n if(this.currentState()) {\n if(this.currentState().leave) {\n this.currentState().leave(game);\n }\n\n // Set the current state.\n this.stateStack.pop();\n }\n};\n\n// The stop function stops the game.\nGame.prototype.stop = function Stop() {\n clearInterval(this.intervalId);\n};\n\n// Inform the game a key is down.\nGame.prototype.keyDown = function(keyCode) {\n this.pressedKeys[keyCode] = true;\n // Delegate to the current state too.\n if(this.currentState() && this.currentState().keyDown) {\n this.currentState().keyDown(this, keyCode);\n }\n};\n\nGame.prototype.touchstart = function(s) {\n if(this.currentState() && this.currentState().keyDown) {\n this.currentState().keyDown(this, KEY_SPACE);\n } \n};\n\nGame.prototype.touchend = function(s) {\n delete this.pressedKeys[KEY_RIGHT];\n delete this.pressedKeys[KEY_LEFT];\n};\n\nGame.prototype.touchmove = function(e) {\n\tvar currentX = e.changedTouches[0].pageX;\n if (this.previousX > 0) {\n if (currentX > this.previousX) {\n delete this.pressedKeys[KEY_LEFT];\n this.pressedKeys[KEY_RIGHT] = true;\n } else {\n delete this.pressedKeys[KEY_RIGHT];\n this.pressedKeys[KEY_LEFT] = true;\n }\n }\n this.previousX = currentX;\n};\n\n// Inform the game a key is up.\nGame.prototype.keyUp = function(keyCode) {\n delete this.pressedKeys[keyCode];\n // Delegate to the current state too.\n if(this.currentState() && this.currentState().keyUp) {\n this.currentState().keyUp(this, keyCode);\n }\n};\n\nfunction WelcomeState() {\n\n}\n\nWelcomeState.prototype.enter = function(game) {\n\n // Create and load the sounds.\n game.sounds = new Sounds();\n game.sounds.init();\n game.sounds.loadSound('shoot', 'sounds/shoot.wav');\n game.sounds.loadSound('bang', 'sounds/bang.wav');\n game.sounds.loadSound('explosion', 'sounds/explosion.wav');\n};\n\nWelcomeState.prototype.update = function (game, dt) {\n\n\n};\n\nWelcomeState.prototype.draw = function(game, dt, ctx) {\n\n // Clear the background.\n ctx.clearRect(0, 0, game.width, game.height);\n\n ctx.font=\"30px Arial\";\n ctx.fillStyle = '#ffffff';\n ctx.textBaseline=\"middle\"; \n ctx.textAlign=\"center\"; \n ctx.fillText(\"Space Invaders\", game.width / 2, game.height/2 - 40); \n ctx.font=\"16px Arial\";\n\n ctx.fillText(\"Press 'Space' or touch to start.\", game.width / 2, game.height/2); \n};\n\nWelcomeState.prototype.keyDown = function(game, keyCode) {\n if(keyCode == KEY_SPACE) {\n // Space starts the game.\n game.level = 1;\n game.score = 0;\n game.lives = 3;\n game.moveToState(new LevelIntroState(game.level));\n }\n};\n\nfunction GameOverState() {\n\n}\n\nGameOverState.prototype.update = function(game, dt) {\n\n};\n\nGameOverState.prototype.draw = function(game, dt, ctx) {\n\n // Clear the background.\n ctx.clearRect(0, 0, game.width, game.height);\n\n ctx.font=\"30px Arial\";\n ctx.fillStyle = '#ffffff';\n ctx.textBaseline=\"center\"; \n ctx.textAlign=\"center\"; \n ctx.fillText(\"Game Over!\", game.width / 2, game.height/2 - 40); \n ctx.font=\"16px Arial\";\n ctx.fillText(\"You scored \" + game.score + \" and got to level \" + game.level, game.width / 2, game.height/2);\n ctx.font=\"16px Arial\";\n ctx.fillText(\"Press 'Space' to play again.\", game.width / 2, game.height/2 + 40); \n};\n\nGameOverState.prototype.keyDown = function(game, keyCode) {\n if(keyCode == KEY_SPACE) {\n // Space restarts the game.\n game.lives = 3;\n game.score = 0;\n game.level = 1;\n game.moveToState(new LevelIntroState(1));\n }\n};\n\n// Create a PlayState with the game config and the level you are on.\nfunction PlayState(config, level) {\n this.config = config;\n this.level = level;\n\n // Game state.\n this.invaderCurrentVelocity = 10;\n this.invaderCurrentDropDistance = 0;\n this.invadersAreDropping = false;\n this.lastRocketTime = null;\n\n // Game entities.\n this.ship = null;\n this.invaders = [];\n this.rockets = [];\n this.bombs = [];\n}\n\nPlayState.prototype.enter = function(game) {\n\n // Create the ship.\n this.ship = new Ship(game.width / 2, game.gameBounds.bottom);\n\n // Setup initial state.\n this.invaderCurrentVelocity = 10;\n this.invaderCurrentDropDistance = 0;\n this.invadersAreDropping = false;\n\n // Set the ship speed for this level, as well as invader params.\n var levelMultiplier = this.level * this.config.levelDifficultyMultiplier;\n var limitLevel = (this.level < this.config.limitLevelIncrease ? this.level : this.config.limitLevelIncrease);\n this.shipSpeed = this.config.shipSpeed;\n this.invaderInitialVelocity = this.config.invaderInitialVelocity + 1.5 * (levelMultiplier * this.config.invaderInitialVelocity);\n this.bombRate = this.config.bombRate + (levelMultiplier * this.config.bombRate);\n this.bombMinVelocity = this.config.bombMinVelocity + (levelMultiplier * this.config.bombMinVelocity);\n this.bombMaxVelocity = this.config.bombMaxVelocity + (levelMultiplier * this.config.bombMaxVelocity);\n this.rocketMaxFireRate = this.config.rocketMaxFireRate + 0.4 * limitLevel;\n\n // Create the invaders.\n var ranks = this.config.invaderRanks + 0.1 * limitLevel;\n var files = this.config.invaderFiles + 0.2 * limitLevel;\n var invaders = [];\n for(var rank = 0; rank < ranks; rank++){\n for(var file = 0; file < files; file++) {\n invaders.push(new Invader(\n (game.width / 2) + ((files/2 - file) * 200 / files),\n (game.gameBounds.top + rank * 20),\n rank, file, 'Invader'));\n }\n }\n this.invaders = invaders;\n this.invaderCurrentVelocity = this.invaderInitialVelocity;\n this.invaderVelocity = {x: -this.invaderInitialVelocity, y:0};\n this.invaderNextVelocity = null;\n};\n\nPlayState.prototype.update = function(game, dt) {\n \n // If the left or right arrow keys are pressed, move\n // the ship. Check this on ticks rather than via a keydown\n // event for smooth movement, otherwise the ship would move\n // more like a text editor caret.\n if(game.pressedKeys[KEY_LEFT]) {\n this.ship.x -= this.shipSpeed * dt;\n }\n if(game.pressedKeys[KEY_RIGHT]) {\n this.ship.x += this.shipSpeed * dt;\n }\n if(game.pressedKeys[KEY_SPACE]) {\n this.fireRocket();\n }\n\n // Keep the ship in bounds.\n if(this.ship.x < game.gameBounds.left) {\n this.ship.x = game.gameBounds.left;\n }\n if(this.ship.x > game.gameBounds.right) {\n this.ship.x = game.gameBounds.right;\n }\n\n // Move each bomb.\n for(var i=0; i