Ok with this new version it works but as you click add player etc its not automatically refreshing the scene for everyone. Make some changes to track additions in session state and refactor it so as users add objjects they stay persistent in the html which is reloaded every time. Add markers in comments inside the scene on where to add objects and create a set of emoji labeled buttons that can add different shapes annotated by text input you can also submit from streamlit app to contribute to shared active aframe scene.

import streamlit as st
import streamlit.components.v1 as components
import random
import json
import os

Initialize session state

if "entities" not in st.session_state:
st.session_state.entities = []

Load the initial HTML5 app

if not os.path.exists("chofko_ecosystem.html"):
with open("chofko_ecosystem.html", "w") as f:
f.write('''

  <a-sky src="#sky"></a-sky>

  <a-plane position="0 0 -4" rotation="-90 0 0" width="100" height="100" color="#7BC8A4"></a-plane>

  <a-entity id="entities">
    <!-- ENTITY_PLACEHOLDER -->
  </a-entity>

  <a-entity id="camera" camera look-controls position="0 40 0" rotation="-90 0 0"></a-entity>
</a-scene>

<div id="score">Score: 0</div>

<div class="controls">
  <button onmousedown="startMove('left')" onmouseup="stopMove('left')" ontouchstart="startMove('left')" ontouchend="stopMove('left')">Left</button>
  <button onmousedown="startMove('right')" onmouseup="stopMove('right')" ontouchstart="startMove('right')" ontouchend="stopMove('right')">Right</button>
  <button onmousedown="startMove('up')" onmouseup="stopMove('up')" ontouchstart="startMove('up')" ontouchend="stopMove('up')">Up</button>
  <button onmousedown="startMove('down')" onmouseup="stopMove('down')" ontouchstart="startMove('down')" ontouchend="stopMove('down')">Down</button>
  <button onclick="toggleSpeed()">Toggle Speed</button>
</div>

<script>
  // ... (Include the entire JavaScript code from the original HTML file here)
  
  // Modify the createEntities function to accept new entities
  function createEntities(newEntities) {
    for (let entity of newEntities) {
      new Entity(
        entity.x,
        entity.z,
        false,
        entity.type,
        entity.gender,
        entity.radius,
        entity.text
      );
    }
  }

  // Call createEntities with the initial entities
  createEntities(JSON.parse(document.getElementById('entities').getAttribute('data-entities')));
</script>

''')

with open("chofko_ecosystem.html", "r") as f:
initial_html = f.read()

Function to add a new entity to the scene

def add_entity(entity_type, text):
new_entity = {
'x': random.uniform(-50, 50),
'z': random.uniform(-50, 50),
'type': entity_type,
'gender': random.choice(['male', 'female']),
'radius': 1,
'text': text
}
st.session_state.entities.append(new_entity)

Function to generate HTML for entities

def generate_entities_html():
entities_json = json.dumps(st.session_state.entities)
return f'<a-entity id="entities" data-entities='{entities_json}'>\n'

Streamlit app

def main():
st.set_page_config(page_title="Chofko's Diverse Ecosystem Simulator", layout="wide")
st.title("Chofko's Diverse Ecosystem Simulator")

# Add entity buttons with emojis
col1, col2, col3, col4 = st.columns(4)
with col1:
    if st.button("🟢 Add Sphere"):
        add_entity('a-sphere', "Sphere")
with col2:
    if st.button("🟥 Add Box"):
        add_entity('a-box', "Box")
with col3:
    if st.button("🔺 Add Cone"):
        add_entity('a-cone', "Cone")
with col4:
    if st.button("🛢️ Add Cylinder"):
        add_entity('a-cylinder', "Cylinder")

# Text input for custom annotation
custom_text = st.text_input("Enter custom text for the next entity:")
if st.button("➕ Add Custom Entity"):
    entity_type = random.choice(['a-sphere', 'a-box', 'a-cone', 'a-cylinder'])
    add_entity(entity_type, custom_text)

# Generate updated HTML content
updated_html = initial_html.replace("<!-- ENTITY_PLACEHOLDER -->", generate_entities_html())

# Display the HTML5 app
components.html(updated_html, height=800)

# Display current entities
st.subheader("Current Entities")
st.json(st.session_state.entities)

# Clear all entities button
if st.button("🗑️ Clear All Entities"):
    st.session_state.entities = []
    st.experimental_rerun()

if name == "main":
main()