joshpatra/maisie-heardle
1
0
Fork 0
mirror of https://github.com/SoPat712/maisie-heardle.git synced 2025-08-21 18:28:45 -04:00
Code Issues Packages Projects Releases Wiki Activity

Add winning message, fix dropdown not disappearing

Browse Source
This commit is contained in:
Josh Patra
2025-04-20 01:14:54 -04:00
parent 6ec5e584ab
commit 9ad4dfded1
1 changed files with 9 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/lib/HeardleGame.svelte
View File

@@ -309,7 +309,8 @@
if (selectedTrack.title.toLowerCase() === ans) { if (selectedTrack.title.toLowerCase() === ans) {
attemptInfos = [...attemptInfos, { status: 'correct', title: currentTrack.title }]; attemptInfos = [...attemptInfos, { status: 'correct', title: currentTrack.title }];
gameOver = true; gameOver = true;
message = `✅ Correct! It was “${currentTrack.title}.”`; // include try count in winning message
message = `✅ Correct! It was “${currentTrack.title}.” You got it in ${attemptCount} ${attemptCount === 1 ? 'try' : 'tries'}.`;
widget.pause(); widget.pause();
} else { } else {
attemptInfos = [...attemptInfos, { status: 'wrong', title: selectedTrack.title }]; attemptInfos = [...attemptInfos, { status: 'wrong', title: selectedTrack.title }];
@@ -345,10 +346,11 @@
window.scrollTo({ top: 0, behavior: 'smooth' }); window.scrollTo({ top: 0, behavior: 'smooth' });
} }
// update suggestions reactively // update suggestions reactively, but hide once a track is selected
$: suggestions = userInput $: suggestions =
? tracks.filter((t) => t.title.toLowerCase().includes(userInput.toLowerCase())).slice(0, 5) userInput && !selectedTrack
: []; ? tracks.filter((t) => t.title.toLowerCase().includes(userInput.toLowerCase())).slice(0, 5)
: [];
</script> </script>
<!-- How to Play Modal --> <!-- How to Play Modal -->
@@ -482,6 +484,8 @@
<div class="text-sm" style="color:{COLORS.accent}">{ARTIST_NAME}</div> <div class="text-sm" style="color:{COLORS.accent}">{ARTIST_NAME}</div>
</div> </div>
</a> </a>
<!-- show win/lose message here -->
<p class="mt-4 text-center font-medium">{message}</p>
</div> </div>
{/if} {/if}