Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- // Create the canvas
- var canvas = document.createElement("canvas");
- var ctx = canvas.getContext("2d");
- canvas.width = 512;
- canvas.height = 480;
- document.body.appendChild(canvas);
- // Background image
- var bgReady = false;
- var bgImage = new Image();
- bgImage.onload = function () {
- bgReady = true;
- };
- bgImage.src = "images/background.png";
- // Hero image
- var heroReady = false;
- var heroImage = new Image();
- heroImage.onload = function () {
- heroReady = true;
- };
- heroImage.src = "images/hero.png";
- // Monster image
- var monsterReady = false;
- var monsterImage = new Image();
- monsterImage.onload = function () {
- monsterReady = true;
- };
- monsterImage.src = "images/monster.png";
- // Kill sound
- var snd = new Audio("audio/kill.wav")
- /* Game objects */
- // Hero object
- var hero = {
- speed: 250 // movement in pixels per second
- };
- // Monster object
- var monster = {
- speed: 200,
- directions: [null, null]
- };
- var monstersCaught = 0;
- // Wave counter
- var currentWave = 0;
- // Handle keyboard controls
- var keysDown = {};
- addEventListener("keydown", function (e) {
- keysDown[e.keyCode] = true;
- }, false);
- addEventListener("keyup", function (e) {
- delete keysDown[e.keyCode];
- }, false);
- // Reset the game when the player catches a monster
- var reset = function () {
- hero.x = canvas.width / 2;
- hero.y = canvas.height / 2;
- // Change wave number and change speed accordingly
- if (monstersCaught % 10 == 0){
- currentWave++;
- hero.speed += 25;
- monster.speed += 50;
- }
- // Reset speed on waves that are multiples of five
- if (currentWave % 5 == 1){
- hero.speed = 250;
- monster.speed = 250;
- }
- placeMonster();
- };
- var placeMonster = function () {
- // Throw the monster somewhere on the screen randomly
- monster.x = 32 + (Math.random() * (canvas.width - 96));
- monster.y = 32 + (Math.random() * (canvas.height - 96));
- };
- var moveEntity = function (entity, modifier, direction) {
- switch (direction) {
- case 38:
- case 'up':
- if (entity.y >= 32) { // Check collision with top wall
- entity.y -= entity.speed * modifier;
- }
- break;
- case 40:
- case 'down':
- if (entity.y <= canvas.height - 64) { // Check collision with bottom wall
- entity.y += entity.speed * modifier;
- }
- break;
- case 37:
- case 'left':
- if (entity.x >= 32) { // Check collision with left wall
- entity.x -= entity.speed * modifier;
- }
- break;
- case 39:
- case 'right':
- if (entity.x <= canvas.width - 64) {
- entity.x += entity.speed * modifier;
- }
- break;
- }
- };
- var keyToDirection = {
- 38: 'up',
- 40: 'down',
- 37: 'left',
- 39: 'right'
- };
- var directions = [37, 38, 39, 40];
- // Update game objects
- var update = function (modifier) {
- for (key in keysDown) {
- var direction = keyToDirection[key];
- if (direction) moveEntity(hero, modifier, keyToDirection[key]);
- }
- for (var i = 0; i < 2; i++) {
- moveEntity(monster, modifier, monster.directions[i]);
- }
- // Are they touching?
- if (
- hero.x <= (monster.x + 32)
- && monster.x <= (hero.x + 32)
- && hero.y <= (monster.y + 32)
- && monster.y <= (hero.y + 32)
- ) {
- ++monstersCaught;
- // Resets sound if it is still playing
- if(snd.currentTime > 0) {
- snd.currentTime = 0;
- }
- snd.play();
- placeMonster();
- }
- };
- var changeMonsterDirections = function() {
- for (var i = 0; i < 2; i++) {
- monster.directions[i] = directions[Math.floor(Math.random() * directions.length)];
- }
- // If both directions are the same, null out one of them so that
- // the monster doesn't move twice as fast
- if (monster.directions[0] == monster.directions[1]) {
- monster.directions[1] = null;
- }
- }
- // Draw everything
- var render = function () {
- if (bgReady) {
- ctx.drawImage(bgImage, 0, 0);
- }
- if (heroReady) {
- ctx.drawImage(heroImage, hero.x, hero.y);
- }
- if (monsterReady) {
- ctx.drawImage(monsterImage, monster.x, monster.y);
- }
- // Score
- ctx.fillStyle = "rgb(250, 250, 250)";
- ctx.font = "14px Helvetica";
- ctx.textAlign = "left";
- ctx.textBaseline = "top";
- ctx.fillText("Goblins caught: " + monstersCaught, 32, 32);
- ctx.fillText("Current wave: " + currentWave, 32, 46);
- };
- // The main game loop
- var main = function () {
- var now = Date.now();
- var delta = now - then;
- update(delta / 1000);
- render();
- then = now;
- };
- // Let's play this game!
- reset();
- var then = Date.now();
- setInterval(main, 1); // Execute as fast as possible
- setInterval(changeMonsterDirections, 1000);
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement