mirror of
https://github.com/monkeytypegame/monkeytype.git
synced 2025-02-28 08:43:07 +08:00
fix(typing): live elements sometimes being softlocked in the hidden state
Fixed by adding a state variable which is independent of the dom classes Closes #4613
This commit is contained in:
parent
4a429575fc
commit
7e9e096d9f
3 changed files with 21 additions and 10 deletions
|
@ -12,11 +12,13 @@ export function update(acc: number): void {
|
|||
(document.querySelector("#liveAcc") as Element).innerHTML = number + "%";
|
||||
}
|
||||
|
||||
let state = false;
|
||||
|
||||
export function show(): void {
|
||||
if (!Config.showLiveAcc) return;
|
||||
if (!TestState.isActive) return;
|
||||
if (state) return;
|
||||
if (Config.timerStyle === "mini") {
|
||||
if (!$("#miniTimerAndLiveWpm .acc").hasClass("hidden")) return;
|
||||
$("#miniTimerAndLiveWpm .acc")
|
||||
.stop(true, false)
|
||||
.removeClass("hidden")
|
||||
|
@ -28,7 +30,6 @@ export function show(): void {
|
|||
125
|
||||
);
|
||||
} else {
|
||||
if (!$("#liveAcc").hasClass("hidden")) return;
|
||||
$("#liveAcc")
|
||||
.stop(true, false)
|
||||
.removeClass("hidden")
|
||||
|
@ -40,11 +41,13 @@ export function show(): void {
|
|||
125
|
||||
);
|
||||
}
|
||||
state = true;
|
||||
}
|
||||
|
||||
export function hide(): void {
|
||||
// $("#liveWpm").css("opacity", 0);
|
||||
// $("#miniTimerAndLiveWpm .wpm").css("opacity", 0);
|
||||
if (!state) return;
|
||||
$("#liveAcc")
|
||||
.stop(true, false)
|
||||
.animate(
|
||||
|
@ -67,6 +70,7 @@ export function hide(): void {
|
|||
$("#miniTimerAndLiveWpm .acc").addClass("hidden");
|
||||
}
|
||||
);
|
||||
state = false;
|
||||
}
|
||||
|
||||
ConfigEvent.subscribe((eventKey, eventValue) => {
|
||||
|
|
|
@ -12,11 +12,13 @@ export async function update(burst: number): Promise<void> {
|
|||
burst.toString();
|
||||
}
|
||||
|
||||
let state = false;
|
||||
|
||||
export function show(): void {
|
||||
if (!Config.showLiveBurst) return;
|
||||
if (!TestState.isActive) return;
|
||||
if (state) return;
|
||||
if (Config.timerStyle === "mini") {
|
||||
if (!$("#miniTimerAndLiveWpm .burst").hasClass("hidden")) return;
|
||||
$("#miniTimerAndLiveWpm .burst")
|
||||
.stop(true, false)
|
||||
.removeClass("hidden")
|
||||
|
@ -28,7 +30,6 @@ export function show(): void {
|
|||
125
|
||||
);
|
||||
} else {
|
||||
if (!$("#liveBurst").hasClass("hidden")) return;
|
||||
$("#liveBurst")
|
||||
.stop(true, false)
|
||||
.removeClass("hidden")
|
||||
|
@ -43,6 +44,7 @@ export function show(): void {
|
|||
}
|
||||
|
||||
export function hide(): void {
|
||||
if (!state) return;
|
||||
$("#liveBurst")
|
||||
.stop(true, false)
|
||||
.animate(
|
||||
|
@ -65,6 +67,7 @@ export function hide(): void {
|
|||
$("#miniTimerAndLiveWpm .burst").addClass("hidden");
|
||||
}
|
||||
);
|
||||
state = false;
|
||||
}
|
||||
|
||||
ConfigEvent.subscribe((eventKey, eventValue) => {
|
||||
|
|
|
@ -20,13 +20,15 @@ export function update(wpm: number, raw: number): void {
|
|||
liveWpmElement.innerHTML = number.toString();
|
||||
}
|
||||
|
||||
let state = false;
|
||||
|
||||
export function show(): void {
|
||||
if (!Config.showLiveWpm) return;
|
||||
if (!TestState.isActive) return;
|
||||
if (state) return;
|
||||
if (Config.timerStyle === "mini") {
|
||||
if (!miniLiveWpmElement.classList.contains("hidden")) return;
|
||||
$(miniLiveWpmElement)
|
||||
.stop(true, true)
|
||||
.stop(true, false)
|
||||
.removeClass("hidden")
|
||||
.css("opacity", 0)
|
||||
.animate(
|
||||
|
@ -36,9 +38,8 @@ export function show(): void {
|
|||
125
|
||||
);
|
||||
} else {
|
||||
if (!liveWpmElement.classList.contains("hidden")) return;
|
||||
$(liveWpmElement)
|
||||
.stop(true, true)
|
||||
.stop(true, false)
|
||||
.removeClass("hidden")
|
||||
.css("opacity", 0)
|
||||
.animate(
|
||||
|
@ -48,11 +49,13 @@ export function show(): void {
|
|||
125
|
||||
);
|
||||
}
|
||||
state = true;
|
||||
}
|
||||
|
||||
export function hide(): void {
|
||||
if (!state) return;
|
||||
$(liveWpmElement)
|
||||
.stop(true, true)
|
||||
.stop(true, false)
|
||||
.animate(
|
||||
{
|
||||
opacity: 0,
|
||||
|
@ -63,7 +66,7 @@ export function hide(): void {
|
|||
}
|
||||
);
|
||||
$(miniLiveWpmElement)
|
||||
.stop(true, true)
|
||||
.stop(true, false)
|
||||
.animate(
|
||||
{
|
||||
opacity: 0,
|
||||
|
@ -73,6 +76,7 @@ export function hide(): void {
|
|||
miniLiveWpmElement.classList.add("hidden");
|
||||
}
|
||||
);
|
||||
state = false;
|
||||
}
|
||||
|
||||
ConfigEvent.subscribe((eventKey, eventValue) => {
|
||||
|
|
Loading…
Reference in a new issue