mots-croises/index.php

184 lines
5.7 KiB
PHP

<?php
ini_set('display_errors', 1);
ini_set('html_errors', 1);
ini_set('error_reporting', E_ALL);
const HAUTEUR_PAR_DEFAUT = 6;
const LARGEUR_PAR_DEFAUT = 6;
$id = filter_input(INPUT_GET, 'grille', FILTER_VALIDATE_REGEXP, [
"options" => [
"regexp" => "/^[a-f0-9]{13}$/"
]
]);
if (!$id) {
header("Location: " . $_SERVER['PHP_SELF'] . "?grille=" . uniqid() . "&" . http_build_query($_GET));
exit;
}
include_once "dico.php";
include_once "Grille.php";
$hauteur = filter_input(INPUT_GET, 'lignes', FILTER_VALIDATE_INT, [
"options" => [
"default" => HAUTEUR_PAR_DEFAUT,
"min_range" => 2,
"max_range" => 30
]
]);
$largeur = filter_input(INPUT_GET, 'colonnes', FILTER_VALIDATE_INT, [
"options" => [
"default" => LARGEUR_PAR_DEFAUT,
"min_range" => 2,
"max_range" => 30
]
]);
$grille = new Grille($hauteur, $largeur, $id);
?>
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Mots croisés</title>
<link rel="stylesheet" href="style.css">
<link rel="icon" href="favicon.ico">
</head>
<body>
<h1>
<table>
<tbody>
<tr>
<td colspan="2"></td>
<td>M</td>
</tr>
<tr>
<td>c</td>
<td>r</td>
<td>o</td>
<td>i</td>
<td>s</td>
<td>é</td>
<td>s</td>
</tr>
<tr>
<td colspan="2"></td>
<td>t</td>
</tr>
<tr>
<td colspan="2"></td>
<td>s</td>
</tr>
</tbody>
</table>
</h1>
<form id="grilleForm" class="grille">
<table>
<tr>
<th></th>
<?php for ($c = 0; $c < $largeur; $c++): ?>
<th><?= chr($c + 65) ?></th>
<?php endfor; ?>
</tr>
<?php for ($l = 0; $l < $hauteur; $l++): ?>
<tr>
<th><?= $l + 1 ?></th>
<?php for ($c = 0; $c < $largeur; $c++): ?>
<td class="case <?= $grille->grille[$l][$c] == " " ? "noire" : "blanche" ?>">
<?php if ($grille->grille[$l][$c] == " "): ?>
<input type="text" maxlength="1" size="1" name="<?= $l . $c ?>" value=" " disabled />
<?php else: ?>
<input type="text" maxlength="1" size="1" name="<?= $l . $c ?>" required pattern="[A-Z]" />
<?php endif; ?>
</td>
<?php endfor; ?>
</tr>
<?php endfor; ?>
</table>
</form>
<div class="definitions">
<div class="horizontales">
<h2>Horizontalement</h2>
<ol>
<?php for ($l = 0; $l < $hauteur; $l++): ?>
<li><?= $dico[$grille->get_ligne($l, $largeur)] ?></li>
<?php endfor; ?>
</ol>
</div>
<div class="verticales">
<h2>Verticalement</h2>
<ol type="A">
<?php for ($c = 0; $c < $largeur; $c++): ?>
<li><?= $dico[$grille->get_colonne($c, $hauteur)] ?></li>
<?php endfor; ?>
</ol>
</div>
</div>
<script>
const inputs = Array.from(grilleForm.querySelectorAll('input[type="text"]'))
let largeur = <?= $largeur ?>;
let nb_cases = inputs.length;
let index = 0;
async function sha256(text) {
const encoder = new TextEncoder();
const data = encoder.encode(text);
const hashBuffer = await crypto.subtle.digest('SHA-256', data);
const hashArray = Array.from(new Uint8Array(hashBuffer));
return hashArray.map(b => b.toString(16).padStart(2, '0')).join('');
}
inputs.forEach(input => {
input.index = index++
input.onfocus = function(event) {
input.select();
}
input.onkeydown = function(event) {
switch (event.key) {
case "ArrowUp":
inputs[(input.index - largeur + nb_cases) % nb_cases].focus()
break;
case "ArrowDown":
inputs[(input.index + largeur) % nb_cases].focus()
break;
case "ArrowLeft":
inputs[(input.index - 1 + nb_cases) % nb_cases].focus()
break;
case "ArrowRight":
inputs[(input.index + 1) % nb_cases].focus()
break;
}
}
input.oninput = function(event) {
this.value = this.value.toUpperCase()
if (!input.checkValidity()) {
input.value = ""
}
if (grilleForm.checkValidity()) {
sha256(inputs.map(input => input.value).join("")).then(
hash => {
if (hash == "<?= $grille->hash() ?>") {
alert("Bravo ! Vous avez trouvé la grille !")
if (confirm("Bravo ! \nUne nouvelle partie ?")) {
location = "."
}
}
}
)
}
}
})
// <?= $grille->hash() ?>
</script>
</html>