Skip to content

Commit

Permalink
Added skip button
Browse files Browse the repository at this point in the history
  • Loading branch information
@kyletimmermans
kyletimmermans authored Jun 23, 2024
1 parent 2123afe commit 633687f
Show file tree
Hide file tree
Showing 3 changed files with 79 additions and 57 deletions.
92 changes: 57 additions & 35 deletions app.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,20 +5,24 @@ var jsonCompare,
correctAnswer,
fetchList = [];


// Start with verbs on site load
document.addEventListener("DOMContentLoaded", (event) => {
verb();
});


function getRandomInt(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min;
}


function getRandomString(arr) {
const randomIndex = Math.floor(Math.random() * arr.length);
return arr[randomIndex];
}


const randomGender = (plural) => {
if (plural == true) {
let gender = getRandomString(["m", "f", "n", "p"]);
Expand Down Expand Up @@ -59,6 +63,7 @@ const randomGender = (plural) => {
}
};


const randomCase = (animate, plural) => {
var gramcase;

Expand Down Expand Up @@ -137,6 +142,7 @@ const randomCase = (animate, plural) => {
}
};


const randomVerb = (data) => {
let randomVerb = data.verb[getRandomInt(0, data.verb.length - 1)];

Expand Down Expand Up @@ -214,6 +220,7 @@ const randomVerb = (data) => {
];
};


const randomNoun = (data, amount) => {
let randomNoun = data.noun[getRandomInt(0, data.noun.length - 1)];
let gramcase = randomCase(false, amount);
Expand Down Expand Up @@ -250,6 +257,7 @@ const randomAdjective = (data, amount) => {
];
};


const randomPronoun = (data) => {
let randomPronoun = data.pronoun[getRandomInt(0, data.pronoun.length - 1)];
let gramcase = randomCase(false, 's');
Expand Down Expand Up @@ -299,6 +307,7 @@ const randomPossDemo = (data, word) => {
}
};


const randomQuestionWord = (data) => {
let randomQuestion =
data.questionword[getRandomInt(0, data.questionword.length - 1)];
Expand Down Expand Up @@ -328,6 +337,7 @@ const randomQuestionWord = (data) => {
}
};


const randomComparative = (data) => {
let randomComp =
data.comparative[getRandomInt(0, data.comparative.length - 1)];
Expand Down Expand Up @@ -370,6 +380,7 @@ const verb = () => {
}
};


const singNoun = () => {
document.querySelector("#centered-title").innerHTML = "Singular Noun Cases";

Expand Down Expand Up @@ -410,6 +421,7 @@ const singNoun = () => {
}
};


const plurNoun = () => {
document.querySelector("#centered-title").textContent = "Plural Noun Cases";

Expand Down Expand Up @@ -449,6 +461,7 @@ const plurNoun = () => {
}
};


const singAdj = () => {
document.querySelector("#centered-title").textContent = "Singular Adjective Cases";

Expand Down Expand Up @@ -477,6 +490,7 @@ const singAdj = () => {
}
};


const plurAdj = () => {
document.querySelector("#centered-title").textContent = "Plural Adjective Cases";

Expand Down Expand Up @@ -504,6 +518,7 @@ const plurAdj = () => {
}
};


const pronoun = () => {
document.querySelector("#centered-title").textContent = "Pronoun Cases";

Expand Down Expand Up @@ -550,6 +565,7 @@ const pronoun = () => {
}
};


const possesive = () => {
document.querySelector("#centered-title").textContent = "Possesive Pronoun + Сам Cases";

Expand All @@ -575,6 +591,7 @@ const possesive = () => {
}
};


const demonstrative = () => {
document.querySelector("#centered-title").textContent = "Demonstrative + Весь Cases";

Expand All @@ -600,6 +617,7 @@ const demonstrative = () => {
}
};


const questionword = () => {
document.querySelector("#centered-title").textContent = "Question Word Cases";

Expand Down Expand Up @@ -635,6 +653,7 @@ const questionword = () => {
}
};


const comparative = () => {
document.querySelector("#centered-title").textContent = "Comparative Creation";

Expand Down Expand Up @@ -663,13 +682,49 @@ const comparative = () => {
};


const checkAnswer = () => {
let answer = document.getElementById("inputAnswer").value.toLowerCase();
if (answer.replace(/\s/g, "") == correctAnswer.toLowerCase()) {
document.getElementById("result").innerHTML =
"Result: <span style='color: green;'>Correct!</span>";
} else {
document.getElementById("result").innerHTML =
"Result: <span style='color: red;'>Incorrect - " +
correctAnswer +
"</span>";
}

// Disable button to prevent issues
var checkButton = document.getElementById("check-button");
checkButton.classList.remove('btn-outline-info');
checkButton.classList.add('btn-outline-warning');
checkButton.innerText = "Skip";
checkButton.onclick = resetForm;

// Wait 5 seconds for user to read corrected answer, then reset
setTimeout(() => {
resetForm();
}, 5000);
};


// Onclick skip button, on change exercise, or 5s after clicking check-answer
const resetForm = () => {
var id = window.setTimeout(function() {}, 0);
while (id--) {
window.clearTimeout(id);
}

// Reset Result and input answer field
document.getElementById("result").innerHTML = "Result: ";
document.getElementById("inputAnswer").value = "";

// Re-enable button
document.getElementById("check-button").disabled = false;
// Turn skip button back into check-button
var checkButton = document.getElementById("check-button");
checkButton.innerText = "Check";
checkButton.classList.remove('btn-outline-warning');
checkButton.classList.add('btn-outline-info');
checkButton.onclick = checkAnswer;

// Find out which exercise we need to get a new question from
// By looking at the current title that we set
Expand Down Expand Up @@ -711,36 +766,3 @@ const resetForm = () => {
console.error("Something went wrong in checkAnswer()!");
}
};


const checkAnswer = () => {
let answer = document.getElementById("inputAnswer").value.toLowerCase();
if (answer.replace(/\s/g, "") == correctAnswer.toLowerCase()) {
document.getElementById("result").innerHTML =
"Result: <span style='color: green;'>Correct!</span>";
} else {
document.getElementById("result").innerHTML =
"Result: <span style='color: red;'>Incorrect - " +
correctAnswer +
"</span>";
}

// Disable button to prevent issues
document.getElementById("check-button").disabled = true;

// Wait 5 seconds for user to read corrected answer, then reset
setTimeout(() => {
restForm();
}, 5000);
};


// Prevent timers from going off after exercise switch
function clearTimers() {
var id = window.setTimeout(function() {}, 0);
while (id--) {
window.clearTimeout(id);
}

resetForm();
}
22 changes: 11 additions & 11 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,16 +50,16 @@
<div class="dropdown position-fixed top-0 start-0 p-2">
<button class="btn btn-info dropdown-toggle" type="button" id="dropdownMenu2" data-bs-toggle="dropdown" aria-expanded="false">Exercise Type </button>
<ul class="dropdown-menu" aria-labelledby="dropdownMenu2">
<li><button class="dropdown-item" type="button" onclick="clearTimers(); verb();">Verb Conjugations</button></li>
<li><button class="dropdown-item" type="button" onclick="clearTimers(); singNoun();">Singular Noun Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="clearTimers(); plurNoun();">Plural Noun Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="clearTimers(); singAdj();">Singular Adjective Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="clearTimers(); plurAdj();">Plural Adjective Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="clearTimers(); pronoun();">Pronoun Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="clearTimers(); possesive();">Possesive Pronoun + Сам Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="clearTimers(); demonstrative();">Demonstrative + Весь Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="clearTimers(); questionword();">Question Word Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="clearTimers(); comparative();">Comparative Creation</button></li>
<li><button class="dropdown-item" type="button" onclick="resetForm(); verb();">Verb Conjugations</button></li>
<li><button class="dropdown-item" type="button" onclick="resetForm(); singNoun();">Singular Noun Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="resetForm(); plurNoun();">Plural Noun Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="resetForm(); singAdj();">Singular Adjective Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="resetForm(); plurAdj();">Plural Adjective Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="resetForm(); pronoun();">Pronoun Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="resetForm(); possesive();">Possesive Pronoun + Сам Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="resetForm(); demonstrative();">Demonstrative + Весь Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="resetForm(); questionword();">Question Word Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="resetForm(); comparative();">Comparative Creation</button></li>
</ul>
</div>

Expand Down Expand Up @@ -116,7 +116,7 @@ <h1 class="col" id="centered-title"><b>Verb Conjugations</b></h1>
</div>
<div class="row">
<input class="form-control-lg" id="inputAnswer" type="text" placeholder="Answer" spellcheck="false">
<button type="button" id="check-button" class="btn btn-outline-info" onclick="checkAnswer()">Check</button>
<button type="button" id="check-button" class="btn btn-outline-info" onclick="checkAnswer();">Check</button>
</div>
<div class="row" style="margin-top: 8vh;">
<div class="col" id="result">Result: </div>
Expand Down
22 changes: 11 additions & 11 deletions mobile/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -79,16 +79,16 @@
<div class="dropdown top-0 start-0 p-2">
<button class="btn btn-info dropdown-toggle" type="button" id="dropdownMenu2" data-bs-toggle="dropdown" aria-expanded="false">Exercise Type </button>
<ul class="dropdown-menu" aria-labelledby="dropdownMenu2">
<li><button class="dropdown-item" type="button" onclick="clearTimers(); verb();">Verb Conjugations</button></li>
<li><button class="dropdown-item" type="button" onclick="clearTimers(); singNoun();">Singular Noun Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="clearTimers(); plurNoun();">Plural Noun Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="clearTimers(); singAdj();">Singular Adjective Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="clearTimers(); plurAdj();">Plural Adjective Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="clearTimers(); pronoun();">Pronoun Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="clearTimers(); possesive();">Possesive Pronoun + Сам Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="clearTimers(); demonstrative();">Demonstrative + Весь Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="clearTimers(); questionword();">Question Word Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="clearTimers(); comparative();">Comparative Creation</button></li>
<li><button class="dropdown-item" type="button" onclick="resetForm(); verb();">Verb Conjugations</button></li>
<li><button class="dropdown-item" type="button" onclick="resetForm(); singNoun();">Singular Noun Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="resetForm(); plurNoun();">Plural Noun Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="resetForm(); singAdj();">Singular Adjective Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="resetForm(); plurAdj();">Plural Adjective Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="resetForm(); pronoun();">Pronoun Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="resetForm(); possesive();">Possesive Pronoun + Сам Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="resetForm(); demonstrative();">Demonstrative + Весь Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="resetForm(); questionword();">Question Word Cases</button></li>
<li><button class="dropdown-item" type="button" onclick="resetForm(); comparative();">Comparative Creation</button></li>
</ul>
</div>

Expand Down Expand Up @@ -145,7 +145,7 @@ <h1 class="col" id="centered-title"><b>Verb Conjugations</b></h1>
</div>
<div style="margin-bottom: 9vh;" class="row">
<input class="form-control-lg" id="inputAnswer" type="text" placeholder="Answer" spellcheck="false">
<button type="button" id="check-button" class="btn btn-outline-info" onclick="checkAnswer()">Check</button>
<button type="button" id="check-button" class="btn btn-outline-info" onclick="checkAnswer();">Check</button>
</div>
<div style="margin-bottom: 2vh;" class="row">
<div class="col" id="result">Result: </div>
Expand Down

0 comments on commit 633687f

Please sign in to comment.