commit f90acd31608125ffc9ee9119490b85a1ae53f2b7
parent 0243b0e3cf4e1433583aabe95d9935be7bc6d105
Author: AsherMorgan <59518073+AsherMorgan@users.noreply.github.com>
Date: Wed, 21 Oct 2020 08:51:44 -0700
Implement app.category variable.
Diffstat:
3 files changed, 24 insertions(+), 61 deletions(-)
diff --git a/index.html b/index.html
@@ -36,8 +36,8 @@
<h1>What do you want to study?</h1>
<div>
- <button @click="state = 'verbSettings';">Conjugations</button>
- <button @click="state = 'vocabSettings';">Vocab</button>
+ <button @click="category = 'verbs'; state = 'settings';">Conjugations</button>
+ <button @click="category = 'vocab'; state = 'settings';">Vocab</button>
</div>
<div>
@@ -46,11 +46,11 @@
</div>
- <settings id="settings" v-show="state === 'verbSettings' || state === 'vocabSettings'" hidden
- :category="state === 'verbSettings' ? 'verbs' : 'vocab'" @start-session="StartSession">
+ <settings id="settings" v-show="state === 'settings'" hidden
+ :category="category" @start-session="StartSession">
</settings>
- <quizzer id="quizzer" v-show="state === 'verbQuizzer' || state === 'vocabQuizzer'" :active="state === 'verbQuizzer' || state === 'vocabQuizzer'" hidden
+ <quizzer id="quizzer" v-show="state === 'quizzer'" :active="state === 'quizzer'" hidden
:starting-index="promptIndex" :starting-prompts="prompts" @new-prompt="updateProgress"
:prompt-type="promptType" :input-type="inputType" :on-missed-prompt="onMissedPrompt" :repeat-prompts="repeatPrompts">
</quizzer>
diff --git a/js/home.js b/js/home.js
@@ -12,7 +12,9 @@ function loadVue() {
el: "#app", // Mount to app div
data: {
- state: "home",
+ state: "home", // Can be either "home", "settings", or "quizzer"
+ category: "home", // Can be either "verbs" or "vocab"
+
promptType: "Text",
inputType: "Text",
onMissedPrompt: "Correct me",
@@ -28,14 +30,10 @@ function loadVue() {
*/
Back: function() {
switch (app.state) {
- case "verbQuizzer":
- app.state = "verbSettings";
+ case "quizzer":
+ app.state = "settings";
break;
- case "vocabQuizzer":
- app.state = "vocabSettings";
- break;
- case "verbSettings":
- case "vocabSettings":
+ case "settings":
case "home":
default:
app.state = "home";
@@ -50,16 +48,7 @@ function loadVue() {
*/
updateProgress: function(prompts, index) {
// Get localStorage prefix
- let prefix;
- if (app.state === "vocabSettings" || app.state === "vocabQuizzer") {
- prefix = "vocab-"
- }
- else if (app.state === "verbSettings" || app.state === "verbQuizzer") {
- prefix = "verb-"
- }
- else {
- return;
- }
+ let prefix = app.category === "verbs" ? "verb-" : "vocab-";
// Save progress to local storage
localStorage.setItem(prefix + "prompts", JSON.stringify(prompts));
@@ -107,12 +96,7 @@ function loadVue() {
this.repeatPrompts = repeatPrompts
// Show and hide elements (also enables the quizzer)
- if (this.state === "verbSettings") {
- this.state = "verbQuizzer";
- }
- else if (this.state === "vocabSettings") {
- this.state = "vocabQuizzer";
- }
+ this.state = "quizzer";
}
},
});
@@ -170,10 +154,12 @@ function KeyDown(e) {
// Home shortcuts
if (app.state === "home") {
if (e.key === "c") {
- app.state = "verbSettings";
+ category = "verbs";
+ state = "settings";
}
if (e.key === "v") {
- app.state = "vocabSettings";
+ category = "vocab";
+ state = "settings";
}
if (e.key === "r") {
window.location = "reference.html";
diff --git a/tests/test.app.js b/tests/test.app.js
@@ -54,28 +54,16 @@ describe("App", function() {
it("Should go to home when on settings", function() {
// Set state and test Back method
- app.state = "verbSettings";
+ app.state = "settings";
app.Back();
expect(app.state).to.equal("home");
-
- // Set state and test Back method again
- app.state = "vocabSettings";
- app.Back();
- expect(app.state).to.equal("home");
- });
-
- it("Should go to verb settings when on verb quizzer", function() {
- // Set state and test Back method
- app.state = "verbQuizzer";
- app.Back();
- expect(app.state).to.equal("verbSettings");
});
- it("Should go to vocab settings when on vocab quizzer", function() {
+ it("Should go to settings when on quizzer", function() {
// Set state and test Back method
- app.state = "vocabQuizzer";
+ app.state = "quizzer";
app.Back();
- expect(app.state).to.equal("vocabSettings");
+ expect(app.state).to.equal("settings");
});
});
@@ -93,26 +81,15 @@ describe("App", function() {
expect(app.repeatPrompts).to.equal("d");
});
- it("Should set state to 'verbQuizzer' if state is 'verbSettings'", function() {
- // Initialize settings
- app.state = "verbSettings";
-
- // Call StartSession
- app.StartSession([1, 2, 3], 4, "a", "b", "c", "d");
-
- // Assert parameters imported
- expect(app.state).to.equal("verbQuizzer");
- });
-
- it("Should set state to 'vocabQuizzer' if state is 'vocabSettings'", function() {
+ it("Should set state to 'quizzer'", function() {
// Initialize settings
- app.state = "vocabSettings";
+ app.state = "settings";
// Call StartSession
app.StartSession([1, 2, 3], 4, "a", "b", "c", "d");
// Assert parameters imported
- expect(app.state).to.equal("vocabQuizzer");
+ expect(app.state).to.equal("quizzer");
});
});
});