Hugging Face's logo

Spaces:
42Cummer
/
EntropyWordleSolver
Paused

App Files Community
42Cummer commited on
Commit
54e73c3
·
verified ·
1 Parent(s): 9992bcf

Upload 2 files

Browse files
Files changed (2) hide show
  1. favicon.ico +0 -0
  2. index.html +477 -0
favicon.ico ADDED
index.html ADDED
@@ -0,0 +1,477 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Wordle Solver</title>
7
+ <link rel="icon" type="image/x-icon" href="{{ url_for('static', filename='favicon.ico') }}">
8
+ <style>
9
+ body {
10
+ font-family: 'Helvetica Neue', Arial, sans-serif;
11
+ margin: 0;
12
+ padding: 0;
13
+ background-color: #1a1a1a;
14
+ color: #ffffff;
15
+ min-height: 100vh;
16
+ }
17
+ .container {
18
+ padding: 2rem;
19
+ max-width: 1200px;
20
+ margin: 0 auto;
21
+ }
22
+ h1 {
23
+ color: #ffffff;
24
+ margin: 0 0 1rem 0;
25
+ font-size: 2.5rem;
26
+ font-weight: 700;
27
+ text-align: center;
28
+ font-family: 'Helvetica Neue', Arial, sans-serif;
29
+ letter-spacing: 0.05em;
30
+ }
31
+ .disclaimer {
32
+ color: #999999;
33
+ font-size: 0.9rem;
34
+ text-align: center;
35
+ margin-bottom: 1rem;
36
+ font-style: italic;
37
+ }
38
+ .feedback-instruction {
39
+ color: #ffffff;
40
+ font-size: 1.1rem;
41
+ text-align: center;
42
+ margin-bottom: 0.5rem;
43
+ }
44
+ #current-word {
45
+ color: #ffffff;
46
+ font-size: 1.5rem;
47
+ text-align: center;
48
+ margin: 0 0 1rem 0;
49
+ font-weight: bold;
50
+ }
51
+ .warning-note {
52
+ color: #ffa500;
53
+ font-size: 0.9rem;
54
+ text-align: center;
55
+ margin: 0 0 2rem 0;
56
+ padding: 8px 16px;
57
+ background-color: rgba(255, 165, 0, 0.1);
58
+ border: 1px solid rgba(255, 165, 0, 0.3);
59
+ border-radius: 6px;
60
+ max-width: 500px;
61
+ margin-left: auto;
62
+ margin-right: auto;
63
+ margin-bottom: 2rem;
64
+ }
65
+ .game-container {
66
+ display: flex;
67
+ align-items: center;
68
+ justify-content: center;
69
+ gap: 20px;
70
+ margin: 0 auto;
71
+ max-width: 450px;
72
+ }
73
+ .row-indicator {
74
+ width: 30px;
75
+ text-align: center;
76
+ display: flex;
77
+ flex-direction: column;
78
+ justify-content: space-around;
79
+ height: 100%;
80
+ }
81
+ .arrow {
82
+ font-size: 1.5rem;
83
+ color: #ffffff;
84
+ opacity: 0;
85
+ transition: opacity 0.3s;
86
+ height: 62px;
87
+ display: flex;
88
+ align-items: center;
89
+ justify-content: center;
90
+ margin-bottom: 5px;
91
+ }
92
+ .arrow.active {
93
+ opacity: 1;
94
+ }
95
+ .game-grid {
96
+ display: grid;
97
+ grid-template-rows: repeat(6, 1fr);
98
+ gap: 5px;
99
+ max-width: 350px;
100
+ padding: 20px;
101
+ }
102
+ .grid-row {
103
+ display: grid;
104
+ grid-template-columns: repeat(5, 1fr);
105
+ gap: 5px;
106
+ }
107
+ .grid-cell {
108
+ width: 62px;
109
+ height: 62px;
110
+ border: 2px solid #3a3a3c;
111
+ background-color: transparent;
112
+ display: flex;
113
+ justify-content: center;
114
+ align-items: center;
115
+ font-size: 2rem;
116
+ font-weight: bold;
117
+ color: #ffffff;
118
+ text-transform: uppercase;
119
+ }
120
+ .grid-cell.filled {
121
+ border-color: #565758;
122
+ }
123
+ .grid-cell.selected {
124
+ border-color: #ffffff;
125
+ border-width: 3px;
126
+ }
127
+ .grid-cell.correct {
128
+ background-color: #6aaa64;
129
+ border-color: #3a3a3c;
130
+ }
131
+ .grid-cell.present {
132
+ background-color: #c9b458;
133
+ border-color: #3a3a3c;
134
+ }
135
+ .grid-cell.absent {
136
+ background-color: #787c7e;
137
+ border-color: #3a3a3c;
138
+ }
139
+ .feedback-buttons {
140
+ display: flex;
141
+ justify-content: center;
142
+ gap: 15px;
143
+ margin: 30px auto 0;
144
+ max-width: 600px;
145
+ }
146
+ .feedback-btn {
147
+ padding: 12px 20px;
148
+ border: none;
149
+ border-radius: 6px;
150
+ font-family: 'Helvetica Neue', Arial, sans-serif;
151
+ font-weight: bold;
152
+ font-size: 14px;
153
+ color: #ffffff;
154
+ cursor: pointer;
155
+ transition: opacity 0.2s;
156
+ }
157
+ .feedback-btn:hover {
158
+ opacity: 0.8;
159
+ }
160
+ .feedback-btn.green {
161
+ background-color: #6aaa64;
162
+ }
163
+ .feedback-btn.yellow {
164
+ background-color: #c9b458;
165
+ }
166
+ .feedback-btn.gray {
167
+ background-color: #787c7e;
168
+ }
169
+ .control-buttons {
170
+ display: flex;
171
+ justify-content: center;
172
+ gap: 15px;
173
+ margin: 20px auto 0;
174
+ }
175
+ .control-btn {
176
+ padding: 10px 18px;
177
+ border: none;
178
+ border-radius: 6px;
179
+ font-family: 'Helvetica Neue', Arial, sans-serif;
180
+ font-weight: bold;
181
+ font-size: 13px;
182
+ color: #ffffff;
183
+ background-color: #565758;
184
+ cursor: pointer;
185
+ transition: opacity 0.2s;
186
+ }
187
+ .control-btn:hover {
188
+ opacity: 0.8;
189
+ }
190
+ </style>
191
+ </head>
192
+ <body>
193
+ <div class="container">
194
+ <h1>Wordle Solver</h1>
195
+ <p class="disclaimer">This solver is unofficial and not affiliated with the New York Times or Wordle.</p>
196
+ <h2 class="feedback-instruction">Enter feedback for</h2>
197
+ <h2 id="current-word">ARISE</h2>
198
+ <div class="warning-note" id="warning-note">
199
+ ⚠️ Make sure your feedback is accurate - incorrect feedback may lead to wrong suggestions!
200
+ </div>
201
+
202
+ <div class="game-container">
203
+ <div class="row-indicator">
204
+ <div class="arrow active" id="arrow-0">➤</div>
205
+ <div class="arrow" id="arrow-1">➤</div>
206
+ <div class="arrow" id="arrow-2">➤</div>
207
+ <div class="arrow" id="arrow-3">➤</div>
208
+ <div class="arrow" id="arrow-4">➤</div>
209
+ <div class="arrow" id="arrow-5">➤</div>
210
+ </div>
211
+ <div class="game-grid">
212
+ <div class="grid-row">
213
+ <div class="grid-cell"></div>
214
+ <div class="grid-cell"></div>
215
+ <div class="grid-cell"></div>
216
+ <div class="grid-cell"></div>
217
+ <div class="grid-cell"></div>
218
+ </div>
219
+ <div class="grid-row">
220
+ <div class="grid-cell"></div>
221
+ <div class="grid-cell"></div>
222
+ <div class="grid-cell"></div>
223
+ <div class="grid-cell"></div>
224
+ <div class="grid-cell"></div>
225
+ </div>
226
+ <div class="grid-row">
227
+ <div class="grid-cell"></div>
228
+ <div class="grid-cell"></div>
229
+ <div class="grid-cell"></div>
230
+ <div class="grid-cell"></div>
231
+ <div class="grid-cell"></div>
232
+ </div>
233
+ <div class="grid-row">
234
+ <div class="grid-cell"></div>
235
+ <div class="grid-cell"></div>
236
+ <div class="grid-cell"></div>
237
+ <div class="grid-cell"></div>
238
+ <div class="grid-cell"></div>
239
+ </div>
240
+ <div class="grid-row">
241
+ <div class="grid-cell"></div>
242
+ <div class="grid-cell"></div>
243
+ <div class="grid-cell"></div>
244
+ <div class="grid-cell"></div>
245
+ <div class="grid-cell"></div>
246
+ </div>
247
+ <div class="grid-row">
248
+ <div class="grid-cell"></div>
249
+ <div class="grid-cell"></div>
250
+ <div class="grid-cell"></div>
251
+ <div class="grid-cell"></div>
252
+ <div class="grid-cell"></div>
253
+ </div>
254
+ </div>
255
+ </div>
256
+
257
+ <div class="feedback-buttons">
258
+ <button class="feedback-btn green">Green (Correct)</button>
259
+ <button class="feedback-btn yellow">Yellow (Wrong Position)</button>
260
+ <button class="feedback-btn gray">Gray (Not in Word)</button>
261
+ </div>
262
+
263
+ <div class="control-buttons">
264
+ <button class="control-btn" id="clear-cell-btn">Clear Cell</button>
265
+ <button class="control-btn" id="next-row-btn">Next Row</button>
266
+ <button class="control-btn" id="reset-game-btn">Reset Game</button>
267
+ </div>
268
+ </div>
269
+
270
+ <script>
271
+ let currentRow = 0;
272
+ let currentCol = 0;
273
+ const maxCols = 5;
274
+ const maxRows = 6;
275
+
276
+ // Get all grid cells
277
+ const gridCells = document.querySelectorAll('.grid-cell');
278
+
279
+ function getCellIndex(row, col) {
280
+ return row * maxCols + col;
281
+ }
282
+
283
+ function addLetter(letter) {
284
+ if (currentCol < maxCols) {
285
+ const cellIndex = getCellIndex(currentRow, currentCol);
286
+ gridCells[cellIndex].textContent = letter;
287
+ gridCells[cellIndex].classList.add('filled');
288
+ currentCol++;
289
+ }
290
+ }
291
+
292
+ function deleteLetter() {
293
+ if (currentCol > 0) {
294
+ currentCol--;
295
+ const cellIndex = getCellIndex(currentRow, currentCol);
296
+ const cell = gridCells[cellIndex];
297
+
298
+ // Remove color classes instead of text content
299
+ cell.classList.remove('correct', 'present', 'absent', 'filled');
300
+ }
301
+ }
302
+
303
+ function updateRowIndicator() {
304
+ // Hide all arrows
305
+ for (let i = 0; i < maxRows; i++) {
306
+ document.getElementById(`arrow-${i}`).classList.remove('active');
307
+ }
308
+ // Show current row arrow
309
+ if (currentRow < maxRows) {
310
+ document.getElementById(`arrow-${currentRow}`).classList.add('active');
311
+ }
312
+ }
313
+
314
+ function getRowFeedback(row) {
315
+ // Convert row colors to byg string (black/yellow/green)
316
+ let feedback = "";
317
+ for (let col = 0; col < maxCols; col++) {
318
+ const cellIndex = getCellIndex(row, col);
319
+ const cell = gridCells[cellIndex];
320
+
321
+ if (cell.classList.contains('absent')) {
322
+ feedback += 'b'; // black/gray
323
+ } else if (cell.classList.contains('present')) {
324
+ feedback += 'y'; // yellow
325
+ } else if (cell.classList.contains('correct')) {
326
+ feedback += 'g'; // green
327
+ } else {
328
+ feedback += '?'; // no color set
329
+ }
330
+ }
331
+ return feedback;
332
+ }
333
+
334
+
335
+
336
+ function submitWord() {
337
+ if (currentCol < maxCols) {
338
+ alert("You need to have 5 colored cells!");
339
+ return;
340
+ }
341
+
342
+ if (currentCol === maxCols) {
343
+ // Get current row feedback before moving
344
+ const feedback = getRowFeedback(currentRow);
345
+ const currentWord = document.getElementById('current-word').textContent;
346
+ console.log(`Round ${currentRow + 1}: Guessed "${currentWord}" with feedback "${feedback}"`);
347
+
348
+ // Check if word is solved (all green)
349
+ if (feedback === 'ggggg') {
350
+ alert("🎉 Congratulations! Word found! 🎉");
351
+ document.getElementById('current-word').textContent = "SOLVED!";
352
+ console.log(`🎉 SOLVED in ${currentRow + 1} rounds! Final word: "${currentWord}"`);
353
+ // Disable further interaction
354
+ return;
355
+ }
356
+
357
+ // Send feedback to solver and get next word
358
+ document.getElementById('current-word').textContent = "Loading... this may take a while";
359
+
360
+ fetch('/get_next_word', {
361
+ method: 'POST',
362
+ headers: {
363
+ 'Content-Type': 'application/json',
364
+ },
365
+ body: JSON.stringify({ feedback: feedback })
366
+ })
367
+ .then(response => response.json())
368
+ .then(data => {
369
+ if (data.word === 'ERROR') {
370
+ alert("❌ No valid words remaining! There might be an error in your feedback.");
371
+ return;
372
+ }
373
+ // Update the current word display
374
+ document.getElementById('current-word').textContent = data.word;
375
+ console.log(`Round ${currentRow + 2}: Next word suggested: "${data.word}" (${data.candidates_remaining} candidates remaining)`);
376
+ })
377
+ .catch(error => {
378
+ console.error('Error:', error);
379
+ alert("Error communicating with solver!");
380
+ });
381
+
382
+ // Move to next row
383
+ currentRow++;
384
+ currentCol = 0;
385
+
386
+ if (currentRow >= maxRows) {
387
+ currentRow = maxRows - 1; // Stay on last row
388
+ }
389
+
390
+ // Update arrow indicator
391
+ updateRowIndicator();
392
+ }
393
+ }
394
+
395
+ // Handle physical keyboard input (Enter and Backspace only)
396
+ document.addEventListener('keydown', function(event) {
397
+ const key = event.key.toUpperCase();
398
+
399
+ if (key === 'BACKSPACE') {
400
+ deleteLetter();
401
+ } else if (key === 'ENTER') {
402
+ submitWord();
403
+ }
404
+ });
405
+
406
+ // Handle feedback button clicks - color cells in sequence
407
+ document.querySelectorAll('.feedback-btn').forEach(btn => {
408
+ btn.addEventListener('click', function() {
409
+ const cellIndex = getCellIndex(currentRow, currentCol);
410
+
411
+ if (currentCol < maxCols) {
412
+ const cell = gridCells[cellIndex];
413
+
414
+ // Remove existing color classes
415
+ cell.classList.remove('correct', 'present', 'absent');
416
+
417
+ // Add new color class based on button
418
+ if (this.classList.contains('green')) {
419
+ cell.classList.add('correct');
420
+ } else if (this.classList.contains('yellow')) {
421
+ cell.classList.add('present');
422
+ } else if (this.classList.contains('gray')) {
423
+ cell.classList.add('absent');
424
+ }
425
+
426
+ // Move to next cell
427
+ currentCol++;
428
+ }
429
+ });
430
+ });
431
+
432
+ // Handle control button clicks
433
+ document.getElementById('clear-cell-btn').addEventListener('click', function() {
434
+ deleteLetter();
435
+ });
436
+
437
+ document.getElementById('next-row-btn').addEventListener('click', function() {
438
+ submitWord();
439
+ });
440
+
441
+ document.getElementById('reset-game-btn').addEventListener('click', function() {
442
+ // Reset frontend state
443
+ currentRow = 0;
444
+ currentCol = 0;
445
+
446
+ // Clear all grid cells
447
+ gridCells.forEach(cell => {
448
+ cell.classList.remove('correct', 'present', 'absent', 'filled', 'selected');
449
+ });
450
+
451
+ // Reset arrow indicator
452
+ updateRowIndicator();
453
+
454
+ // Clear any solved state immediately
455
+ document.getElementById('current-word').textContent = "Loading...";
456
+
457
+ // Reset backend state
458
+ fetch('/reset_game', {
459
+ method: 'POST',
460
+ headers: {
461
+ 'Content-Type': 'application/json',
462
+ }
463
+ })
464
+ .then(response => response.json())
465
+ .then(data => {
466
+ document.getElementById('current-word').textContent = data.word;
467
+ console.log('Game reset. Starting word:', data.word);
468
+ })
469
+ .catch(error => {
470
+ console.error('Error:', error);
471
+ // If there's an error, still show the default starting word
472
+ document.getElementById('current-word').textContent = "ARISE";
473
+ });
474
+ });
475
+ </script>
476
+ </body>
477
+ </html>