remove "play as boss" buttons after game starts

pages/play.py

@@ -5,7 +5,7 @@ from support.build_graph import MyGraph
 from support.database import save_game_to_db
 from support.log_manager import logger
 from support.manage_game import Game
-from support.game_settings import TEAM_MODEL_PRESETS
+from support.game_settings import TEAM_MODEL_PRESETS, JS_BTN
 from support.utils import format_messages_as_feed, generate_team_html, plot_game_board_with_guesses
 
 
@@ -474,10 +474,10 @@ with gr.Blocks(fill_width=True) as demo:
         outputs=[blue_boss_name_input]
     )
 
-    # Update send_btn.click - THIS IS YOUR MAIN QUESTION
     send_btn.click(
         fn=lambda: gr.Button(interactive=False),
-        outputs=[send_btn]
+        outputs=[send_btn],
+        js=JS_BTN
     ).then(
         fn=process_message,
         inputs=[user_input, messages_state, players_state, board_state, dropdown, guessed_words_state, chat_history_state, is_human_playing_state, turn_state, graph_instance],  # ADD graph_instance

support/game_settings.py

@@ -416,6 +416,16 @@ function initCarousel() {
 }
 """
 
+JS_BTN = """
+    () => {
+        // Hide all "Play as Boss" buttons when first message is sent
+        const bossBtns = document.querySelectorAll('.play-as-boss-btn');
+        bossBtns.forEach(btn => {
+            btn.style.display = 'none';
+        });
+    }
+"""
+
 CODENAMES_WORDS = [
     "AGENT", "AFRICA", "AIR", "ALIEN", "ALPS", "AMAZON", "AMBULANCE",
     "AMERICA", "ANGEL", "ANTARCTICA", "APPLE", "ARM", "ATLANTIS", "AUSTRALIA",

support/style/css.py

@@ -1364,13 +1364,13 @@ strong {
 
 .firework::before {
     left: 30%;
-    top: 60%;
+    top: 40%;
     animation-delay: 0s;
 }
 
 .firework::after {
     left: 70%;
-    top: 50%;
+    top: 30%;
     animation-delay: 1s;
 }