Update app.py

app.py

@@ -1,5 +1,4 @@
 import streamlit as st
-import streamlit.components.v1 as components
 import os
 import random
 import time
@@ -10,241 +9,212 @@ from pathlib import Path
 import base64
 from io import BytesIO
 
-# Initialize session state variables
-if 'game_state' not in st.session_state:
+# Fantasy name generator
+def generate_fantasy_name():
+    prefixes = ['Aer', 'Bal', 'Cal', 'Dor', 'El', 'Fae', 'Gor', 'Hel', 'Il', 'Jor', 
+                'Kal', 'Lyr', 'Mel', 'Nym', 'Oro', 'Pyr', 'Qar', 'Ryn', 'Syl', 'Tyr']
+    suffixes = ['ian', 'or', 'ion', 'us', 'ix', 'ar', 'en', 'yr', 'el', 'an',
+                'is', 'ax', 'on', 'ir', 'ex', 'az', 'er', 'eth', 'ys', 'ix']
+    return random.choice(prefixes) + random.choice(suffixes)
+
+# Initialize session state
+if 'initialized' not in st.session_state:
+    st.session_state.initialized = False
     st.session_state.game_state = {
         'players': {},
         'chat_messages': [],
         'tile_map': [],
-        'current_player': None
+        'last_sync': time.time()
     }
-
-if 'player_name' not in st.session_state:
     st.session_state.player_name = None
+    st.session_state.character_stats = None
+
+# Character Stats Generation
+def roll_stats():
+    return {
+        'STR': sum(sorted([random.randint(1, 6) for _ in range(4)])[1:]),
+        'DEX': sum(sorted([random.randint(1, 6) for _ in range(4)])[1:]),
+        'CON': sum(sorted([random.randint(1, 6) for _ in range(4)])[1:]),
+        'INT': sum(sorted([random.randint(1, 6) for _ in range(4)])[1:]),
+        'WIS': sum(sorted([random.randint(1, 6) for _ in range(4)])[1:]),
+        'CHA': sum(sorted([random.randint(1, 6) for _ in range(4)])[1:]),
+        'HP': random.randint(1, 20) * 2 + random.randint(1, 20),
+        'MAX_HP': 40,
+        'score': 0,
+        'created_at': time.time()
+    }
 
-if 'last_refresh' not in st.session_state:
-    st.session_state.last_refresh = time.time()
-
-if 'start_time' not in st.session_state:
-    st.session_state.start_time = None
-
-if 'play_duration' not in st.session_state:
-    st.session_state.play_duration = 0
-
-# Utility functions
-def load_tiles_and_text():
-    """Load tile images and their corresponding markdown text from the root directory"""
-    tiles = {}
-    for file in os.listdir('.'):
-        if file.endswith(('.png', '.jpg', '.jpeg')):
-            tile_name = os.path.splitext(file)[0]
-            # Load image
-            img = Image.open(file)
-            # Convert image to base64 for HTML embedding
-            buffered = BytesIO()
-            img.save(buffered, format="PNG")
-            img_str = base64.b64encode(buffered.getvalue()).decode()
-            
-            # Check for corresponding markdown file
-            md_file = f"{tile_name}.md"
-            overlay_text = ""
-            if os.path.exists(md_file):
-                with open(md_file, 'r') as f:
-                    overlay_text = f.read().strip()
-            
-            tiles[tile_name] = {
-                'image': img_str,
-                'text': overlay_text
-            }
-    return tiles
-
-def generate_map(width=20, height=15):
-    """Generate a random tile map"""
-    tile_types = ['grass', 'water', 'rock']
-    return [[random.choice(tile_types) for _ in range(width)] for _ in range(height)]
-
-def create_tile_html(tile_data, size=60):
-    """Create HTML for a single tile with text overlay"""
-    return f"""
-        <div style="position: relative; width: {size}px; height: {size}px; display: inline-block;">
-            <img src="data:image/png;base64,{tile_data['image']}" 
-                 style="width: {size}px; height: {size}px; object-fit: cover;">
-            <div style="position: absolute; top: 0; left: 0; right: 0; bottom: 0; 
-                        background-color: rgba(255, 255, 255, 0.7); 
-                        display: flex; align-items: center; justify-content: center;
-                        text-align: center; font-size: 10px; padding: 2px;
-                        opacity: 0.8; pointer-events: none;">
-                {tile_data['text']}
-            </div>
-        </div>
-    """
-
-def create_game_board_html(tile_map, tiles, players):
-    """Create HTML for the entire game board"""
-    board_html = """
-    <style>
-        .game-board { line-height: 0; }
-        .player-marker {
-            position: absolute;
-            width: 10px;
-            height: 10px;
-            background-color: red;
-            border-radius: 50%;
-            z-index: 2;
-        }
-    </style>
-    <div class="game-board">
-    """
+def save_character_sheet(player_name, stats):
+    """Save character sheet as markdown"""
+    filepath = f"characters/{player_name}.md"
+    os.makedirs('characters', exist_ok=True)
     
