Skip to content

Commit

Permalink
Fix icon
Browse files Browse the repository at this point in the history
Changed from pause to stop icon for improved clarity on button function. Also fixed practice / youtube mode so that the icon properly resets.
  • Loading branch information
sabrina-aip committed Jan 15, 2024
1 parent a7b44d1 commit 2d7840c
Show file tree
Hide file tree
Showing 7 changed files with 26 additions and 431 deletions.
Binary file added .DS_Store
Binary file not shown.
10 changes: 5 additions & 5 deletions assets/scripts/keyboard.js
Original file line number Diff line number Diff line change
Expand Up @@ -188,7 +188,7 @@ function checkGuess() {
stopSound(activePlayer[1]);
activePlayer[0].style.backgroundColor = "#79b15a";
activePlayer[0].classList.add("submitted", "fa-check");
activePlayer[0].classList.remove("clicked","fa-play-circle", "fa-pause-circle","btn");
activePlayer[0].classList.remove("clicked","fa-play-circle", "fa-circle-stop","btn");

// RECORD FOR RESULTS
submissionLst.push(`<td>${attemptStr}</td>`)
Expand All @@ -200,7 +200,7 @@ function checkGuess() {
stopSound(activePlayer[1]);
activePlayer[0].style.backgroundColor = "#d25842";
activePlayer[0].classList.add("submitted", "fa-xmark");
activePlayer[0].classList.remove("clicked","fa-pause-circle", "fa-play-circle","btn");
activePlayer[0].classList.remove("clicked","fa-circle-stop", "fa-play-circle","btn");

// RECORD FOR RESULTS
submissionLst.push(`<td class="error">${attemptStr}</td>`)
Expand All @@ -224,7 +224,7 @@ function checkGuess() {
function updatePlayer(playerLst, activePlayer) {
if (activePlayer[0].classList.contains("clicked")) {
stopSound(activePlayer[1]);
activePlayer[0].classList.remove("clicked","fa-pause-circle");
activePlayer[0].classList.remove("clicked","fa-circle-stop");
activePlayer[0].classList.add("fa-play-circle");

lastActiveWord = activeWord;
Expand All @@ -238,10 +238,10 @@ function updatePlayer(playerLst, activePlayer) {

playerLst.forEach((player) => {
if ((!player[0].classList.contains("submitted")) & player[0] != activePlayer[0]) {
player[0].classList.remove("clicked", "fa-pause-circle");
player[0].classList.remove("clicked", "fa-circle-stop");
stopSound(player[1]);
} else if ((!player[0].classList.contains("submitted")) & player[0] == activePlayer[0]) {
activePlayer[0].classList.add("clicked","fa-pause-circle");
activePlayer[0].classList.add("clicked","fa-circle-stop");
activePlayer[1].play();
}
})
Expand Down
10 changes: 4 additions & 6 deletions assets/scripts/practice.js
Original file line number Diff line number Diff line change
Expand Up @@ -86,7 +86,6 @@ function updateWord(){
resetPlayer(playerLst);
activeWord = wordLst[wordCounter];
wordOnePlayer.src = `${path}/${wordLst[wordCounter]}.mp3`
console.log(`Word Counter: ${wordCounter}.\nActive Word: ${activeWord}`)

publicCount.textContent = `Words Spelled: ${wordCounter}`
}
Expand Down Expand Up @@ -172,9 +171,8 @@ function checkGuess() {
function updatePlayer(playerLst, activePlayer) {
if (activePlayer[0].classList.contains("clicked")) {
stopSound(activePlayer[1]);
activePlayer[0].classList.remove("clicked","fa-pause-circle");
activePlayer[0].classList.remove("clicked","fa-circle-stop");
activePlayer[0].classList.add("fa-play-circle");

lastActiveWord = activeWord;

// DEACTIVATE WORD
Expand All @@ -185,10 +183,10 @@ function updatePlayer(playerLst, activePlayer) {

playerLst.forEach((player) => {
if ((!player[0].classList.contains("submitted")) & player[0] != activePlayer[0]) {
player[0].classList.remove("clicked", "fa-pause-circle");
player[0].classList.remove("clicked", "fa-circle-stop");
stopSound(player[1]);
} else if ((!player[0].classList.contains("submitted")) & player[0] == activePlayer[0]) {
activePlayer[0].classList.add("clicked","fa-pause-circle");
activePlayer[0].classList.add("clicked","fa-circle-stop");
activePlayer[1].play();
}
})
Expand All @@ -198,7 +196,7 @@ function updatePlayer(playerLst, activePlayer) {
function resetPlayer(playerLst) {
playerLst.forEach((player) => {
player[0].style.backgroundColor = null;
player[0].classList.remove("clicked", "fa-xmark","fa-check", "submitted")
player[0].classList.remove("clicked", "fa-xmark","fa-check", "fa-circle-stop", "submitted")
player[0].classList.add("fa-play-circle")
})
}
Expand Down
114 changes: 0 additions & 114 deletions assets/scripts/wordLstGenerator2.js

This file was deleted.

32 changes: 15 additions & 17 deletions assets/scripts/youtube.js
Original file line number Diff line number Diff line change
Expand Up @@ -69,6 +69,7 @@ function checkLevel(level){
}

function updateWord(){
resetPlayer(playerLst);
if (wordCounter < 10){
levelPath = "levelOne"
} else if ((wordCounter >= 10) && (wordCounter<20)){
Expand All @@ -78,18 +79,16 @@ function updateWord(){
}
wordLst = genYoutubeWordLst()
path = `assets/audio/${levelPath}`;
resetPlayer(playerLst);
activeWord = wordLst[wordCounter];
wordOnePlayer.src = `${path}/${wordLst[wordCounter]}.mp3`
//console.log(`levelPath: ${levelPath}\nWord Counter: ${wordCounter}.\nActive Word: ${activeWord}`)

publicCount.textContent = `Words Spelled: ${wordCounter}`
}

function endGame(){
sessionStorage.setItem("submissionLst", submissionLst)
sessionStorage.setItem("correctSpellingLst",correctSpellingLst)
sessionStorage.setItem("level", level)
sessionStorage.setItem("level", "YouTube Challenge")

window.location.replace("practice_results.html");
}
Expand Down Expand Up @@ -118,6 +117,7 @@ function deleteLetter () {
}

function guessPreprocess() {

if ((lastActiveWord != null) & (activeWord==null)) {
activeWord = lastActiveWord;
checkGuess()
Expand All @@ -141,16 +141,12 @@ function checkGuess() {
if (attemptStr.toLowerCase() == activeWord.toLowerCase()) {
submissionLst.push(`<td>${attemptStr}</td>`)
wordCounter += 1;

stopSound(activePlayer[1]);

updatePlayer(playerLst, activePlayer)

// DEACTIVATE WORD
activeWord = null;
// activeWord = null;
activePlayer = null;


// RECURSIVE CALL FOR NEW WORD
updateWord();
} else {
Expand All @@ -165,35 +161,37 @@ function checkGuess() {

// update players to reflect their current status
function updatePlayer(playerLst, activePlayer) {

if (activePlayer[0].classList.contains("clicked")) {
stopSound(activePlayer[1]);
activePlayer[0].classList.remove("clicked","fa-pause-circle");
activePlayer[0].classList.remove("clicked","fa-circle-stop");
activePlayer[0].classList.add("fa-play-circle");

lastActiveWord = activeWord;

// DEACTIVATE WORD
activeWord = null;
// activeWord = null;
activePlayer = null;
return;
}

playerLst.forEach((player) => {
if ((!player[0].classList.contains("submitted")) & player[0] != activePlayer[0]) {
player[0].classList.remove("clicked", "fa-pause-circle");
if (player[0] != activePlayer[0]) {
player[0].classList.remove("clicked", "fa-circle-stop");
stopSound(player[1]);
} else if ((!player[0].classList.contains("submitted")) & player[0] == activePlayer[0]) {
activePlayer[0].classList.add("clicked","fa-pause-circle");
} else if (player[0] == activePlayer[0]) {
activePlayer[0].classList.add("clicked","fa-circle-stop");
activePlayer[1].play();
}
})
return;


}

function resetPlayer(playerLst) {
playerLst.forEach((player) => {
player[0].style.backgroundColor = null;
player[0].classList.remove("clicked", "fa-xmark","fa-check", "submitted")
player[0].classList.remove("clicked", "fa-xmark","fa-check", "fa-circle-stop", "submitted")
player[0].classList.add("fa-play-circle")
})
}
Expand Down
Loading

0 comments on commit 2d7840c

Please sign in to comment.