Skip to content

Commit b42a6bf

Browse files
duckRabbitPyduckRabbitPy
authored
Merge pull request #8 from duckRabbitPy/stage-3
Stage 3
2 parents bfd3e2a + 879cebc commit b42a6bf

File tree

4 files changed

+62
-20
lines changed

4 files changed

+62
-20
lines changed

‎public/app.js

+29-9
Original file line numberDiff line numberDiff line change
@@ -27,34 +27,50 @@ window.onload = () => {
2727
};
2828
const snippets = {
2929
Functions: [
30-
`type to start`,
30+
`type: functions`,
3131
`function reverse(s: string): string;`,
3232
`function playSound(x: () => void) {x();}`,
3333
`const compact = (arr: any[]) => arr.filter(Boolean);`,
3434
`let oddNumbers:number[] = myArr.filter( (n:number) => n % 2 == 0 )`,
35+
`function firstElement2<Type extends any[]>(arr: Type) {return arr[0];}`,
36+
`topic complete return to menu!`,
3537
],
3638
Casting: [
37-
`type to start`,
39+
`type: casting`,
40+
`const currTopic = topic as options`,
3841
`const winSound = document.querySelector("#win_sound") as HTMLAudioElement;`,
3942
`let input = document.querySelector('input[type="text"]') as HTMLInputElement;`,
4043
`const XP = document.querySelector("#xp") as HTMLParagraphElement;`,
44+
`topic complete return to menu!`,
4145
],
4246
Interfaces: [
43-
`type to start`,
47+
`type: interfaces`,
4448
`interface Person { name: string; age: number;}`,
4549
`interface PaintOptions { shape: Shape; xPos?: number; yPos?: number;}`,
50+
`interface CallOrConstruct {new (s: string): Date; (n?: number): number;}`,
51+
`topic complete return to menu!`,
4652
],
4753
Generics: [
48-
`type to start`,
54+
`type: generics`,
4955
`function identity<Type>(arg: Type): Type {return arg;}`,
5056
`let myIdentity: <Type>(arg: Type) => Type = identity;`,
57+
`function firstElem<Type>(arr: Type[]): Type | undefined {return arr[0];}`,
58+
`topic complete return to menu!`,
5159
],
5260
};
5361
// key event listener
5462
document.addEventListener("keydown", (event) => {
5563
let currPress = event.key;
5664
const frontOfStackLetter = frontOfStackElem.innerHTML;
5765
currPress = convertSpecial(currPress);
66+
if (currPress === "Enter") {
67+
ul.classList.remove("hidden");
68+
round++;
69+
roundInfo.innerHTML = `${topic}: Round ${String(round)}`;
70+
clearList(starUL);
71+
statDisplay.innerHTML = "";
72+
return;
73+
}
5874
if (currPress === frontOfStackLetter && frontOfStackElem !== null) {
5975
//correct key
6076
keyEffect(frontOfStackElem, true);
@@ -84,6 +100,10 @@ topicSelectors.forEach((btn) => {
84100
form === null || form === void 0 ? void 0 : form.classList.add("hidden");
85101
menu === null || menu === void 0 ? void 0 : menu.classList.remove("hidden");
86102
footer === null || footer === void 0 ? void 0 : footer.classList.add("hidden");
103+
clearList(ul);
104+
nextSet();
105+
ul.classList.remove("hidden");
106+
roundInfo.innerHTML = `${topic}: Warm up 🙌`;
87107
});
88108
});
89109
menu === null || menu === void 0 ? void 0 : menu.addEventListener("click", () => {
@@ -121,8 +141,6 @@ function keyEffect(frontOfStackElem, correct) {
121141
//start timer when first correct key entered on new round
122142
if (correct && timerStarted === false) {
123143
timer.start();
124-
clearList(starUL);
125-
statDisplay.innerHTML = "";
126144
errorcount = 0;
127145
timerStarted = true;
128146
}
@@ -131,11 +149,10 @@ function moveToNext(frontOfStackElem) {
131149
if (frontOfStackElem.nextElementSibling === null) {
132150
displayStats();
133151
frontOfStackElem = nextSet();
152+
ul.classList.add("hidden");
134153
timer.stop();
135154
timer.reset();
136155
timerStarted = false;
137-
round++;
138-
roundInfo.innerHTML = `${topic}: Round ${String(round)}`;
139156
return frontOfStackElem;
140157
}
141158
return frontOfStackElem.nextElementSibling;
@@ -164,14 +181,15 @@ function displayStats() {
164181
runningScore += score;
165182
XP.innerHTML = `${String(Math.ceil(runningScore))} XP`;
166183
if (score > 1500) {
167-
statDisplay.innerHTML = `${speed} words a minute!${speed > 40 ? "🔥🔥" : ""} ${accuracy}% accuracy ${accuracy > 95 ? "🎯🎯🎯" : ""}, +${score} xp`;
184+
statDisplay.innerHTML = `${speed} words a minute!${speed > 40 ? "🔥🔥" : ""} ${accuracy}% accuracy ${accuracy > 95 ? "🎯🎯🎯" : ""} +${score} xp`;
168185
winSound.currentTime = 0;
169186
winSound.play();
170187
snippetIndex++;
171188
}
172189
else {
173190
statDisplay.innerHTML = `Failed 😰. ${speed} words per minute. ${accuracy}% accuracy. Try again!`;
174191
}
192+
statDisplay.innerHTML += "</br></br>'Enter' to continue...";
175193
}
176194
function getStats() {
177195
const secondsExpired = timer.getTime() / 1000;
@@ -233,6 +251,8 @@ function reset() {
233251
errorcount = 0;
234252
snippetIndex = 0;
235253
runningScore = 0;
254+
timer.stop();
255+
timer.reset();
236256
timerStarted = false;
237257
clearList(ul);
238258
clearList(starUL);

‎public/index.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -42,8 +42,8 @@ <h2 id="round_info"></h2>
4242
<ul>
4343
</ul>
4444
</pre>
45-
<p id="stats"></p>
4645
<ul id="stars"></ul>
46+
<p id="stats"></p>
4747
</section>
4848

4949
<footer>

‎public/styles.css

+1-1
Original file line numberDiff line numberDiff line change
@@ -107,7 +107,7 @@ form .grid-item:hover {
107107

108108
#stats {
109109
font-size: xx-large;
110-
color: aqua;
110+
color: white;
111111
}
112112

113113
#stars {

‎src/app.ts

+31-9
Original file line numberDiff line numberDiff line change
@@ -29,27 +29,35 @@ window.onload = () => {
2929

3030
const snippets = {
3131
Functions: [
32-
`type to start`,
32+
`type: functions`,
3333
`function reverse(s: string): string;`,
3434
`function playSound(x: () => void) {x();}`,
3535
`const compact = (arr: any[]) => arr.filter(Boolean);`,
3636
`let oddNumbers:number[] = myArr.filter( (n:number) => n % 2 == 0 )`,
37+
`function firstElement2<Type extends any[]>(arr: Type) {return arr[0];}`,
38+
`topic complete return to menu!`,
3739
],
3840
Casting: [
39-
`type to start`,
41+
`type: casting`,
42+
`const currTopic = topic as options`,
4043
`const winSound = document.querySelector("#win_sound") as HTMLAudioElement;`,
4144
`let input = document.querySelector('input[type="text"]') as HTMLInputElement;`,
4245
`const XP = document.querySelector("#xp") as HTMLParagraphElement;`,
46+
`topic complete return to menu!`,
4347
],
4448
Interfaces: [
45-
`type to start`,
49+
`type: interfaces`,
4650
`interface Person { name: string; age: number;}`,
4751
`interface PaintOptions { shape: Shape; xPos?: number; yPos?: number;}`,
52+
`interface CallOrConstruct {new (s: string): Date; (n?: number): number;}`,
53+
`topic complete return to menu!`,
4854
],
4955
Generics: [
50-
`type to start`,
56+
`type: generics`,
5157
`function identity<Type>(arg: Type): Type {return arg;}`,
5258
`let myIdentity: <Type>(arg: Type) => Type = identity;`,
59+
`function firstElem<Type>(arr: Type[]): Type | undefined {return arr[0];}`,
60+
`topic complete return to menu!`,
5361
],
5462
};
5563

@@ -68,6 +76,15 @@ document.addEventListener("keydown", (event) => {
6876

6977
currPress = convertSpecial(currPress);
7078

79+
if (currPress === "Enter") {
80+
ul.classList.remove("hidden");
81+
round++;
82+
roundInfo.innerHTML = `${topic}: Round ${String(round)}`;
83+
clearList(starUL);
84+
statDisplay.innerHTML = "";
85+
return;
86+
}
87+
7188
if (currPress === frontOfStackLetter && frontOfStackElem !== null) {
7289
//correct key
7390
keyEffect(frontOfStackElem, true);
@@ -100,6 +117,11 @@ topicSelectors.forEach((btn) => {
100117
form?.classList.add("hidden");
101118
menu?.classList.remove("hidden");
102119
footer?.classList.add("hidden");
120+
121+
clearList(ul);
122+
nextSet();
123+
ul.classList.remove("hidden");
124+
roundInfo.innerHTML = `${topic}: Warm up 🙌`;
103125
});
104126
});
105127

@@ -142,8 +164,6 @@ function keyEffect(frontOfStackElem: Element, correct: Boolean) {
142164
//start timer when first correct key entered on new round
143165
if (correct && timerStarted === false) {
144166
timer.start();
145-
clearList(starUL);
146-
statDisplay.innerHTML = "";
147167
errorcount = 0;
148168
timerStarted = true;
149169
}
@@ -153,11 +173,10 @@ function moveToNext(frontOfStackElem: Element) {
153173
if (frontOfStackElem.nextElementSibling === null) {
154174
displayStats();
155175
frontOfStackElem = nextSet();
176+
ul.classList.add("hidden");
156177
timer.stop();
157178
timer.reset();
158179
timerStarted = false;
159-
round++;
160-
roundInfo.innerHTML = `${topic}: Round ${String(round)}`;
161180
return frontOfStackElem;
162181
}
163182
return frontOfStackElem.nextElementSibling;
@@ -191,13 +210,14 @@ function displayStats() {
191210
if (score > 1500) {
192211
statDisplay.innerHTML = `${speed} words a minute!${
193212
speed > 40 ? "🔥🔥" : ""
194-
} ${accuracy}% accuracy ${accuracy > 95 ? "🎯🎯🎯" : ""}, +${score} xp`;
213+
} ${accuracy}% accuracy ${accuracy > 95 ? "🎯🎯🎯" : ""} +${score} xp`;
195214
winSound.currentTime = 0;
196215
winSound.play();
197216
snippetIndex++;
198217
} else {
199218
statDisplay.innerHTML = `Failed 😰. ${speed} words per minute. ${accuracy}% accuracy. Try again!`;
200219
}
220+
statDisplay.innerHTML += "</br></br>'Enter' to continue...";
201221
}
202222

203223
function getStats() {
@@ -259,6 +279,8 @@ function reset() {
259279
errorcount = 0;
260280
snippetIndex = 0;
261281
runningScore = 0;
282+
timer.stop();
283+
timer.reset();
262284
timerStarted = false;
263285
clearList(ul);
264286
clearList(starUL);

0 commit comments

Comments
 (0)