reportValidity

This commit is contained in:
Adrien MALINGREY 2023-04-24 09:19:45 +02:00
parent de3e54b9cd
commit 7407fd1138
2 changed files with 8 additions and 9 deletions

9
app.js
View File

@ -376,11 +376,11 @@ Z.prototype.minoesPosition = [
class Settings {
constructor() {
for (let input of settingsForm.getElementsByTagName("input")) {
this.form = settingsForm
for (let input of this.form.getElementsByTagName("input")) {
if (localStorage[input.name]) input.value = localStorage[input.name]
}
settingsForm.onsubmit = newGame
this.form.submit = newGame
this.modal = new bootstrap.Modal('#settingsModal')
document.getElementById('settingsModal').addEventListener('shown.bs.modal', () => {
resumeButton.focus()
@ -621,7 +621,6 @@ function resume(event) {
event.preventDefault()
settings.load()
document.onkeydown = onkeydown
document.onkeyup = onkeyup
@ -801,7 +800,7 @@ function gameOver() {
window.onbeforeunload = function(event) {
localStorage["highScore"] = stats.highScore
for (let input of settingsForm.getElementsByTagName("input")) {
for (let input of settings.form.getElementsByTagName("input")) {
localStorage[input.name] = input.value
}
}

View File

@ -22,7 +22,7 @@
<h1 id="titleHeader" class="modal-title w-100 text-center">QUATRIS</h1>
</div>
<div class="modal-body">
<form name="settingsForm">
<form name="settingsForm" class="needs-validation" novalidate oninput="resumeButton.disabled = !settingsForm.checkValidity()">
<fieldset id="keyBindFielset" class="row g-2 mb-3 align-items-center text-center">
<legend class="text-start">Commandes</legend>
<label for="moveLeftInput" title="Gauche" class="col-sm-2 col-form-label d-flex align-items-center justify-content-center">
@ -79,13 +79,13 @@
<label for="arrInput" class="col-sm-2 col-form-label" title="Automatic Repeat Rate : période de répétition de l'action">ARR</label>
<div class="col-sm-4">
<div class="input-group">
<input name="arr" id="arrInput" type="number" class="form-control text-center" value="50" min="2" max="200" step="1">
<input name="arr" id="arrInput" type="number" class="form-control text-center" value="50" min="2" max="200" step="1" required onInput="arrInput.reportValidity()">
<div class="input-group-text">ms</div>
</div>
</div>
<div class="col-sm-4">
<div class="input-group">
<input name="das" id="dasInput" type="number" class="form-control text-center" value="300" min="100" max="500" step="5">
<input name="das" id="dasInput" type="number" class="form-control text-center" value="300" min="100" max="500" step="5" required onInput="dasInput.reportValidity()">
<div class="input-group-text">ms</div>
</div>
</div>
@ -95,7 +95,7 @@
<legend class="text-start">Partie</legend>
<label for="levelInput" class="col-sm-2 col-form-label text-center">Niveau</label>
<div class="col-sm-4">
<input name="startLevel" id="levelInput" type="number" class="form-control text-center" value="1" min="1" max="15">
<input name="startLevel" id="levelInput" type="number" class="form-control text-center" value="1" min="1" max="15" required onInput="startLevel.reportValidity()">
</div>
<div class="col-sm-4">
<button id="resumeButton" type="submit" data-bs-dismiss="modal" class="btn btn-primary form-control" autofocus>Jouer</button>