From 2377425f7945b039a403c93fed5073a2e8b893ef Mon Sep 17 00:00:00 2001 From: Peter Prince Date: Tue, 13 Aug 2024 16:50:25 +0100 Subject: [PATCH] Add resetting and speed up initialisation --- js/game.js | 15 ++++-- js/guesser.js | 91 ++++++++++++++++++++------------ js/player.js | 2 +- js/songClips.js | 26 +++++++-- play.html | 14 +++-- play.js | 119 ++++++++++++++++++++++++++++++++++++++++-- preselectedClips.json | 4 +- 7 files changed, 220 insertions(+), 51 deletions(-) diff --git a/js/game.js b/js/game.js index c7b364e..d103cf4 100644 --- a/js/game.js +++ b/js/game.js @@ -5,8 +5,8 @@ *****************************************************************************/ /* global connectToPlayer, endTimer, playAll, stopClip */ -/* global playClipButtons, startTimerButton, helpButton, startModal */ -/* global guessInput, giveUpButton, unguessedClips, revealSong */ +/* global playClipButtons, startTimerButton, helpButton, guessInput, giveUpButton, remakeButton */ +/* global unguessedClips, revealSong, resetStartModal */ /* global songClips */ const scoreSpan = document.getElementById('score-span'); @@ -33,6 +33,13 @@ function initialiseScore () { } +function resetScore () { + + scoreSpan.innerText = '-'; + maxScoreSpan.innerText = '-'; + +} + function startGame () { gameStarted = true; @@ -67,6 +74,8 @@ function endGame () { endTimer(); + remakeButton.disabled = false; + } async function prepareGame () { @@ -77,7 +86,7 @@ async function prepareGame () { console.log('Game is ready'); - startModal.hide(); + resetStartModal(); startTimerButton.disabled = false; diff --git a/js/guesser.js b/js/guesser.js index d3ad5e7..c54aead 100644 --- a/js/guesser.js +++ b/js/guesser.js @@ -48,24 +48,30 @@ function levenshtein (a, b) { } -function cleanString (str) { +function cleanString (input) { - // Step 1: Split around " - " and take the left part - let cleaned = str.split(' - ')[0]; + // Step 1: Convert the string to lowercase + let cleaned = input.toLowerCase(); - // Step 2: Remove all text inside parentheses (including the parentheses themselves) - cleaned = cleaned.replace(/\(.*?\)/g, ''); + // Step 2: Remove text inside standard brackets if it's at the end of the string + cleaned = cleaned.replace(/\s*\(.*?\)\s*$/, ''); - // Step 3: Remove all punctuation + // Step 3: Split the string around " - " and take all the text to the left of it + cleaned = cleaned.split(' - ')[0]; + + // Step 4: Remove all punctuation cleaned = cleaned.replace(/[^\w\s]/g, ''); - // Step 4: Replace & or lone N with "and" - cleaned = cleaned.replace(/&|(\bN\b)/g, 'and'); + // Step 5: Replace & or a lone 'n' with "and" + cleaned = cleaned.replace(/\s*&\s*/g, 'and').replace(/\bn\b/g, 'and'); + + // Step 6: Remove all instances of "the" + cleaned = cleaned.replace(/\bthe\b/g, ''); - // Step 5: Remove all spaces + // Step 7: Strip out all spaces cleaned = cleaned.replace(/\s+/g, ''); - return cleaned.toLowerCase(); + return cleaned; } @@ -113,50 +119,67 @@ function prepareUI () { unguessedClips = JSON.parse(JSON.stringify(songClips)); - guessInput.addEventListener('keyup', () => { - - const guess = guessInput.value; +} - let matchIndex = -1; +function resetUI () { - unguessedClips.forEach((clip, index) => { + playClipButtons = []; + songNameSpans = []; + hyphenSpans = []; + artistSpans = []; - const isMatch = isCloseMatch(guess, clip.songName); + unguessedClips = []; - if (isMatch) { +} - matchIndex = index; +guessInput.addEventListener('keyup', () => { - } + const guess = guessInput.value; - }); + let matchIndex = -1; - if (matchIndex !== -1) { + unguessedClips.forEach((clip, index) => { - // Let user type final letter if that is the only difference + const isMatch = isCloseMatch(guess, clip.songName); - const likelyClipName = cleanString(unguessedClips[matchIndex].songName); + if (isMatch) { - if (likelyClipName.substring(0, likelyClipName.length - 1) === cleanString(guess)) { + matchIndex = index; - return; + } - } + }); - console.log('Matched with', matchIndex); + if (matchIndex !== -1) { - guessInput.value = ''; + // Let user type final letter if that is the only difference - revealSong(matchIndex, 'green'); + const likelyClipName = cleanString(unguessedClips[matchIndex].songName); - unguessedClips.splice(matchIndex, 1); + if (likelyClipName.substring(0, likelyClipName.length - 1) === cleanString(guess)) { - updateScore(); + return; } - }); + console.log('Matched with', matchIndex); - giveUpButton.addEventListener('click', endGame); + guessInput.value = ''; -} + revealSong(matchIndex, 'green'); + + unguessedClips.splice(matchIndex, 1); + + updateScore(); + + } + +}); + +giveUpButton.addEventListener('click', () => { + + console.log('Giving up'); + + endGame(); + +}); diff --git a/js/player.js b/js/player.js index 0405009..18e9fe3 100644 --- a/js/player.js +++ b/js/player.js @@ -293,7 +293,7 @@ function updateClipInfo () { if (currentClipIndex === -1) { - clipInfo.textContent = '-'; + clipInfo.textContent = '- / -'; } else { diff --git a/js/songClips.js b/js/songClips.js index ea807f8..229720c 100644 --- a/js/songClips.js +++ b/js/songClips.js @@ -9,7 +9,7 @@ /* global bootstrap */ /* global token, currentClipIndex */ /* global stopButton, resumeButton, prevButton, nextButton */ -/* global prepareUI, resumeClip, stopClip, pauseTimer, resumeTimer, addSecondsToTimer, playSpecificClip */ +/* global prepareUI, resetUI, resumeClip, stopClip, pauseTimer, resumeTimer, addSecondsToTimer, playSpecificClip */ const CLIP_LENGTH_MS = 8000; @@ -321,8 +321,6 @@ async function populateClipList (playlistIdArray, songCount) { for (let i = 0; i < newSongs.length; i++) { - newSongs[i].index = i + songClips.length; - const clip = newSongs[i]; if (!clip.uri) { @@ -346,7 +344,17 @@ async function populateClipList (playlistIdArray, songCount) { } - console.log(songClips); + // Shuffle + + songClips = songClips.slice().sort(() => 0.5 - Math.random()); + + // Add index value + + songClips = songClips.map((item, index) => { + + return {...item, index}; + + }); createSongUI(); @@ -354,6 +362,16 @@ async function populateClipList (playlistIdArray, songCount) { } +function clearClipList () { + + songClips = []; + + songUiContainer.innerHTML = ''; + + resetUI(); + +} + helpButton.addEventListener('click', () => { reselectNumberSpan.innerText = currentClipIndex + 1; diff --git a/play.html b/play.html index 300b9e9..3935aaf 100644 --- a/play.html +++ b/play.html @@ -10,7 +10,7 @@ -