Stars

by Nathan Piper

HTML

<script src='game.js'></script>
<body>
    <canvas id='canvas_background' height=400 width=500></canvas>
    <canvas id='canvas_player' height=400 width=500></canvas>
    <canvas id='canvas_enemies' height=400 width=500></canvas>
    <canvas id='canvas_ui' height=400 width=500></canvas>

</body>

CSS

canvas {
    position: absolute;
    top: 0;
    left: 0;
}
#canvas_background {
    background: black;
}

JavaScript

var width = 500;
var height = 400;
var FPS = 60;
var gamestate = "menu";
//canvas


var gbackground = document.getElementById('canvas_background').getContext('2d');
var gplayer = document.getElementById('canvas_player').getContext('2d');
var genemy = document.getElementById('canvas_enemies').getContext('2d');
var GUI = document.getElementById('canvas_ui').getContext('2d');
//arrays
var stars = [];
var bullets = [];
var enemies = [];
var planets = [];
//shoot timer
var shootTimer = 0;
var maxShootTimer = 30;
// x and y
var y = 50;
var y = 50;
//score
var score = 25200;
var level = 1;
var num = 2;
var planetHealth = 100;
//player
var player = {
    x: (width/2) - 8,
    width: 16,
    height: 16,
    y: height - 20,
    canShoot: true, 
    speed: 5,
    render: function () {
        gplayer.fillStyle = 'aqua';
        gplayer.fillRect(this.x, this.y, this.width, this.height);
    },
    tick: function () {
        if(Key.left && this.x > 0) this.x -= this.speed;
        if(Key.right && this.x < height-20) this.x += this.speed;
        if(Key.space && this.canShoot) {
            this.canShoot = false;
            bullets.push(new Bullet(this.x, this.y - 4));
            bullets.push(new Bullet(this.x + this.width, this.y - 4));
            shootTimer = maxShootTimer;          
            }

            }
      
    } 

//controls
var Key = {
    left: false,
    right: false,
    space: false,
    enter: false
};

addEventListener("keydown", function (e) {
    var keyCode = (e.keyCode) ? e.keyCode : e.which;
    switch (keyCode) {
        case 37:
            //left
            Key.left = true;
            break;
        case 39:
            //right
            Key.right = true;
            break;
        case 32:
            Key.space = true;
            break;
        case 13:
            Key.enter = true;
            break
    }
}, false);
addEventListener("keyup", function (e) {
    var keyCode = (e.keyCode) ? e.keyCode : e.which;
    switch (keyCode) {
     ...