Update app.py

app.py

@@ -17,9 +17,12 @@ VELOCITY_FACTOR = 0.5
 FRICTION = 0.98
 BOUNCE_FACTOR = -0.8
 
+# List of common names
+COMMON_NAMES = ["Emma", "Liam", "Olivia", "Noah", "Ava", "Ethan", "Sophia", "Mason", "Isabella", "William"]
+
 # Initialize session state
 if "player_name" not in st.session_state:
-    st.session_state.player_name = f"Player_{random.randint(1000, 9999)}"
+    st.session_state.player_name = random.choice(COMMON_NAMES)
 if "selected_player" not in st.session_state:
     st.session_state.selected_player = None
 if "player_color" not in st.session_state:
@@ -123,8 +126,8 @@ def generate_svg(game_state):
         svg += f'<animate attributeName="r" values="{PLAYER_SIZE // 8};{PLAYER_SIZE // 10};{PLAYER_SIZE // 8}" dur="3s" repeatCount="indefinite" />'
         svg += '</circle>'
         
-        # Player name
-        svg += f'<text x="{x}" y="{y + PLAYER_SIZE // 2 + 15}" text-anchor="middle" fill="black" font-size="12" font-weight="bold">{player[:3].upper()}</text>'
+        # Player name (full name)
+        svg += f'<text x="{x}" y="{y + PLAYER_SIZE // 2 + 15}" text-anchor="middle" fill="black" font-size="10" font-weight="bold">{player}</text>'
         
         svg += '</g>'
     
@@ -142,8 +145,10 @@ def generate_svg(game_state):
 st.set_page_config(layout="wide", page_title="Enhanced Multiplayer Grid Game")
 st.title("Enhanced Multiplayer Grid Game")
 
-# Display player name and allow updates
-col1, col2 = st.columns([3, 1])
+# Controls section
+st.markdown("### Game Controls")
+col1, col2, col3, col4, col5 = st.columns([2, 1, 1, 1, 2])
+
 with col1:
     player_name = st.text_input("Your name", value=st.session_state.player_name)
     if player_name != st.session_state.player_name:
@@ -151,7 +156,25 @@ with col1:
         update_player_position(player_name, 0, 0)
 
 with col2:
-    st.color_picker("Choose your color", value=st.session_state.player_color, key="player_color")
+    st.color_picker("Choose color", value=st.session_state.player_color, key="player_color")
+
+with col3:
+    if st.button("↑"):
+        update_player_position(st.session_state.player_name, 0, -1)
+    if st.button("↓"):
+        update_player_position(st.session_state.player_name, 0, 1)
+
+with col4:
+    col4_1, col4_2, col4_3 = st.columns(3)
+    with col4_1:
+        if st.button("←"):
+            update_player_position(st.session_state.player_name, -1, 0)
+    with col4_3:
+        if st.button("→"):
+            update_player_position(st.session_state.player_name, 1, 0)
+
+with col5:
+    st.markdown("Use WASD keys for movement")
 
 # Create grid
 grid = st.empty()
@@ -160,26 +183,21 @@ grid = st.empty()
 js_code = """
 let keyState = {};
 let lastUpdateTime = Date.now();
-
 document.addEventListener('keydown', (e) => {
     keyState[e.key.toLowerCase()] = true;
 });
-
 document.addEventListener('keyup', (e) => {
     keyState[e.key.toLowerCase()] = false;
 });
-
 function updatePlayerPosition() {
     const now = Date.now();
     const dt = (now - lastUpdateTime) / 1000;  // Time difference in seconds
     lastUpdateTime = now;
-
     let vx = 0, vy = 0;
     if (keyState['w']) vy -= 1;
     if (keyState['s']) vy += 1;
     if (keyState['a']) vx -= 1;
     if (keyState['d']) vx += 1;
-
     if (vx !== 0 || vy !== 0) {
         const magnitude = Math.sqrt(vx * vx + vy * vy);
         vx /= magnitude;
@@ -187,9 +205,7 @@ function updatePlayerPosition() {
         window.Streamlit.setComponentValue({vx: vx * dt, vy: vy * dt});
     }
 }
-
 setInterval(updatePlayerPosition, 50);  // Update every 50ms for smooth movement
-
 function movePlayer(playerId, x, y) {
     const player = document.getElementById(playerId);
     if (player) {
@@ -209,20 +225,6 @@ if "obstacles" not in game_state:
     ]
     save_game_state(game_state)
 
-# Movement buttons
-col1, col2, col3 = st.columns(3)
-with col1:
-    if st.button("↑"):
-        update_player_position(st.session_state.player_name, 0, -1)
-with col2:
-    if st.button("←"):
-        update_player_position(st.session_state.player_name, -1, 0)
-    if st.button("→"):
-        update_player_position(st.session_state.player_name, 1, 0)
-with col3:
-    if st.button("↓"):
-        update_player_position(st.session_state.player_name, 0, 1)
-
 # Main game loop
 def main():
     while True: