diff --git a/bgm/nastelbom-happy-birthday-471481.mp3 b/bgm/nastelbom-happy-birthday-471481.mp3
new file mode 100644
index 0000000..d9040c2
Binary files /dev/null and b/bgm/nastelbom-happy-birthday-471481.mp3 differ
diff --git a/index.html b/index.html
index e46dcc1..55d24e8 100644
--- a/index.html
+++ b/index.html
@@ -832,6 +832,8 @@
+
+
@@ -1334,15 +1336,50 @@
}, { passive: true });
};
+ const setupBgm = () => {
+ const bgm = document.querySelector("#bgm");
+
+ if (!bgm) {
+ return;
+ }
+
+ bgm.volume = .45;
+
+ const playBgm = () => {
+ const playPromise = bgm.play();
+
+ if (playPromise && typeof playPromise.catch === "function") {
+ playPromise.catch(() => {});
+ }
+ };
+
+ const playBgmOnce = () => {
+ playBgm();
+ window.removeEventListener("click", playBgmOnce);
+ window.removeEventListener("touchstart", playBgmOnce);
+ window.removeEventListener("wheel", playBgmOnce);
+ window.removeEventListener("keydown", playBgmOnce);
+ };
+
+ playBgm();
+
+ window.addEventListener("click", playBgmOnce, { once: true });
+ window.addEventListener("touchstart", playBgmOnce, { once: true });
+ window.addEventListener("wheel", playBgmOnce, { once: true });
+ window.addEventListener("keydown", playBgmOnce, { once: true });
+ };
+
if (document.readyState === "complete") {
setupHeroCover();
setupLightbox();
setupAosAnimations();
+ setupBgm();
} else {
window.addEventListener("load", () => {
setupHeroCover();
setupLightbox();
setupAosAnimations();
+ setupBgm();
}, { once: true });
}