terribledev/quartiles
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(ui): add reveal solutions option to Settings modal in addition to Words Found drawer

Browse Source
This commit is contained in:
Tommy Parnell
2026-10-23 23:15:35 -04:00
parent ac7e457e5a
commit cd831940ea
2 changed files with 18 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
src/components/Modals.js
View File

@@ -1,7 +1,7 @@
import { CURATED_PUZZLES } from '../data/puzzles.js'; import { CURATED_PUZZLES } from '../data/puzzles.js';
import { sound } from '../engine/audio.js'; import { sound } from '../engine/audio.js';
export function createModals({ onSelectPuzzle, onCustomPuzzleCreated, onResetPuzzle }) { export function createModals({ onSelectPuzzle, onCustomPuzzleCreated, onResetPuzzle, onRevealAll }) {
const container = document.createElement('div'); const container = document.createElement('div');
container.id = 'app-modals-container'; container.id = 'app-modals-container';
@@ -270,7 +270,10 @@ export function createModals({ onSelectPuzzle, onCustomPuzzleCreated, onResetPuz
</button> </button>
</div> </div>
<div style="padding-top:10px;"> <div style="padding-top:10px; display:flex; flex-direction:column; gap:10px;">
<button id="setting-reveal-all" style="width:100%; height:42px; border-radius:var(--radius-md); background:rgba(217, 119, 6, 0.12); color:var(--accent-quartile); font-weight:700; border:1px solid var(--accent-quartile); display:flex; align-items:center; justify-content:center; gap:6px;">
💡 Reveal All Word Solutions
</button>
<button id="setting-reset-puzzle" style="width:100%; height:40px; border-radius:var(--radius-md); background:rgba(239, 68, 68, 0.1); color:var(--accent-danger); font-weight:700;"> <button id="setting-reset-puzzle" style="width:100%; height:40px; border-radius:var(--radius-md); background:rgba(239, 68, 68, 0.1); color:var(--accent-danger); font-weight:700;">
Reset Current Puzzle Progress Reset Current Puzzle Progress
</button> </button>
@@ -363,6 +366,14 @@ export function createModals({ onSelectPuzzle, onCustomPuzzleCreated, onResetPuz
render(state); render(state);
}); });
const revealBtn = container.querySelector('#setting-reveal-all');
if (revealBtn) {
revealBtn.addEventListener('click', () => {
close();
onRevealAll?.();
});
}
const resetBtn = container.querySelector('#setting-reset-puzzle'); const resetBtn = container.querySelector('#setting-reset-puzzle');
if (resetBtn) { if (resetBtn) {
let isConfirming = false; let isConfirming = false;

5
src/main.js
View File

@@ -68,6 +68,11 @@ async function initApp() {
gameState.loadPuzzle(gameState.currentPuzzle); gameState.loadPuzzle(gameState.currentPuzzle);
gameState.notifyToast('Progress reset', 'info'); gameState.notifyToast('Progress reset', 'info');
} }
},
onRevealAll: () => {
gameState.revealAllWords();
gameState.notifyToast('All words revealed!', 'info');
wordsDrawer.open();
} }
}); });
document.body.appendChild(modals.element); document.body.appendChild(modals.element);