grand dico

This reverts commit ed1ad0566f, reversing
changes made to 6ee909914d.

.gitignore

@@ -1,2 +1,5 @@
 __pycache__/
 test*.*
+*.py
+dico2.csv
+wiktionaryXfr2010.7z

Grille.php

@@ -1,50 +1,40 @@
 <?php
-
 include_once "dico.php";
 
 
-function melanger_cles($tableau)
-{
-    uksort($tableau, function ($a, $b) {
-        return mt_rand(-1, 1);
-    });
-    return $tableau;
+$randmax = mt_getrandmax() + 1;
+function gaussienne($moyenne = 0, $ecartType = 1.0): float {
+    global $randmax;
+    
+    $u = 0;
+    $v = 0;
+
+    $u = (mt_rand() + 1) / $randmax;
+    $v = (mt_rand() + 1) / $randmax;
+
+    $z = sqrt(-2.0 * log($u)) * cos(2.0 * M_PI * $v);
+    return $z * $ecartType + $moyenne;
 }
 
 
-class Grille implements Iterator, ArrayAccess {
+class Grille implements ArrayAccess
+{
     public $grille;
     public $hauteur;
     public $largeur;
-    private $grilles;
-    private $lettres_suivantes;
+    public $dico;
     private $positions;
     private $nb_positions;
-    public $lignes;
-    public $colonnes;
+    public $lignes = [];
+    public $colonnes = [];
+    public $valide = false;
+    private $id;
 
-    public function __construct($hauteur, $largeur, $id = "")
+    public function __construct($hauteur, $largeur)
     {
         $this->hauteur   = $hauteur;
         $this->largeur   = $largeur;
         $this->grille    = array_fill(0, $hauteur, array_fill(0, $largeur, ''));
-        $this->lignes = [];
-        $this->colonnes = [];
-
-        $this->lettres_suivantes = [];
-        foreach ($hauteur == $largeur ? [$hauteur] : [$hauteur, $largeur] as $longueur) {
-            $this->lettres_suivantes[$longueur] = [];
-            foreach (mots_espaces($longueur, $hauteur == $largeur ? MAX_MOTS : MAX_MOTS/2) as $mots) {
-                $mot = implode(" ", $mots);
-                $ref = &$this->lettres_suivantes[$longueur];
-                for ($i = 0; $i < $longueur; $i++) {
-                    $lettre = $mot[$i];
-                    if (!isset($ref[$lettre])) $ref[$lettre] = [];
-                    $ref = &$ref[$lettre];
-                }
-                $ref = [];
-            }
-        }
 
         $this->positions = [];
         for ($y = 0; $y < $hauteur; $y++) {
@@ -53,8 +43,7 @@ class Grille implements Iterator, ArrayAccess {
         }
         $this->nb_positions = count($this->positions);
 
-        mt_srand($id == "" ? null : crc32($id));
-        $this->grilles = $this->generateur();
+        $this->dico = mots_espaces(max($hauteur, $largeur));
     }
 
     public function get_ligne($y, $largeur)
@@ -73,56 +62,93 @@ class Grille implements Iterator, ArrayAccess {
         return $colonne;
     }
 
-    public function generateur($i = 0)
+    public function gen_grilles($i = 0, $lettres_ligne = NULL)
     {
-        global $dico;
-
-        if ($i == $this->nb_positions) {
-            yield $this;
-            return;
-        }
-
         [$x, $y] = $this->positions[$i];
 
-        $lettres_suivantes_ligne = $this->lettres_suivantes[$this->largeur];
-        for ($x2 = 0; $x2 < $x; $x2++)
-            $lettres_suivantes_ligne = $lettres_suivantes_ligne[$this->grille[$y][$x2]];
-        $lettres_suivantes_colonne = $this->lettres_suivantes[$this->hauteur];
-        for ($y2 = 0; $y2 < $y; $y2++)
-            $lettres_suivantes_colonne = $lettres_suivantes_colonne[$this->grille[$y2][$x]];
-        $lettres_communes = melanger_cles(array_intersect_key(
-            $lettres_suivantes_ligne,
-            $lettres_suivantes_colonne
-        ));
+        // Recherche de la prochaine lettre possible sur la case courante
+        // en ligne
+        if ($x == 0) {
+            $lettres_ligne = $this->dico[$this->largeur];
+        }
+
+        // en colonne
+        $lettres_colonne = $this->dico[$this->hauteur];
+        for ($y2 = 0; $y2 < $y; $y2++) {
+            $lettres_colonne = $lettres_colonne->branches[$this->grille[$y2][$x]];
+        }
+        $lettres_communes = array_intersect_key(
+            $lettres_ligne->branches,
+            $lettres_colonne->branches
+        );
+        foreach ($lettres_communes as $lettre => $_) {
+            $lettres_communes[$lettre] = count($lettres_ligne->branches[$lettre]) * count($lettres_colonne->branches[$lettre]) * gaussienne(1, 5);
+        }
+        uksort($lettres_communes, function($a, $b) use ($lettres_communes) {
+            return $lettres_communes[$b] <=> $lettres_communes[$a];
+        });
+        $lettres_communes = array_slice($lettres_communes, 0, 3);
 
         foreach ($lettres_communes as $lettre => $_) {
             $this->grille[$y][$x] = $lettre;
 
-            $this->lignes[$y] = [];
-            if ($x == $this->largeur - 1) {
-                foreach (explode(" ", $this->get_ligne($y, $this->largeur)) as $rang => $mot) {
-                    if (strlen($mot) == 1) continue;
-                    if (in_array($mot, array_merge(...$this->lignes, ...$this->colonnes))) continue 2;
-                    $this->lignes[$y][$rang] = $mot;
-                }
-            }
-            $this->colonnes[$x] = [];
-            if ($y == $this->hauteur - 1) {
-                foreach (explode(" ", $this->get_colonne($x, $this->hauteur)) as $rang => $mot) {
-                    if (strlen($mot) == 1) continue;
-                    if (in_array($mot, array_merge(...$this->lignes, ...$this->colonnes))) continue 2;
-                    $this->colonnes[$x][$rang] = $mot;
-                }
+            // Omission des lettres isolées
+            if ($lettre == " "
+                && ($y - 2 < 0 || $this->grille[$y - 2][$x] == " ")
+                && ($y - 1 < 0 || $x - 1 < 0 || $this->grille[$y - 1][$x - 1] == " ")
+                && ($y - 1 < 0 || $x + 1 >= $this->largeur || $this->grille[$y - 1][$x + 1] == " ")
+            ) {
+                continue;
             }
 
-            if ($i < $this->nb_positions) {
-                yield from $this->generateur($i + 1);
+            // Omission des doublons
+            $mots = [];
+            if ($x == $this->largeur - 1) $mots = explode(" ", $this->get_ligne($y, $this->largeur));
+            else if ($lettre == " ") $mots = explode(" ", $this->get_ligne($y, $x));
+            else $mots = [];
+            $this->lignes[$y] = array_filter($mots, function ($mot) {
+                return strlen($mot) >= 2;
+            });
+            if (count($this->lignes[$y])) {
+                $mot = array_pop($this->lignes[$y]);
+                if (strlen($mot > 2) && in_array($mot, array_merge(...$this->lignes, ...$this->colonnes))) continue;
+                else $this->lignes[$y][] = $mot;
+            }
+
+            if ($y == $this->hauteur - 1) {
+                $mots = explode(" ", $this->get_colonne($x, $this->hauteur));
+                foreach ($mots as $rang => $mot) {
+                    if (strlen($mot) < 2) continue;
+                    if (strlen($mot > 2) && in_array($mot, array_merge(...$this->lignes, ...$this->colonnes))) continue 2;
+                    else $this->colonnes[$x][$rang] = $mot;
+                }
+            } else {
+                $this->colonnes[$x] = [];
+            }
+
+            if ($i < $this->nb_positions - 1) {
+                yield from $this->gen_grilles($i + 1, $lettres_ligne->branches[$lettre]);
             } else {
                 yield $this;
             }
         }
     }
 
+    public function genere($id)
+    {
+        mt_srand(crc32($id));
+
+        $grilles = $this->gen_grilles();
+        $grilles->current();
+
+        if ($grilles->valid()) {
+            $this->save($id);
+            return true;
+        } else {
+            return false;
+        }
+    }
+
     public function hash()
     {
         $string = "";
@@ -131,42 +157,72 @@ class Grille implements Iterator, ArrayAccess {
         return hash('sha256', $string);
     }
 
-    public function current(): mixed
+    public function save($id)
     {
-        return $this->grilles->current();
+        session_id($id);
+        session_start(["use_cookies" => false]);
+
+        $_SESSION["$this->largeur,$this->hauteur"] = implode(
+            "",
+            array_map(
+                function ($ligne) {
+                    return implode("", $ligne);
+                },
+                $this->grille
+            )
+        );
     }
 
-    public function key(): mixed {
-        return $this->grilles->key();
-    }
-
-    public function next(): void {
-        $this->grilles->next();
-    }
-
-    public function rewind(): void {
-        $this->grilles->rewind();
-    }
-
-    public function valid(): bool
+    public function load($id)
     {
-        return $this->grilles->valid();
+        session_id($id);
+        session_start(["use_cookies" => false]);
+
+        if (!isset($_SESSION["$this->largeur,$this->hauteur"])) {
+            return false;
         }
 
-    public function offsetExists(mixed $offset): bool {
+        foreach (str_split($_SESSION["$this->largeur,$this->hauteur"], $this->largeur) as $y => $ligne) {
+            foreach (str_split($ligne) as $x => $lettre) {
+                $this->grille[$y][$x] = $lettre;
+            }
+        }
+
+        for ($y = 0; $y < $this->hauteur; $y++) {
+            $mots = explode(" ", $this->get_ligne($y, $this->largeur));
+            $this->lignes[$y] = array_filter($mots, function ($mot) {
+                return strlen($mot) >= 2;
+            });
+        }
+
+        for ($x = 0; $x < $this->largeur; $x++) {
+            $mots = explode(" ", $this->get_colonne($x, $this->hauteur));
+            $this->colonnes[$x] = array_filter($mots, function ($mot) {
+                return strlen($mot) >= 2;
+            });
+        }
+
+        return true;
+    }
+
+
+    public function offsetExists(mixed $offset): bool
+    {
         return isset($this->grille[$offset]);
     }
 
-    public function offsetGet(mixed $offset): mixed {
+    public function offsetGet(mixed $offset): mixed
+    {
         return $this->grille[$offset];
     }
 
-    public function offsetSet(mixed $offset, mixed $value): void {
+    public function offsetSet(mixed $offset, mixed $value): void
+    {
         $this->grille[$offset] = $value;
     }
 
-    public function offsetUnset(mixed $offset): void {
+    public function offsetUnset(mixed $offset): void
+    {
         unset($this->grille[$offset]);
     }
-
 }

Trie.php

@@ -0,0 +1,95 @@
+<?php
+
+
+class Trie implements ArrayAccess, IteratorAggregate, Countable {
+    public array $branches = [];
+    private $nb_branches = 0;
+
+    public function arraySet($cles, $valeur) {
+        $this->nb_branches++;
+        $cle = $cles[0];
+        $cles = array_slice($cles, 1);
+        if ($cles == []) {
+            $this->branches[$cle] = $valeur;
+        } else {
+            if (!isset($this->branches[$cle])) $this->branches[$cle] = new Trie();
+            $this->branches[$cle]->arraySet($cles, $valeur);
+        }
+    }
+
+    public function arrayExists($cles) {
+        $cle = $cles[0];
+        $cles = array_slice($cles, 1);
+        if ($cles == []) {
+            return isset($this->branches[$cle]);
+        } else {
+            return isset($this->branches[$cle]) && $this->branches[$cle]->arrayExists($cles);
+        }
+    }
+
+    public function &arrayGet($cles) {
+        $cle = $cles[0];
+        $cles = array_slice($cles, 1);
+        if ($cles == []) {
+            return $this->branches[$cle];
+        } else {
+            return $this->branches[$cle]->arrayGet($cles);
+        }
+    }
+
+    public function arrayUnset($cles) {
+        $cle = $cles[0];
+        $cles = array_slice($cles, 1);
+        if ($cles == []) {
+            unset($this->branches[$cle]);
+            $this->nb_branches--;
+        } else {
+            $this->branches[$cle]->arrayUnset($cles);
+            $this->nb_branches--;
+            if (count($this->branches[$cle]) == 0) {
+                unset($this->branches[$cle]);
+            }
+        }
+    }
+
+    public function arrayIterator() {
+        foreach ($this->branches as $cle => $branche) {
+            if ($branche instanceof Trie) {
+                foreach($branche->arrayIterator() as $sous_cles => $feuille) {
+                    yield array_merge([$cle], $sous_cles) => $feuille;
+                }
+            } else {
+                yield [$cle] => $branche;
+            }
+        }
+    }
+
+    // ArrayAccess
+    public function offsetSet($string, $valeur): void {
+        $this->arraySet(str_split($string), $valeur);
+    }
+
+    public function offsetExists($string): bool {
+        return $this->arrayExists(str_split($string));
+    }
+
+    public function &offsetGet($string): mixed {
+        return $this->arrayGet(str_split($string));
+    }
+
+    public function offsetUnset($string): void {
+        $this->arrayUnset(str_split($string));
+    }
+
+    // IteratorAggregate
+    public function getIterator(): Traversable {
+        foreach($this->arrayIterator() as $array => $valeur) {
+            yield implode("", $array) => $valeur;
+        }
+    }
+
+    // Countable
+    public function count(): int {
+        return $this->nb_branches;
+    }
+}

dico.php

@@ -1,55 +1,66 @@
 <?php
+include_once "Trie.php";
 
 
-const MIN_LETTRES_MOT_1 = 2;
-const MIN_LETTRES_MOT_2 = 0;
-const MAX_MOTS = 1000000;
+const MIN_PREMIER_MOT = 1;
+const MIN_MOTS_SUIVANTS = 1;
 
-$dico = [[]];
-if (($lecteur = fopen("dico.csv", "r")) !== FALSE) {
-    $header = fgetcsv($lecteur, 0, "\t");
-    while (($ligne = fgetcsv($lecteur, 0, "\t")) !== FALSE) {
-        if ($ligne[0] == NULL || substr($ligne[0], 0, 1) == "#") continue;
-        switch(count($ligne)) {
-            case 1:
-                [$mot] = $ligne;
-                $definition = "";
-            break;
-            case 2:
-                [$mot, $definition] = $ligne;
-            break;
-            case 3:
-                [$mot, $definition, $auteur] = $ligne;
-                $definition .= " <small><em>$auteur</em></small>";
-            break;
+
+$nb_mots = 0;
+
+function dico($longueur_max) {
+    global $nb_mots;
+
+    $transliterator = Transliterator::createFromRules(':: Any-Latin; :: Latin-ASCII; :: NFD; :: [:Nonspacing Mark:] Remove; :: Upper(); :: NFC;', Transliterator::FORWARD);
+    
+    $dico = [[""]];
+    for ($longueur = 0; $longueur <= $longueur_max; $longueur++) {
+        $dico[] = new Trie();
     }
-        $mot = strtoupper($mot);
+    if (($lecteur = fopen("dico.csv", "r")) !== FALSE) {
+        $entete = fgetcsv($lecteur, 0, "\t");
+        while (($ligne = fgetcsv($lecteur, 0, "\t")) !== FALSE) {
+            if (
+                $ligne[0] == NULL
+                || substr($ligne[0], 0, 1) == "#"
+                || strlen($ligne[0]) > $longueur_max
+            ) continue;
+
+            $mot = $ligne[0];
+            $definitions = array_slice($ligne, 1);
+            $mot = str_replace("-", " ", $mot);
+            
+            $mot = $transliterator->transliterate($mot);
+            if (strpos($mot, " ") !== false) {
+                $mots = explode(" ", $mot);
+                $nb_mots = count($mots);
+                $mot = implode("", $mots);
+                foreach($definitions as $i => $definition) {
+                    $definitions[$i] .= " ($nb_mots mots)";
+                }
+            }
+
             $longueur = strlen($mot);
-        if (!isset($dico[$longueur])) $dico[$longueur] = [];
-        if (!isset($dico[$longueur][$mot])) $dico[$longueur][$mot] = [];
-        if (strlen($definition)) $dico[$longueur][$mot][] = $definition;
+            $dico[$longueur][$mot] = $definitions;
         }
         fclose($lecteur);
+    }
+    
+    return $dico;
 }
 
-function mots_espaces($longueur, $nb_mots_restants=MAX_MOTS)
-{
-    global $dico;
+function mots_espaces($longueur_max) {
+    global $nb_mots;
 
-    foreach ($dico[$longueur] as $mot => $definition) {
-        yield [$mot];
-        if (--$nb_mots_restants <= 0) return;
-    }
-    for ($i = MIN_LETTRES_MOT_1; $longueur - $i - 1 >= MIN_LETTRES_MOT_2; $i++) {
-        foreach ($dico[$i] as $mot => $definition) {
-            foreach (mots_espaces($longueur - $i - 1, $nb_mots_restants) as $mots) {
-                if (!in_array($mot, $mots)) {
-                    yield [$mot, ...$mots];
-                    if (--$nb_mots_restants <= 0) return;
-                    yield [...$mots, $mot];
-                    if (--$nb_mots_restants <= 0) return;
-                }
+    $dico = dico($longueur_max);
+    for ($longueur = 1; $longueur <= $longueur_max; $longueur++) {
+        for ($position_espace = MIN_PREMIER_MOT; $position_espace + MIN_MOTS_SUIVANTS < $longueur; $position_espace++) {
+            $mots_suivants = $dico[$longueur - $position_espace - 1];
+            foreach ($dico[$position_espace]->arrayIterator() as $premier_mot => $definition) {
+                $premier_mot[] = " ";
+                $dico[$longueur]->arraySet($premier_mot, $mots_suivants);
             }
         }
     }
+    return $dico;
 }

index.php

@@ -1,19 +1,11 @@
 <?php
-
-if (!isset($_GET["grille"])) {
-    $_GET["grille"] = uniqid();
-    header("Location: " . dirname($_SERVER['DOCUMENT_URI']) . "?" . http_build_query($_GET));
-    exit;
-}
-
-
-include_once "dico.php";
 include_once "Grille.php";
 
-const HAUTEUR_DEFAUT = 7;
+
+const HAUTEUR_DEFAUT = 8;
 const HAUTEUR_MIN = 2;
 const HAUTEUR_MAX = 10;
-const LARGEUR_DEFAUT = 7;
+const LARGEUR_DEFAUT = 8;
 const LARGEUR_MIN = 2;
 const LARGEUR_MAX = 10;
 
@@ -25,6 +17,7 @@ $hauteur = filter_input(INPUT_GET, 'lignes', FILTER_VALIDATE_INT, [
         "max_range" => HAUTEUR_MAX
     ]
 ]);
+
 $largeur = filter_input(INPUT_GET, 'colonnes', FILTER_VALIDATE_INT, [
     "options" => [
         "default" => LARGEUR_DEFAUT,
@@ -32,37 +25,45 @@ $largeur = filter_input(INPUT_GET, 'colonnes', FILTER_VALIDATE_INT, [
         "max_range" => LARGEUR_MAX
     ]
 ]);
-$id = htmlspecialchars($_GET["grille"]);
 
-$grille = new Grille($hauteur, $largeur, $id);
-$grille->current();
+$grille = new Grille($hauteur, $largeur);
 
-function melanger_valeurs(&$tableau)
-{
-    usort($tableau, function ($a, $b) {
-        return mt_rand(-1, 1);
-    });
+if (!isset($_GET["grille"]) || $_GET["grille"] == "") {
+    do {
+        $id = uniqid();
+    } while (!$grille->genere($id));
+
+    $_GET["grille"] = $id;
+    header("Location: " . dirname($_SERVER['DOCUMENT_URI']) . "?" . http_build_query($_GET));
+    exit;
 }
 
-$definitions_horizontales = [];
-foreach ($grille->lignes as $y => $mots) {
+$id = htmlspecialchars($_GET["grille"]);
+
+$grille_valide = $grille->load($id) || $grille->genere($id);
+
+mt_srand(crc32($id));
+if ($grille_valide) {
+    $definitions_horizontales = [];
+    for ($y = 0; $y < $hauteur; $y++) {
         $definitions_horizontales[$y] = [];
-    foreach ($mots as $mot) {
-        $definitions = $dico[strlen($mot)][$mot];
+        foreach ($grille->lignes[$y] as $mot) {
+            $definitions = $grille->dico[strlen($mot)][$mot];
             if (count($definitions)) {
                 $definitions_horizontales[$y][] = $definitions[mt_rand(0, count($definitions) - 1)];
             }
         }
-}
-$definitions_verticales = [];
-foreach ($grille->colonnes as $x => $mots) {
+    }
+    $definitions_verticales = [];
+    for ($x = 0 ; $x < $largeur; $x++) {
         $definitions_verticales[$x] = [];
-    foreach ($mots as $mot) {
-        $definitions = $dico[strlen($mot)][$mot];
+        foreach ($grille->colonnes[$x] as $mot) {
+            $definitions = $grille->dico[strlen($mot)][$mot];
             if (count($definitions)) {
                 $definitions_verticales[$x][] = $definitions[mt_rand(0, count($definitions) - 1)];
             }
         }
+    }
 }
 ?>
 <!DOCTYPE HTML>
@@ -70,7 +71,7 @@ foreach ($grille->colonnes as $x => $mots) {
 
 <head>
     <meta charset="utf-8">
-    <title>Mots croisés</title>
+    <title>MOTS■CROISES</title>
     <link rel="stylesheet" href="style.css">
     <link rel="icon" href="favicon.svg">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
@@ -105,9 +106,9 @@ foreach ($grille->colonnes as $x => $mots) {
                 </tbody>
             </table>
         </h1>
-        <h1 class="small width">Mots croisés</h1>
+        <h1 class="small width">Mots■croisés</h1>
         <div class="grille-et-definitions">
-            <?php if ($grille->valid()): ?>
+            <?php if ($grille_valide): ?>
                 <div class="grille">
                     <table>
                         <tr>
@@ -128,7 +129,7 @@ foreach ($grille->colonnes as $x => $mots) {
                                     <?php else: ?>
                                         <td class="case blanche">
                                             <input id="<?= chr($x + 65) . ($y + 1) ?>" type="text" maxlength="1" size="1" pattern="[A-Z]" placeholder="<?= $grille[$y][$x] ?>"
-                                                title="<?= "→ " . strip_tags(implode("\n→ ", $definitions_horizontales[$y])) . "\n↓ " . strip_tags(implode("\n↓ ", $definitions_verticales[$x])) ?>" />
+                                                title="<?= strip_tags("→ " . implode("\n→ ", $definitions_horizontales[$y]) . "\n↓ " . implode("\n↓ ", $definitions_verticales[$x])) ?>" />
                                         </td>
                                     <?php endif; ?>
                                 <?php endfor; ?>
@@ -138,9 +139,10 @@ foreach ($grille->colonnes as $x => $mots) {
                 </div>
                 <div class="definitions horizontales">
                     <h2>Horizontalement</h2>
-                    <ol>
+                    <ol type="1">
                         <?php foreach ($definitions_horizontales as $y => $definitions): ?>
                             <li>
+                                <?php if (count($definitions)): ?>
                                     <?php if (count($definitions) == 1): ?>
                                         <?= $definitions[0] ?>
                                     <?php else: ?>
@@ -150,6 +152,7 @@ foreach ($grille->colonnes as $x => $mots) {
                                             <?php endforeach ?>
                                         </ol>
                                     <?php endif ?>
+                                <?php endif ?>
                             </li>
                         <?php endforeach; ?>
                     </ol>
@@ -159,6 +162,7 @@ foreach ($grille->colonnes as $x => $mots) {
                     <ol type="A">
                         <?php foreach ($definitions_verticales as $x => $definitions): ?>
                             <li>
+                                <?php if (count($definitions)): ?>
                                     <?php if (count($definitions) == 1): ?>
                                         <?= $definitions[0] ?>
                                     <?php else: ?>
@@ -168,6 +172,7 @@ foreach ($grille->colonnes as $x => $mots) {
                                             <?php endforeach ?>
                                         </ol>
                                     <?php endif ?>
+                                <?php endif ?>
                             </li>
                         <?php endforeach; ?>
                     </ol>
@@ -189,6 +194,7 @@ foreach ($grille->colonnes as $x => $mots) {
     </form>
 
     <script src="script.js"></script>
+    <script>navigator?.serviceWorker.register('service-worker.js')</script>
 </body>
 
 </html>

service-worker.js

@@ -0,0 +1,86 @@
+/*
+Copyright 2015, 2019, 2020 Google LLC. All Rights Reserved.
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+ http://www.apache.org/licenses/LICENSE-2.0
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+*/
+
+// Incrementing OFFLINE_VERSION will kick off the install event and force
+// previously cached resources to be updated from the network.
+const OFFLINE_VERSION = 1;
+const CACHE_NAME = "offline";
+// Customize this with a different URL if needed.
+const OFFLINE_URL = "index.php";
+
+self.addEventListener("install", (event) => {
+  event.waitUntil(
+    (async () => {
+      const cache = await caches.open(CACHE_NAME);
+      // Setting {cache: 'reload'} in the new request will ensure that the
+      // response isn't fulfilled from the HTTP cache; i.e., it will be from
+      // the network.
+      await cache.add(new Request(OFFLINE_URL, { cache: "reload" }));
+    })()
+  );
+  // Force the waiting service worker to become the active service worker.
+  self.skipWaiting();
+});
+
+self.addEventListener("activate", (event) => {
+  event.waitUntil(
+    (async () => {
+      // Enable navigation preload if it's supported.
+      // See https://developers.google.com/web/updates/2017/02/navigation-preload
+      if ("navigationPreload" in self.registration) {
+        await self.registration.navigationPreload.enable();
+      }
+    })()
+  );
+
+  // Tell the active service worker to take control of the page immediately.
+  self.clients.claim();
+});
+
+self.addEventListener("fetch", (event) => {
+  // We only want to call event.respondWith() if this is a navigation request
+  // for an HTML page.
+  if (event.request.mode === "navigate") {
+    event.respondWith(
+      (async () => {
+        try {
+          // First, try to use the navigation preload response if it's supported.
+          const preloadResponse = await event.preloadResponse;
+          if (preloadResponse) {
+            return preloadResponse;
+          }
+
+          // Always try the network first.
+          const networkResponse = await fetch(event.request);
+          return networkResponse;
+        } catch (error) {
+          // catch is only triggered if an exception is thrown, which is likely
+          // due to a network error.
+          // If fetch() returns a valid HTTP response with a response code in
+          // the 4xx or 5xx range, the catch() will NOT be called.
+          console.log("Fetch failed; returning offline page instead.", error);
+
+          const cache = await caches.open(CACHE_NAME);
+          const cachedResponse = await cache.match(OFFLINE_URL);
+          return cachedResponse;
+        }
+      })()
+    );
+  }
+
+  // If our if() condition is false, then this fetch handler won't intercept the
+  // request. If there are any other fetch handlers registered, they will get a
+  // chance to call event.respondWith(). If no fetch handlers call
+  // event.respondWith(), the request will be handled by the browser as if there
+  // were no service worker involvement.
+});

style.css

@@ -95,10 +95,6 @@ h2 {
   background-color: black;
 }
 
-.grille .case.noire {
-  background-color: black;
-}
-
 .grille input {
   width: 100%;
   height: 100%;
@@ -292,7 +288,10 @@ h2 {
   }
   
   .definitions li.non-selectionee {
-    display: none;
+    visibility: hidden;
+    height: 0;
+    margin: 0;
+    padding: 0;
   }
 }