import streamlit as st
import streamlit.components.v1 as components
st.set_page_config(page_title="3D City Evolution Simulator", layout="wide")
st.title("3D City Evolution Simulator")
st.write("Watch a 3D city grow with roads, vegetation, and dynamic weather")
# Sliders for container size with initial 3:4 aspect ratio
max_width = min(1200, st.session_state.get('window_width', 1200))
max_height = min(1600, st.session_state.get('window_height', 1600))
col1, col2 = st.columns(2)
with col1:
container_width = st.slider("Container Width (px)", 300, max_width, 768, step=50)
with col2:
container_height = st.slider("Container Height (px)", 400, max_height, 1024, step=50)
html_code = f"""
3D City Evolution Simulator
City Controls
Buildings: 0
Blocks: 0
Generation: 0
"""
# Render the HTML component with dynamic size
components.html(html_code, width=container_width, height=container_height)
st.sidebar.title("3D City Evolution Simulator")
st.sidebar.write("""
## How to Play
Watch a 3D city evolve with roads, vegetation, and dynamic weather.
### Controls:
- **Evolve City**: Grow the city
- **Reset View**: Return to default view
- **Left-click + drag**: Rotate
- **Right-click + drag**: Pan
- **Scroll**: Zoom
- **Sliders**: Adjust play area size
### Features:
- 3:4 initial play area (768x1024)
- Roads connect blocks
- Trees and shrubs added each evolution
- Extended green ground with bump mapping
- Clouds and sunlight with shadows
- Buildings with horizontal attachments
""")