escalator
/
escalator-web
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge branch 'master' of gitea.tforgione.fr:escalator/escalator-web

This commit is contained in:
Thibault Blanc Beyne 2018-08-26 21:44:56 +02:00
parent c380d05c74 5ea3d760f0
commit c9c8f3ed25
3 changed files with 88 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/game.js
View File

@ -1,3 +1,9 @@
const Screens = {
Exit: -1,
Menu: 0,
Game: 1,
}
class Game { class Game {
constructor(canvas) { constructor(canvas) {
@ -5,13 +11,13 @@ class Game {
this.canvas = canvas; this.canvas = canvas;
// Create menu // Create menu
let menu = new Menu(canvas); this.menu = new Menu(canvas);
// Create game scene // Create game scene
let box = new Box(); let box = new Box();
this.scene = new Scene(document.getElementById('canvas'), box); this.scene = new Scene(document.getElementById('canvas'), box);
this.changeScreen(menu); this.changeScreen(this.menu);
} }
changeScreen(screen) { changeScreen(screen) {
@ -28,13 +34,15 @@ class Game {
this.mainScreen.update(time); this.mainScreen.update(time);
if (this.mainScreen.status === Status.Finished) { if (this.mainScreen.status === Status.Finished) {
if (this.mainScreen.after === AfterMenu.Start) { if (this.mainScreen.after === Screens.Game) {
this.scene.initialize(); this.scene.initialize();
this.changeScreen(this.scene); this.changeScreen(this.scene);
} else if (this.mainScreen.after === AfterMenu.Exit) { } else if (this.mainScreen.after === Screens.Exit) {
if (navigator.app !== undefined && typeof navigator.app.exitApp === 'function') { if (navigator.app !== undefined && typeof navigator.app.exitApp === 'function') {
navigator.app.exitApp(); navigator.app.exitApp();
} }
} else if (this.mainScreen.after === Screens.Menu) {
this.changeScreen(this.menu);
} }
} }
} }

24
src/menu.js
View File

@ -1,10 +1,9 @@
const AfterMenu = {
Exit: 0,
Start: 1,
};
function resetHighScoreText() { function resetHighScoreText() {
return "Reset high score (" + heightToScore(window.localStorage.getItem("maxHeight")) + ")"; return "High score: " + heightToScore(window.localStorage.getItem("maxHeight"));
}
function collectableText() {
return "Coins: " + window.localStorage.getItem("collectableNumber");
} }
class Menu extends Gui { class Menu extends Gui {
@ -17,18 +16,17 @@ class Menu extends Gui {
this.addButton(new GuiButton(this.context, "Escalator", 0.5, 0.25, Type.StrokeFill)); this.addButton(new GuiButton(this.context, "Escalator", 0.5, 0.25, Type.StrokeFill));
this.context.font = "30px Dimbo"; this.context.font = "30px Dimbo";
this.addButton(new GuiButton(this.context, "New Game", 0.5, 0.55, Type.StrokeFill, () => { this.addButton(new GuiButton(this.context, "New Game", 0.5, 0.5, Type.StrokeFill, () => {
this.status = Status.Finished; this.status = Status.Finished;
this.after = AfterMenu.Start; this.after = Screens.Game;
})); }));
this.addButton(new GuiButton(this.context, resetHighScoreText, 0.5, 0.7, Type.StrokeFill, () => { this.addButton(new GuiButton(this.context, resetHighScoreText, 0.5, 0.6, Type.StrokeFill));
window.localStorage.setItem("maxHeight", 0) this.addButton(new GuiButton(this.context, collectableText, 0.5, 0.7, Type.StrokeFill));
}));
this.addButton(new GuiButton(this.context, "Exit", 0.5, 0.85, Type.StrokeFill, () => { this.addButton(new GuiButton(this.context, "Exit", 0.5, 0.8, Type.StrokeFill, () => {
this.status = Status.Finished; this.status = Status.Finished;
this.after = AfterMenu.Exit; this.after = Screens.Exit;
})); }));
} }

80
src/scene.js
View File

@ -5,11 +5,11 @@ class Scene extends Screen {
this.player = player; this.player = player;
this.currentHeight = 0; this.currentHeight = 0;
if (this.maxHeight === undefined) { if (this.maxHeight == undefined) {
this.maxHeight = 0; this.maxHeight = 0;
} }
if (this.collectableNumber === undefined) { if (this.collectableNumber == undefined) {
this.collectableNumber = 0; this.collectableNumber = 0;
} }
@ -179,10 +179,10 @@ class Scene extends Screen {
// Ugly but don't care // Ugly but don't care
// Copied and adapted from sdz // Copied and adapted from sdz
if( (collectable.x >= next.x + next.size / 2) if( (collectable.x - collectable.size / 2 >= next.x + next.size / 4)
|| (collectable.x + collectable.size <= next.x) || (collectable.x + collectable.size / 2 <= next.x - next.size / 4)
|| (collectable.y >= next.y + next.size) || (collectable.y - collectable.size / 2 >= next.y + next.size / 4)
|| (collectable.y + collectable.size <= next.y)) { || (collectable.y + collectable.size / 2 <= next.y - next.size / 4)) {
} else { } else {
collectable.collected = true; collectable.collected = true;
@ -241,7 +241,7 @@ class Scene extends Screen {
Collectable.texture, Collectable.texture,
0, 0, 64, 64, 0, 0, 64, 64,
(object.x - object.size / 2) * this.width(), (object.x - object.size / 2) * this.width(),
(1 - object.y - object.size / 2) * this.height(), (1 - object.y) * this.height() - size / 2,
size, size size, size
); );
} }
@ -371,20 +371,61 @@ class Scene extends Screen {
let text = this.newRecord ? "New Record!" : "Game Over"; let text = this.newRecord ? "New Record!" : "Game Over";
this.context.fillStyle = 'rgb(255, 255, 255)'; this.context.fillStyle = 'rgb(255, 255, 255)';
this.context.font = "50px Dimbo"; this.context.font = "50px Dimbo";
this.centerFillText(text, this.height() / 4); this.centerFillText(text, this.height() / 6);
this.centerStrokeText(text, this.height() / 4); this.centerStrokeText(text, this.height() / 6);
let size = 40; let size = 40;
this.context.font = size + "px Dimbo"; this.context.font = size + "px Dimbo";
let currentScoreText = "Your score: " + heightToScore(this.currentHeight); let currentScoreText = "Your score: " + heightToScore(this.currentHeight);
this.centerFillText(currentScoreText, this.height() / 2); this.centerFillText(currentScoreText, this.height() / 3);
this.centerStrokeText(currentScoreText, this.height() / 2); this.centerStrokeText(currentScoreText, this.height() / 3);
let highScoreText = "Highest score: " + heightToScore(this.maxHeight); let highScoreText = "Highest score: " + heightToScore(this.maxHeight);
this.centerFillText(highScoreText, this.height() / 2 + 2 * size); this.centerFillText(highScoreText, this.height() / 3 + 1.5 * size);
this.centerStrokeText(highScoreText, this.height() / 2 + 2 * size); this.centerStrokeText(highScoreText, this.height() / 3 + 1.5 * size);
let retryBox = this.makeRetryBox();
this.context.fillText("Retry", retryBox.x, retryBox.y + 40);
this.context.strokeText("Retry", retryBox.x, retryBox.y + 40);
let exitBox = this.makeExitBox();
this.context.fillText("Exit", exitBox.x, exitBox.y + 40);
this.context.strokeText("Exit", exitBox.x, exitBox.y + 40);
}
makeExitBox() {
let fontSize = 40;
let text = "Exit";
this.context.font = fontSize + "px Dimbo";
this.context.fillStyle = "rgb(255, 255, 255)";
this.context.strokeStyle = "rgb(0, 0, 0)";
let width = this.context.measureText(text).width;
return {
x: 2 * this.width() / 3 - width / 2,
y: 3 * this.height() / 4,
width: width,
height: fontSize,
}
}
makeRetryBox() {
let fontSize = 40;
let text = "Retry";
this.context.font = fontSize + "px Dimbo";
this.context.fillStyle = "rgb(255, 255, 255)";
this.context.strokeStyle = "rgb(0, 0, 0)";
let width = this.context.measureText(text).width;
return {
x: this.width() / 3 - width / 2,
y: 3 * this.height() / 4,
width: width,
height: fontSize,
}
} }
makePauseBox() { makePauseBox() {
@ -427,8 +468,17 @@ class Scene extends Screen {
this.player.jump(e.clientX / window.innerWidth, e.clientY / window.innerHeight); this.player.jump(e.clientX / window.innerWidth, e.clientY / window.innerHeight);
} }
} else if (this.status === Status.GameOver) { } else if (this.status === Status.GameOver) {
this.initialize(); let p = position(e);
this.status = Status.Running;
if (isInBox(p, enlargeBox(this.makeRetryBox()))) {
// Retry game
this.initialize();
this.status = Status.Running;
} else if (isInBox(p, enlargeBox(this.makeExitBox()))) {
// Go back to menu
this.status = Status.Finished;
this.after = Screens.Menu;
}
} }
} }