import streamlit as st
import folium
from streamlit_folium import folium_static
import pandas as pd

@st.cache_resource()
def get_marker_df():
    return pd.DataFrame(columns=['Latitude', 'Longitude', 'Popup Content'])

# Create an empty DataFrame to store marker information
marker_df = pd.DataFrame(columns=['Latitude', 'Longitude', 'Popup Content'])

st.title("Interactive Map with Streamlit and Folium")

m = folium.Map(location=[21.5028, 39.2472], zoom_start=18)

# Get user input as a string
UserLocation = st.text_input("Set [Latitude, Longitude, Custom PopUp]:", '')

# Split the string into a list of values
values = UserLocation.split(",")

# Ensure that three values are entered
if len(values) == 3:

    # Assign the values to separate variables
    UserLatitude = values[0].strip()
    UserLongitude = values[1].strip()
    UserPopUp = values[2].strip()

    # Display the values
    st.write("setLatitude:", UserLatitude)
    st.write("setLongitude:", UserLongitude)
    m = folium.Map(location=[UserLatitude, UserLongitude], zoom_start=18)

    # Create a marker with a custom popup
    marker = folium.Marker(
        location=[UserLatitude, UserLongitude],
        popup=folium.Popup(UserPopUp, max_width=300),
    )

    # Add the marker to the map
    marker.add_to(m)

    # Retrieve the marker DataFrame from the cache
    marker_df = get_marker_df()

    # Append marker information to the DataFrame
    marker_df.loc[len(marker_df)] = [UserLatitude, UserLongitude, UserPopUp]


else:
    st.write("Please enter three values separated by commas.")

# Add a click event handler to the map
m.add_child(folium.ClickForMarker("${lat},${lng}<br><b>Altitude:</b> 10.00 m"))

# Display the map using folium_static
folium_static(m,width=1000, height=800)

# Display the marker table
st.write("Marker Table", marker_df)