-    for y, row in enumerate(tile_map):
-        for x, tile_type in enumerate(row):
-            if tile_type in tiles:
-                board_html += create_tile_html(tiles[tile_type])
-        board_html += "<br>"
+    markdown = f"""# {player_name}'s Character Sheet
     
-    # Add player markers
-    for player_name, player_data in players.items():
-        pos_x = player_data['position']['x'] * 60 + 25
-        pos_y = player_data['position']['y'] * 60 + 25
-        board_html += f"""
-            <div class="player-marker" style="left: {pos_x}px; top: {pos_y}px;"
-                 title="{player_name}"></div>
-        """
+## Stats
+- **STR**: {stats['STR']}
+- **DEX**: {stats['DEX']}
+- **CON**: {stats['CON']}
+- **INT**: {stats['INT']}
+- **WIS**: {stats['WIS']}
+- **CHA**: {stats['CHA']}
+
+## Health
+HP: {stats['HP']}/{stats['MAX_HP']}
+
+## Score
+Current Score: {stats['score']}
+
+## Session Info
+Created: {datetime.fromtimestamp(stats['created_at']).strftime('%Y-%m-%d %H:%M:%S')}
+Last Updated: {datetime.now().strftime('%Y-%m-%d %H:%M:%S')}
+"""
     
