diff --git a/frontend/static/js/utils/formUtils.js b/frontend/static/js/utils/formUtils.js index 54c0717..0222a4e 100644 --- a/frontend/static/js/utils/formUtils.js +++ b/frontend/static/js/utils/formUtils.js @@ -1,8 +1,8 @@ export function clear(property_name, elements_id) { elements_id.forEach(element_id => { - let element = document.getElementById(element_id) - element[property_name] = "" + let element = document.getElementById(element_id); + element[property_name] = ""; }); } diff --git a/frontend/static/js/views/MatchMakingView.js b/frontend/static/js/views/MatchMakingView.js index 8acadd6..8c1b96a 100644 --- a/frontend/static/js/views/MatchMakingView.js +++ b/frontend/static/js/views/MatchMakingView.js @@ -3,6 +3,7 @@ import { clear, fill_errors } from "../utils/formUtils.js"; import AbstractAuthenticatedView from "./abstracts/AbstractAuthenticatedView.js"; export default class extends AbstractAuthenticatedView { + constructor(params) { super(params, "Matchmaking"); @@ -10,6 +11,7 @@ export default class extends AbstractAuthenticatedView { async press_button() { + clear("innerText", ["detail"]); if (client.matchmaking.searching) { client.matchmaking.stop(); @@ -27,8 +29,6 @@ export default class extends AbstractAuthenticatedView { ondisconnect(event) { - if (event.code === 1000) - clear("innerText", ["detail"]); document.getElementById("button").value = "Find a game"; } @@ -50,13 +50,42 @@ export default class extends AbstractAuthenticatedView { async postInit() { - document.getElementById("button").onclick = this.press_button.bind(this); + let button = document.getElementById("button"); + + button.onclick = this.press_button.bind(this); + + let input = document.getElementById("nb_players-input"); + + input.addEventListener('keydown', async ev => { + if (ev.key !== 'Enter') + return; + + if (client.matchmaking.searching) + client.matchmaking.stop(); + + let nb_players = document.getElementById("nb_players-input").value; + + await client.matchmaking.start(this.onreceive.bind(this), this.ondisconnect.bind(this), nb_players); + + document.getElementById("button").value = "Stop matchmaking"; + }); + + let update = () => { + if (input.value < 2) + button.disabled = true; + else + button.disabled = false; + }; + + ["change", "oninput"].forEach((event_name) => { + input.addEventListener(event_name, update); + }); } async getHtml() { return `