diff --git a/index.html b/index.html
index 4fe3733..49c7ba6 100644
--- a/index.html
+++ b/index.html
@@ -34,13 +34,13 @@
-
diff --git a/modules/fillLevelsSelection.mjs b/modules/fillLevelsSelection.mjs
index 399315c..4e72d7d 100644
--- a/modules/fillLevelsSelection.mjs
+++ b/modules/fillLevelsSelection.mjs
@@ -1,5 +1,6 @@
import { levelsBlueprint } from '/modules/levels.mjs'
import { generatePlayground } from '/modules/playground.mjs'
+import { Timer } from '/modules/timer.mjs'
export const fillLevelsSelection = (gameState, ctx) => {
let levelList = document.getElementById('level-list');
@@ -8,9 +9,11 @@ export const fillLevelsSelection = (gameState, ctx) => {
let selectionButton = document.createElement("button");
selectionButton.setAttribute("array-index", i);
selectionButton.addEventListener("click", (click) => {
- gameState.playground = generatePlayground(levelsBlueprint[
+ let blueprint = levelsBlueprint[
click.srcElement.getAttribute("array-index")
- ], canvas.width, canvas.height);
+ ];
+ gameState.playground = generatePlayground(blueprint.structure, canvas.width, canvas.height);
+ gameState.timer = new Timer(blueprint.time, gameState.timer.expireFunction);
gameState.playground.draw(ctx, gameState.width, gameState.height);
});
selectionButton.innerText = "Level" + i;
diff --git a/modules/levels.mjs b/modules/levels.mjs
index c182b78..93317c0 100644
--- a/modules/levels.mjs
+++ b/modules/levels.mjs
@@ -2,13 +2,15 @@ import { Square } from '/modules/enums.mjs';
// Blueprint for the first level
//
-const level1Blueprint = [[ Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall ],
- [ Square.Wall, Square.Destination, Square.Box, Square.Floor, Square.Player, Square.Wall ],
- [ Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall ]];
-
-
+const level1Blueprint = {
+ structure:[[ Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall ],
+ [ Square.Wall, Square.Destination, Square.Box, Square.Floor, Square.Player, Square.Wall ],
+ [ Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall ]],
+ time: 3000,
+};
// Blueprint for the second level
-const level2Blueprint = [
+const level2Blueprint = {
+ structure: [
[Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Floor, Square.Floor ],
[Square.Wall, Square.Destination, Square.Destination, Square.Floor, Square.Floor, Square.Wall, Square.Floor, Square.Floor, Square.Floor, Square.Floor, Square.Floor, Square.Wall, Square.Wall, Square.Wall],
[Square.Wall, Square.Destination, Square.Destination, Square.Floor, Square.Floor, Square.Wall, Square.Floor, Square.Box, Square.Floor, Square.Floor, Square.Box, Square.Floor, Square.Floor, Square.Wall],
@@ -19,7 +21,9 @@ const level2Blueprint = [
[Square.Floor, Square.Floor, Square.Wall, Square.Floor, Square.Box, Square.Floor, Square.Floor, Square.Box, Square.Floor, Square.Box, Square.Floor, Square.Box, Square.Floor, Square.Wall ],
[Square.Floor, Square.Floor, Square.Wall, Square.Floor, Square.Floor, Square.Floor, Square.Floor, Square.Wall, Square.Floor, Square.Floor, Square.Floor, Square.Floor, Square.Floor, Square.Wall ],
[Square.Floor, Square.Floor, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall ],
- ];
+ ],
+ time: 23000,
+};
export const levelsBlueprint = [
level1Blueprint,
diff --git a/modules/timer.mjs b/modules/timer.mjs
index f04e667..9cbf081 100644
--- a/modules/timer.mjs
+++ b/modules/timer.mjs
@@ -1,6 +1,7 @@
export class Timer {
constructor(time, expireFunction) {
self.time = time;
+ self.expireFunction = expireFunction;
self.timerElement = document.getElementById('timer');
self.pauseButton1 = document.getElementById('pause-1');
self.pauseButton2 = document.getElementById('pause-2');
@@ -34,7 +35,7 @@ export class Timer {
let timeStr = String(self.time).padStart(5, '0');
self.timerElement.innerHTML = "Time : " + timeStr.slice(0, 3) + '.' + timeStr.slice(3);
if (self.time == 0) {
- expireFunction();
+ self.expireFunction();
clearInterval(self.intervalControler);
self.timeRunning = false;
}
diff --git a/modules/tutorialControler.mjs b/modules/tutorialControler.mjs
new file mode 100644
index 0000000..91326ea
--- /dev/null
+++ b/modules/tutorialControler.mjs
@@ -0,0 +1,31 @@
+export class TutorialControler {
+ static messages = [
+ "V'là le Jérome avec son tracteur.\nFaut vit qu'il les mettes sous l'toit avant que ça pleuve.",
+ "Je m'suis dit : \"Faudrait que je d'mandes que tu lui y fasse\"",
+ "Pi tant qu'à faire, c'pas dur. T'as qu'à appuyer sur les flèches",
+ "Ben qu'est qu't'attends ? Vas y!",
+ ];
+
+ constructor() {
+ self.finished = false;
+ self.messageBox = document.getElementById('tutorial-box');
+ self.messageId = 0;
+ self.messageBox.innerHTML = TutorialControler.messages[self.messageId];
+ }
+
+ next() {
+ if (!self.finished) {
+ self.messageId++;
+ if (self.messageId == TutorialControler.messages.length) {
+ document.getElementById('tutorial-speech-bubble').style.visibility = "hidden";
+ self.finished = true;
+ } else {
+ self.messageBox.innerHTML = TutorialControler.messages[self.messageId];
+ }
+ }
+ }
+
+ isFinished() {
+ return self.finished;
+ }
+}
diff --git a/script.js b/script.js
index 0ba78bf..f36abd7 100644
--- a/script.js
+++ b/script.js
@@ -3,108 +3,53 @@ import { levelsBlueprint } from '/modules/levels.mjs'
import { MoveDirection } from '/modules/enums.mjs'
import { fillLevelsSelection } from '/modules/fillLevelsSelection.mjs'
import { Timer } from '/modules/timer.mjs'
+import { TutorialControler } from '/modules/tutorialControler.mjs'
let canvas = document.getElementById('canvas');
let ctx = canvas.getContext('2d');
let gameState = {
- playground: generatePlayground(levelsBlueprint[0], canvas.width, canvas.height),
+ playground: generatePlayground(levelsBlueprint[0].structure, canvas.width, canvas.height),
width: canvas.width,
height: canvas.height,
timer: new Timer(1500, () => {
alert("Les vaches mangent le foin");
}),
+ playable: false,
};
-// console.log(gameState.timer);
+
+let tutorial = new TutorialControler();
fillLevelsSelection(gameState, ctx);
window.ctx = ctx
-let playground = generatePlayground(levelsBlueprint[0], canvas.width, canvas.height);
window.addEventListener("keydown", (event) => {
if (!event.defaultPrevented) {
- switch (event.key) {
- case "ArrowDown":
- gameState.playground.move(MoveDirection.Down);
- break;
- case "ArrowUp":
- gameState.playground.move(MoveDirection.Up);
- break;
- case "ArrowRight":
- gameState.playground.move(MoveDirection.Right);
- break;
- case "ArrowLeft":
- gameState.playground.move(MoveDirection.Left);
- break;
- default:
- return;
- break;
- }
- gameState.playground.draw(ctx, canvas.width, canvas.height);
- if (gameState.playground.isSolved()) {
- alert("bravo");
+ if (gameState.playable) {
+ switch (event.key) {
+ case "ArrowDown":
+ gameState.playground.move(MoveDirection.Down);
+ break;
+ case "ArrowUp":
+ gameState.playground.move(MoveDirection.Up);
+ break;
+ case "ArrowRight":
+ gameState.playground.move(MoveDirection.Right);
+ break;
+ case "ArrowLeft":
+ gameState.playground.move(MoveDirection.Left);
+ break;
+ default:
+ return;
+ break;
+ }
+ gameState.playground.draw(ctx, canvas.width, canvas.height);
+ if (gameState.playground.isSolved()) {
+ alert("bravo");
+ }
+ } else {
+ tutorial.next();
+ gameState.playable = tutorial.isFinished();
}
}
});
-window.playground = gameState.playground;
-window.up = MoveDirection.Up;
-window.down = MoveDirection.Down;
-window.left = MoveDirection.Left;
-window.right = MoveDirection.Right;
-window.width = canvas.width;
-window.height = canvas.height;
-
-//function qui met à jour le temps
-
-// let Timer = {
-// time: 10,
-// intervalControler: setInterval(() => {
-// console.log(Timer.time);
-// let txt = document.getElementById('timer');
-// let afficher = "Time : " + Timer.time;
-// txt.innerHTML= afficher;
-// if (Timer.time == 0) {
-// alert("Termine");
-// }
-
-// Timer.time = Timer.time <= 0 ? 0 : Timer.time -1;
-// if (Timer.time == 0)
-// {
-// clearInterval(Timer.intervalControler);
-// }
-// }, 1000),
-// };
-
-// let time = 10;
-
-// function timer(){
-// let txt = document.getElementById('timer');
-// let level = 0;
-// let afficher = "Time : " + time;
-// txt.innerHTML= afficher;
-
-// time = time <= 0 ? 0 : time -1;
-// if (time == 0)
-// {
-// clearInterval(maVar);
-// }
-
-// }
-
-// let maVar = setInterval(timer, 1000);
-// if (time == 0){
-// alert('Terminé YAsmine')
-// }
-// while (document.readyState != "complete") {
-function set_time(){
- minutes=Math.floor
-}
-
-function Pause(){
- // time = time -10;
-}
-
-// // while (document.readyState != "complete") {
-setTimeout(1000);
-
-
-playground.draw(ctx);
+gameState.playground.draw(ctx);