diff --git a/index.html b/index.html index 5a06003..e52bb3c 100644 --- a/index.html +++ b/index.html @@ -27,6 +27,12 @@
diff --git a/modules/scoreboard.mjs b/modules/scoreboard.mjs index 2d07c65..6420e38 100644 --- a/modules/scoreboard.mjs +++ b/modules/scoreboard.mjs @@ -1,68 +1,81 @@ -export class Gamer { - constructor(Name, Score){ - this.name = Name; - this.score = Score; - this.gamers = [] - } +export class Scoreboard { + constructor() { + this.currentGamer = new Gamer("user", 0); + this.gamers = []; + this.gamers.push(this.currentGamer); + + } + - Scoreboard() - { - let alias = prompt("Entre ton nom", "User"); - //let gamers = []; - //self.gamers - this.gamers.push( new Gamer(alias, 0)); - //console.log(gamers); - //let game = new Gamer ("test", 0); - //let table = document.getElementById("scoreTable"); + updatedName(name) { + let previousGamer = this.currentGamer; + if(name != this.currentGamer.name) { + console.log("updated"); + this.currentGamer = new Gamer(name, 0); + this.addGamer(this.currentGamer); + } + + if (previousGamer != this.currentGamer && previousGamer.score == 0) { + this.removeGamer(previousGamer); + console.log("removed"); + console.log(this.gamers); + } - //console.log(table); - //console.log(tableau); this.renderArray(); - } - addGamer() - { - - } - removeGamer(ev) - { - this.gamers.splice(ev.target.getAttribute("array-index"), 1); - renderArray(); + addGamer(gamer) { + this.gamers.push(gamer); } - renderArray() - { - let tableau= document.getElementById("scoreTable"); - //console.log(tableau); - tableau.innerText = ""; + removeGamer(gamer) { + this.gamers.splice(this.gamers.indexOf(gamer), 1); + } + + renderArray() { + let table = document.getElementById("scoreTable"); + table.innerHTML = ""; this.gamers.forEach((gamer, index) => { - let tableRow = document.createElement("tr"); - let nameTd = document.createElement("td"); - let scoreTd = document.createElement("td"); - let rmvTd = document.createElement("td"); - let rmvButton = document.createElement("button"); - rmvButton.innerText = "delete"; - rmvButton.setAttribute("array-index", index); - rmvButton.addEventListener("click", gamer.removeGamer); - rmvTd.appendChild(rmvButton); - - nameTd.innerText = gamer.name; - scoreTd.innerText = gamer.score; - - tableRow.appendChild(nameTd); - tableRow.appendChild(scoreTd); - tableRow.appendChild(rmvTd); - tableau.appendChild(tableRow); - + let row = table.insertRow(); + let cell1 = row.insertCell(); + let cell2 = row.insertCell(); + cell1.innerHTML = gamer.name; + cell2.innerHTML = gamer.score; }); - //console.log(tableau); + + } + + updateCurrentGamer(gamer) { + this.currentGamer = gamer; + } + + getCurrentGamer() { + return this.currentGamer; } - UpdateScore() - { - +} + + +export class Gamer { + constructor(name, score) { + this.name = name; + this.score = score; + } + + updateScore(score) { + this.score = score; + } + + updateName(name) { + this.name = name; } -} \ No newline at end of file + getScore() { + return this.score; + } + + getName() { + return this.name; + } +} diff --git a/script.js b/script.js index fc16ff1..6fd0349 100644 --- a/script.js +++ b/script.js @@ -4,7 +4,7 @@ import { MoveDirection } from '/modules/enums.mjs' import { fillLevelsSelection, selectLevel, LevelManager } from '/modules/levelSelection.mjs' import { Timer } from '/modules/timer.mjs' import { TutorialControler } from '/modules/tutorialControler.mjs' -import { Gamer } from '/modules/scoreboard.mjs' +import { Scoreboard, Gamer } from '/modules/scoreboard.mjs' let canvas = document.getElementById('canvas'); let difficultySlider = document.getElementById('difficulty-slider'); @@ -79,8 +79,22 @@ window.addEventListener("keydown", (event) => { }); //let table = document.getElementById("scoreTable"); -let joueur = new Gamer("user", 0); -joueur.Scoreboard(); +// let joueur = new Gamer("user", 0); +// joueur.Scoreboard(); + +let scoreboard = new Scoreboard(); +let inputName = document.getElementById("name"); +inputName.addEventListener("input", (event) => { + console.log(event.target.value); + inputName.setAttribute('value', event.target.value); +}); + +let submitButton = document.getElementById("submit-name"); +submitButton.addEventListener("click", () => { + let value = inputName.value; + scoreboard.updatedName(value); +}); + window.gamestate = gameState; gameState.playground.draw(ctx); diff --git a/style.css b/style.css index 68d0ebb..73a8530 100644 --- a/style.css +++ b/style.css @@ -26,6 +26,7 @@ main { min-height: 40vh; } + aside { margin: 0 auto; float: left; @@ -142,3 +143,8 @@ tr:nth-of-type(even) { position: relative; text-align: justify; } + +.input-field { + display: flex; + flex-direction: row; +}