background game in javascript
<canvas id = "gc" width = "400" height = "400"></canvas>
<script>
var cw = 20;
var ch = 70;
var bw = 15;
var bh = 7;
window.onload = function() {
canvas = document.getElementById("gc");
canvasContext = canvas.getContext("2d");
setInterval(game, 1000/50);
}
function game() {
canvasContext.fillStyle = "black";
canvasContext.fillRect(0, 0, canvas.width, canvas.height);
canvasContext.fillStyle = "cyan";
canvasContext.fillRect(0, 330, cw, ch);
canvasContext.fillStyle = "orange";
canvasContext.fillRect(380, 330, cw, ch);
addEventListener("click", function() {
canvasContext.fillStyle = "lime";
canvasContext.fillRect(25, 360, bw, bh);
});
canvasContext.fillStyle = "lightblue";
canvasContext.fillRect(0, 0, canvas.width, 100);
canvasContext.fillStyle = "lightskyblue";
canvasContext.fillRect(0, 100, canvas.width, 100);
canvasContext.fillStyle = "white";
canvasContext.fillRect(30, 80, 80, 30);
canvasContext.fillStyle = "white";
canvasContext.fillRect(180, 130, 80, 30);
canvasContext.fillStyle = "white";
canvasContext.fillRect(250, 70, 80, 30);
}
</script>