jdg/breakout
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

ReOrganizing the code

Browse Source
This commit is contained in:
José David Guillén 2021-11-14 14:56:31 +01:00
parent b682ad199c
commit 0f4a403edb
7 changed files with 121 additions and 72 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
Ball.js
View File

@ -88,7 +88,6 @@ class Ball {
}
g2r(deg) {
console.log((360+deg)%360);
return ( ((360+deg)%360) * Math.PI) / 180.0;
}

52
Board.js Normal file
View File

@ -0,0 +1,52 @@
class Board {
constructor(ctx, key) {
this.controls = {};
this.key = key;
this.stop = false;
this.ctx = ctx;
this.x = ctx.canvas.width;
this.y = ctx.canvas.height / 2 - 48;
this.w = this.ctx.canvas.width;
this.h = this.ctx.canvas.height
}
run() {
let _this = this;
this.stop = false;
this.key.setKeydown( e => {
let code = e.code;
for(var key in this.controls) {
if(key==code) this.controls[key]();
}
} );
return new Promise((resolve, reject) => {
_this.resolve = resolve;
_this.reject = reject;
_this.loop();
}
);
}
next(nextStage) {
this.stop = true;
if (this.requestID) {
cancelAnimationFrame(this.requestID);
this.requestID = null;
}
this.ctx.clearRect(0, 0, this.w, this.h);
this.resolve(nextStage);
}
loop() {
if (this.stop) return;
this.ctx.clearRect(0, 0, this.w, this.h);
this.update();
this.requestID = requestAnimationFrame( ()=>this.loop() );
}
update() {
}
}

11
Intro.js → GameIntro.js
View File

@ -1,8 +1,9 @@
class Intro {
constructor(ctx) {
this.ctx = ctx;
this.x = ctx.canvas.width;
this.y = ctx.canvas.height / 2 - 48;
class GameIntro extends Board {
constructor(ctx, key) {
super(ctx, key);
this.controls = {
'Space': ()=>this.next(1)
}
}
update() {
this.centerText('BreakOut', this.y, '48px', 'Consolas', 'Black');

42
GamePlay.js Normal file
View File

@ -0,0 +1,42 @@
class GamePlay extends Board {
constructor(ctx, key) {
super(ctx, key);
this.controls = {
'KeyX': ()=>{
this.balls.push(new Ball(this.ctx, this.bar));
this.balls[this.balls.length - 1].start();
},
'Space': ()=>{
this.balls[0].moving = true;
}
}
this.score = new Score(ctx);
this.lives = new Lives(ctx);
this.bar = new Bar(ctx, key);
this.newGame();
}
newGame() {
this.lives.reset();
this.score.reset();
this.bar.reset();
this.balls = [];
this.balls.push(new Ball(this.ctx, this.bar));
}
update() {
if(this.lives.get()==0) {
gameOver.update();
} else {
this.balls = this.balls.filter(ball => ball.update());
if (this.balls.length==0) {
if ( !this.lives.lost() ) this.balls.push(new Ball(this.ctx, this.bar));
}
this.bar.update();
}
this.score.update();
this.lives.update();
}
}

3
Lives.js
View File

@ -15,6 +15,9 @@ class Lives {
this.lives--;
return this.lives==0;
}
get() {
return this.lives;
}
update() {
if (this.y != 60) this.y++;
if (this.y > 0) {

9
index.html
View File

@ -7,13 +7,18 @@
padding: 0;
}
</style>
<!-- ------------------------------------------ -->
<script src="Key.js"></script>
<script src="Intro.js"></script>
<script src="GameOver.js"></script>
<script src="Board.js"></script>
<!-- ------------------------------------------ -->
<script src="GameIntro.js"></script>
<!-- ------------------------------------------ -->
<script src="Score.js"></script>
<script src="Lives.js"></script>
<script src="Bar.js"></script>
<script src="Ball.js"></script>
<script src="GamePlay.js"></script>
<!-- ------------------------------------------ -->
<script src="index.js"></script>
</head>

75
index.js
View File

@ -1,4 +1,6 @@
"use strict";
// import {Intro as game_intro} from "./Intro";
// import game_play from "./game.js";
document.addEventListener('DOMContentLoaded', init);
@ -10,70 +12,15 @@ function init() {
ctx = canvas.getContext('2d');
document.body.insertBefore(canvas, document.body.childNodes[0]);
function run() {
ctx.clearRect(0, 0, canvas.width, canvas.height);
refresh();
requestAnimationFrame(run);
}
// -------------------------------------------------------------------
let gstate = 0;
let key = new Key(controls);
let intro = new Intro(ctx);
let gameOver = new GameOver(ctx);
let score = new Score(ctx);
let lives = new Lives(ctx);
let bar = new Bar(ctx, key);
let balls = [];
newGame();
function controls(e) {
switch (gstate) {
case 0: // Waiting to start
if (e.code == 'Space') newGame();
break;
case 1: // Playing...
if (e.code == 'Space' && balls.length>0) balls[balls.length - 1].start();
else
if (e.code == 'KeyX') { balls.push(new Ball(ctx, bar)); balls[balls.length - 1].start(); }
break;
case 2: // Game Over
if (e.code == 'Space') newGame();
break;
let key = new Key(), board;
function runBoard(stage) {
switch(stage) {
case 1: board = new GamePlay(ctx, key); break;
default: board = new GameIntro(ctx,key); break;
}
board
.run()
.then( stage=>runBoard(stage), e=>{} );;
}
function newGame() {
gstate = 1;
lives.reset();
score.reset();
bar.reset();
balls.push(new Ball(ctx, bar));
}
function refresh() {
switch (gstate) {
case 0: // Waiting to start
intro.update();
break;
case 1: // Playing...
case 2:
if(gstate==2) {
gameOver.update();
} else {
balls = balls.filter(ball => ball.update());
if (balls.length==0) {
if ( lives.lost() ) gstate=2;
else balls.push(new Ball(ctx, bar));
}
bar.update();
}
score.update();
lives.update();
break;
}
}
run();
runBoard(0);
}