monkeytypegame/monkeytype
1
1
Fork 0
mirror of https://github.com/monkeytypegame/monkeytype.git synced 2025-11-10 06:01:28 +08:00
Code Issues Projects Releases Packages Wiki Activity

fix(alerts): not being able to claim rewards

Browse source
This commit is contained in:
Miodec 2024-03-01 18:11:59 +01:00
parent 03311d8d6f
commit d0fe0f536f
2 changed files with 41 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

47
frontend/src/ts/elements/alerts.ts
View file

@ -422,27 +422,36 @@ NotificationEvent.subscribe((message, level, customTitle) => {
}
});
const modal = new AnimatedModal("alertsPopup", {
show: {
modal: {
from: {
marginRight: "-10rem",
const modal = new AnimatedModal(
"alertsPopup",
{
show: {
modal: {
from: {
marginRight: "-10rem",
},
to: {
marginRight: "0",
},
easing: "easeOutCirc",
},
to: {
marginRight: "0",
},
hide: {
modal: {
from: {
marginRight: "0",
},
to: {
marginRight: "-10rem",
},
easing: "easeInCirc",
},
easing: "easeOutCirc",
},
},
hide: {
modal: {
from: {
marginRight: "0",
},
to: {
marginRight: "-10rem",
},
easing: "easeInCirc",
},
() => {
hide();
},
});
() => {
hide();
}
);

16
frontend/src/ts/popups/animated-modal.ts
View file

@ -37,7 +37,9 @@ export default class AnimatedModal {
constructor(
wrapperId: string,
customAnimations?: ConstructorCustomAnimations
customAnimations?: ConstructorCustomAnimations,
customEscapeHandler?: (e: KeyboardEvent) => void,
customWrapperClickHandler?: (e: MouseEvent) => void
) {
if (wrapperId.startsWith("#")) {
wrapperId = wrapperId.slice(1);
@ -74,13 +76,21 @@ export default class AnimatedModal {
this.wrapperEl.addEventListener("keydown", (e) => {
if (e.key === "Escape" && isPopupVisible(this.wrapperId)) {
void this.hide();
if (customEscapeHandler) {
customEscapeHandler(e);
} else {
void this.hide();
}
}
});
this.wrapperEl.addEventListener("mousedown", (e) => {
if (e.target === this.wrapperEl) {
void this.hide();
if (customWrapperClickHandler) {
customWrapperClickHandler(e);
} else {
void this.hide();
}
}
});