+ // Clear that className after the animation is complete
+ setTimeout(() => {
+ header.style.visibility = "hidden"
+ header.className = "";
+ }, 2200);
+ }
+ });
+
+ socket.on('state', (state) => {
+ input.value = "";
+ if (state === "game") {
+ welcome.style.visibility = "hidden";
+ game.style.visibility = "visible";
+ } else if (state === "over") {
+ game.style.visibility = "hidden";
+ over.style.visibility = "visible";
+ } else if (state === "welcome") {
+ welcome.style.visibility = "visible";
+ welcome_message.style.visibility = "visible";
+ header.style.opacity = "100%";
+ header.style.transform = "scale(1)";
+ header.style.visibility = "visible";
+ game.style.visibility = "hidden";
+ level_div.style.visibility = "hidden";
+ over.style.visibility = "hidden";