-    board_html += "</div>"
-    return board_html
-
-def save_game_state():
-    """Save the current game state to a file"""
-    state_file = Path("game_state.json")
-    state_to_save = {
-        'players': st.session_state.game_state['players'],
-        'chat_messages': st.session_state.game_state['chat_messages'],
-        'tile_map': st.session_state.game_state['tile_map']
+    with open(filepath, 'w') as f:
+        f.write(markdown)
+
+def load_character_sheet(player_name):
+    """Load character sheet if it exists"""
+    filepath = f"characters/{player_name}.md"
+    if os.path.exists(filepath):
+        with open(filepath, 'r') as f:
+            return f.read()
+    return None
+
+def create_game_js():
+    """Create JavaScript for real-time game updates"""
+    return """
+    <script>
+    const gameState = {
+        playerName: null,
+        position: { x: 0, y: 0 },
+        velocity: { x: 0, y: 0 },
+        lastUpdate: Date.now(),
+        needsSync: false
+    };
+
+    function updateClock() {
+        const now = new Date();
+        document.getElementById('game-clock').textContent = 
+            now.toLocaleTimeString();
     }
-    with open(state_file, 'w') as f:
-        json.dump(state_to_save, f)
-
-def load_game_state():
-    """Load the game state from file"""
-    state_file = Path("game_state.json")
-    if state_file.exists():
-        with open(state_file, 'r') as f:
-            loaded_state = json.load(f)
-            st.session_state.game_state.update(loaded_state)
-
-def add_chat_message(player_name, message):
-    """Add a message to the chat history"""
-    timestamp = datetime.now().strftime("%H:%M:%S")
-    st.session_state.game_state['chat_messages'].append({
-        'player': player_name,
-        'message': message,
-        'timestamp': timestamp
-    })
-    save_game_state()
-
-def format_duration(seconds):
-    """Format duration in seconds to HH:MM:SS"""
-    hours = seconds // 3600
-    minutes = (seconds % 3600) // 60
-    seconds = seconds % 60
-    return f"{int(hours):02d}:{int(minutes):02d}:{int(seconds):02d}"
-
-def check_auto_refresh():
-    """Check if it's time to refresh the page"""
-    current_time = time.time()
-    if current_time - st.session_state.last_refresh >= 5:
-        st.session_state.last_refresh = current_time
-        st.rerun()
-
-def update_play_duration():
-    """Update the player's total play duration"""
-    if st.session_state.start_time is not None:
-        current_time = time.time()
-        st.session_state.play_duration = int(current_time - st.session_state.start_time)
-
-# Main game UI
-def main():
-    st.title("Multiplayer Tile Game")
-    
-    if st.session_state.player_name is None:
-        with st.form("join_game"):
-            player_name = st.text_input("Enter your name:")
-            submitted = st.form_submit_button("Join Game")
-            if submitted and player_name:
-                st.session_state.player_name = player_name
-                st.session_state.start_time = time.time()
-                st.session_state.play_duration = 0
-                st.session_state.game_state['players'][player_name] = {
-                    'position': {'x': 0, 'y': 0},
-                    'last_active': time.time(),
-                    'score': 0
-                }
-                st.rerun()
-    
-    else:
-        update_play_duration()
-        st.sidebar.metric("Play Time", format_duration(st.session_state.play_duration))
+
+    function handleMovement(e) {
+        const speed = 5;
+        switch(e.key.toLowerCase()) {
+            case 'w': case 'arrowup':
+                gameState.velocity.y = -speed;
+                break;
+            case 's': case 'arrowdown':
+                gameState.velocity.y = speed;
+                break;
+            case 'a': case 'arrowleft':
+                gameState.velocity.x = -speed;
+                break;
+            case 'd': case 'arrowright':
+                gameState.velocity.x = speed;
+                break;
+            case 'x':
+                gameState.velocity = { x: 0, y: 0 };
+                break;
+        }
+        gameState.needsSync = true;
+    }
+
+    function updatePosition() {
+        const now = Date.now();
+        const delta = (now - gameState.lastUpdate) / 1000;
         
-        col1, col2 = st.columns([2, 1])
+        gameState.position.x += gameState.velocity.x * delta;
+        gameState.position.y += gameState.velocity.y * delta;
         
-        with col1:
-            st.subheader("Game Map")
-            if not st.session_state.game_state['tile_map']:
-                st.session_state.game_state['tile_map'] = generate_map()
-            
-            tiles = load_tiles_and_text()
-            if tiles:
-                # Generate and display the game board
-                board_html = create_game_board_html(
-                    st.session_state.game_state['tile_map'],
-                    tiles,
-                    st.session_state.game_state['players']
-                )
-                components.html(board_html, height=600)
-                
-                # Movement controls
-                if st.session_state.player_name:
-                    player = st.session_state.game_state['players'][st.session_state.player_name]
-                    
-                    cols = st.columns(4)
-                    if cols[0].button("←"):
-                        player['position']['x'] = max(0, player['position']['x'] - 1)
-                    if cols[1].button("↑"):
-                        player['position']['y'] = max(0, player['position']['y'] - 1)
-                    if cols[2].button("↓"):
-                        player['position']['y'] = min(14, player['position']['y'] + 1)
-                    if cols[3].button("→"):
-                        player['position']['x'] = min(19, player['position']['x'] + 1)
-                
-                st.write(f"Position: ({player['position']['x']}, {player['position']['y']})")
-            else:
-                st.warning("No image files found. Please add .png files and optional .md files with matching names.")
+        // Boundary checks
+        gameState.position.x = Math.max(0, Math.min(gameState.position.x, 19));
+        gameState.position.y = Math.max(0, Math.min(gameState.position.y, 14));
         
-        with col2:
-            st.subheader("Chat Room")
-            chat_container = st.container()
-            with chat_container:
-                for message in st.session_state.game_state['chat_messages'][-50:]:
-                    st.text(f"[{message['timestamp']}] {message['player']}: {message['message']}")
-            
-            with st.form("chat_form", clear_on_submit=True):
-                message = st.text_input("Message:")
-                if st.form_submit_button("Send") and message:
-                    add_chat_message(st.session_state.player_name, message)
-                    st.rerun()
+        gameState.lastUpdate = now;
         
-        if st.button("Leave Game"):
-            if st.session_state.player_name in st.session_state.game_state['players']:
-                del st.session_state.game_state['players'][st.session_state.player_name]
-            st.session_state.player_name = None
-            st.session_state.start_time = None
-            st.session_state.play_duration = 0
-            save_game_state()
+        // Update player marker position
+        const marker = document.querySelector('.player-marker');
+        if (marker) {
+            marker.style.left = `${gameState.position.x * 60 + 25}px`;
+            marker.style.top = `${gameState.position.y * 60 + 25}px`;
+        }
+    }
+
+    function syncWithServer() {
+        if (gameState.needsSync) {
+            // Send position to Streamlit
+            window.parent.postMessage({
+                type: 'streamlit:sync',
+                position: gameState.position
+            }, '*');
+            gameState.needsSync = false;
+        }
+    }
+
+    // Initialize game loop
+    setInterval(updatePosition, 16);  // ~60 FPS
+    setInterval(syncWithServer, 5000);  // Sync every 5 seconds
+    setInterval(updateClock, 1000);  // Update clock every second
+
+    // Set up event listeners
+    document.addEventListener('keydown', handleMovement);
+    </script>
+    """
+
+def main():
+    # Sidebar for player info and controls
+    st.sidebar.title("Player Info")
+    
+    # Player name handling
+    if st.session_state.player_name is None:
+        default_name = generate_fantasy_name()
+        player_name = st.sidebar.text_input("Enter your name or use generated name:",
+                                          value=default_name)
+        if st.sidebar.button("Start Playing"):
+            st.session_state.player_name = player_name
+            if st.session_state.character_stats is None:
+                st.session_state.character_stats = roll_stats()
+            save_character_sheet(player_name, st.session_state.character_stats)
+            st.rerun()
+    else:
+        # Show current name and allow changes
+        new_name = st.sidebar.text_input("Your name:", 
+                                       value=st.session_state.player_name)
+        if new_name != st.session_state.player_name:
+            old_name = st.session_state.player_name
+            st.session_state.player_name = new_name
+            # Rename character sheet
+            os.rename(f"characters/{old_name}.md", 
+                     f"characters/{new_name}.md")
             st.rerun()
         
-        check_auto_refresh()
+        # Display character sheet
+        character_sheet = load_character_sheet(st.session_state.player_name)
+        if character_sheet:
+            st.sidebar.markdown(character_sheet)
+        
+        # Movement controls with emojis
+        st.sidebar.markdown("### Movement Controls")
+        move_cols = st.sidebar.columns(3)
+        move_cols[1].button("⬆️", key="up")
+        cols = st.sidebar.columns(3)
+        cols[0].button("⬅️", key="left")
+        cols[1].button("⬇️", key="down")
+        cols[2].button("➡️", key="right")
+        st.sidebar.button("🛑", key="stop")
+
+    # Main game area
+    st.title("Multiplayer Tile Game")
+    
+    # Game clock
+    st.markdown('<div id="game-clock" style="font-size: 24px;"></div>', 
+                unsafe_allow_html=True)
+    
+    # Game board and JavaScript
+    if st.session_state.player_name:
+        st.components.v1.html(create_game_js(), height=600)
 
 if __name__ == "__main__":
-    load_game_state()
     main()