diff --git a/game.php b/game.php index 85ea07d..0237c30 100644 --- a/game.php +++ b/game.php @@ -4,13 +4,13 @@ if (preg_match("#^[1-9?]{81}$#", $gridStr)) { ?> - + Sudoku - +
@@ -19,10 +19,11 @@
+ - + "; + echo " \n"; } ?> - + +
-
+
$value"; + echo " \n"; } ?> +
diff --git a/index.php b/index.php index 19467cd..479ca20 100644 --- a/index.php +++ b/index.php @@ -98,9 +98,7 @@ forEach($testBox->neighbourhood as $neighbour) $neighbour->searchAllowedValues(); } - $solutions = array(); - forEach($this->findSolutions(false, 2, 4) as $solution) $solutions[$solution] = true; - if (count($solutions) == 1) { + if (count(iterator_to_array($this->findSolutions(false, 2, 4), true)) == 1) { $nbClues -= count($testBoxes); forEach($testBoxes as $testBox) array_unset_value($testBox, $untestedBoxes); } else { diff --git a/style.css b/style.css index 00ef0a6..e4d8200 100644 --- a/style.css +++ b/style.css @@ -1,5 +1,5 @@ -* { - font-family: sans; +body { + font-family: sans-serif; } h1 { @@ -9,61 +9,67 @@ h1 { div { display: flex; column-gap: 0.5em; - row-gap: 0.5em; margin: 1em auto; justify-content: center; text-align: center; } -#grid { +table { border-spacing: 0; - border-radius: 6px; } -td { +td, tr { padding: 0; } -#grid tr:first-child td:first-child -{ +table tr:first-child td:first-child { border-top-left-radius: 6px; } -#grid tr:first-child td -{ +table tr:first-child td:first-child > input { + border-top-left-radius: 4px; +} + +table tr:first-child td { border-top: 2px solid black; } -#grid tr:first-child td:last-child -{ +table tr:first-child td:last-child { border-top-right-radius: 6px; } -#grid tr td:first-child -{ +table tr:first-child td:last-child > input { + border-top-right-radius: 4px; +} + +table tr td:first-child { border-left: 2px solid black; } -#grid tr td:last-child -{ +table tr td:last-child { border-right: 2px solid black; } -#grid tr:last-child td:first-child -{ +table tr:last-child td:first-child { border-bottom-left-radius: 6px; } -#grid tr:last-child td -{ +table tr:last-child td:first-child > input { + border-bottom-left-radius: 4px; +} + +table tr:last-child td { border-bottom: 2px solid black; } -#grid tr:last-child td:last-child -{ +table tr:last-child td:last-child { border-bottom-right-radius: 6px; } +table tr:last-child td:last-child > input { + border-bottom-right-radius: 4px; +} + .regionTop { border-top: 1px solid black; } @@ -100,36 +106,39 @@ input { transition: 0.3s; } -input:read-write { +input:enabled { color: darkblue; background: white; } -input:read-only { - color: black; +input:disabled { + color: white; background: #6666ff; - font-weight: bold; } -input.same-value:read-write { +.same-value:enabled { color: #009973; background: #66ffd9; } -input.forbidden-value:read-write { - background: #ccffe6; +.forbidden-value:enabled { + background: #b3ffda; } -input.same-value:read-only { - color: #00664d; +.same-value:disabled { + color: white; background: #00e6ac; } +.forbidden-value:disabled { + background: #6288ea; +} + input::placeholder { color: #888; } -#buttons { +.buttons { column-gap: 0.2em; margin: 0; } diff --git a/sudoku.js b/sudoku.js index dfe1d05..55d183e 100644 --- a/sudoku.js +++ b/sudoku.js @@ -13,7 +13,7 @@ window.onload = function() { let columnId = 0 for (box of row.getElementsByTagName('input')) { let regionId = rowId - rowId%3 + Math.floor(columnId/3) - if (!box.readOnly) box.select + if (!box.readOnly) box.onfocus = box.select box.oninput = oninput box.oninvalid = oninvalid box.onkeydown = keyboardBrowse @@ -63,12 +63,14 @@ function showAllowedValuesOn(box) { } function oninput() { + this.style.color = colorPicker.value + this.neighbourhood.concat([this]).forEach(box => { box.setCustomValidity("") searchAllowedValuesOf(box) box.pattern = `[${Array.from(box.allowedValues).join("")}]?` }) - + enableButtons() refreshShowValue() this.neighbourhood.concat([this]).forEach(neighbour => showAllowedValuesOn(neighbour)) @@ -148,11 +150,11 @@ function moveOn(area, position, direction) { area[position].focus() } -function showValue(button) { - if (button.textContent == highlightedValue) { +function showValue(value) { + if (value == highlightedValue) { highlightedValue = "" } else { - highlightedValue = button.textContent + highlightedValue = value } refreshShowValue() }