Have got win and failures working

This commit is contained in:
Leon Mika 2025-01-25 11:30:04 +11:00
parent d9fa154a01
commit a8e42da6fd
10 changed files with 255 additions and 28 deletions

View file

@ -3,6 +3,7 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://cdn.simplecss.org/simple.min.css">
<link href="/assets/styles/main.css" rel="stylesheet">
<title>Wordle Clone</title>
</head>
@ -12,11 +13,15 @@
</header>
<main>
<div data-controller="playfield" class="playfield">
<div class="playfield" data-controller="playfield"
data-playfield-overlay-outlet=".overlay">
<div data-playfield-target="topMessage">&nbsp;</div>
<div data-playfield-target="playfield"></div>
<button data-playfield-target="nextPuzzleButton" class="hide" data-action="playfield#loadNextPuzzle">Next Puzzle</button>
</div>
<div data-controller="keyboard"
<div class="keyboard" data-controller="keyboard"
data-keyboard-playfield-outlet=".playfield"
data-action="
keydown@window->keyboard#onKeyPress
@ -47,6 +52,7 @@
<button data-keyboard-target="key" data-action="keyboard#tappedKey" data-key="l">l</button>
</div>
<div>
<button data-keyboard-target="key" data-action="keyboard#tapBackspace">&larr;</button>
<button data-keyboard-target="key" data-action="keyboard#tappedKey" data-key="z">z</button>
<button data-keyboard-target="key" data-action="keyboard#tappedKey" data-key="x">x</button>
<button data-keyboard-target="key" data-action="keyboard#tappedKey" data-key="c">c</button>
@ -54,11 +60,10 @@
<button data-keyboard-target="key" data-action="keyboard#tappedKey" data-key="b">b</button>
<button data-keyboard-target="key" data-action="keyboard#tappedKey" data-key="n">n</button>
<button data-keyboard-target="key" data-action="keyboard#tappedKey" data-key="m">m</button>
<button data-keyboard-target="key" data-action="keyboard#tapEnter">enter</button>
<button data-keyboard-target="key" data-action="keyboard#tapBackspace">back</button>
<button data-keyboard-target="key" data-action="keyboard#tapEnter">&crarr;</button>
</div>
</div>
<template id="row-template">
<div class="row" data-playfield-target="row">
<span></span>
@ -70,6 +75,10 @@
</template>
</main>
<div class="overlay" data-controller="overlay">
<div class="overlay-message" data-overlay-target="message">I am the overlay</div>
</div>
<script src="/assets/scripts/main.js" type="module"></script>
</body>
</html>