Update pages/Vertbox.py

pages/Vertbox.py

@@ -12,9 +12,6 @@ def get_coordinate_systems():
     return {
         "EPSG:4326": "WGS 84",
         "EPSG:3857": "Web Mercator",
-        "EPSG:2154": "RGF93 / Lambert-93",
-        "EPSG:27572": "NTF (Paris) / Lambert zone II",
-        "EPSG:2056": "CH1903+ / LV95",
     }
 
 def convert_coordinates(bbox, from_crs, to_crs):
@@ -23,50 +20,66 @@ def convert_coordinates(bbox, from_crs, to_crs):
     max_x, max_y = transformer.transform(bbox[2], bbox[3])
     return [min_x, min_y, max_x, max_y]
 
-st.title("BBox Finder Clone")
+# Styles CSS pour imiter bboxfinder.com
+st.markdown("""
+<style>
+    .main {
+        padding-top: 0;
+    }
+    .stApp {
+        margin-top: -80px;
+    }
+    .css-1kyxreq {
+        justify-content: center;
+    }
+    .css-5rimss {
+        font-size: 14px;
+    }
+</style>
+""", unsafe_allow_html=True)
 
-# Création de la carte
-m = folium.Map(location=[46.8182, 8.2275], zoom_start=4)
-draw = Draw(
-    export=True,
-    position='topleft',
-    draw_options={'polyline': False, 'polygon': False, 'circle': False, 'marker': False, 'circlemarker': False},
-    edit_options={'edit': False}
-)
-draw.add_to(m)
+# Layout principal
+col1, col2 = st.columns([4, 1])
 
-# Script JavaScript pour gérer le dessin et la mise à jour des coordonnées
-m.get_root().html.add_child(folium.Element("""
-<script>
-var drawnItems = new L.FeatureGroup();
-map.addLayer(drawnItems);
+with col1:
+    # Carte
+    m = folium.Map(location=[0, 0], zoom_start=2)
+    draw = Draw(
+        export=True,
+        position='topleft',
+        draw_options={'polyline': False, 'polygon': False, 'circle': False, 'marker': False, 'circlemarker': False},
+        edit_options={'edit': False}
+    )
+    draw.add_to(m)
 
-map.on(L.Draw.Event.CREATED, function (event) {
-    drawnItems.clearLayers();
-    var layer = event.layer;
-    drawnItems.addLayer(layer);
-    var bounds = layer.getBounds();
-    var bbox = [bounds.getWest(), bounds.getSouth(), bounds.getEast(), bounds.getNorth()];
-    var bboxString = bbox.join(',');
-    
-    window.parent.postMessage({
-        type: 'streamlit:set_widget_value',
-        key: 'bbox_coords',
-        value: bboxString
-    }, '*');
-});
-</script>
-"""))
+    # Script JavaScript pour gérer le dessin et la mise à jour des coordonnées
+    m.get_root().html.add_child(folium.Element("""
+    <script>
+    var drawnItems = new L.FeatureGroup();
+    map.addLayer(drawnItems);
 
-# Layout en deux colonnes
-col1, col2 = st.columns([3, 1])
+    map.on(L.Draw.Event.CREATED, function (event) {
+        drawnItems.clearLayers();
+        var layer = event.layer;
+        drawnItems.addLayer(layer);
+        var bounds = layer.getBounds();
+        var bbox = [bounds.getWest(), bounds.getSouth(), bounds.getEast(), bounds.getNorth()];
+        var bboxString = bbox.join(',');
+        
+        window.parent.postMessage({
+            type: 'streamlit:set_widget_value',
+            key: 'bbox_coords',
+            value: bboxString
+        }, '*');
+    });
+    </script>
+    """))
 
-with col1:
     folium_static(m, width=800, height=600)
 
 with col2:
-    st.subheader("Coordonnées de la boîte")
-    bbox_coords = st.text_input("minX,minY,maxX,maxY", key="bbox_coords")
+    st.markdown("<h3 style='text-align: center;'>Coordonnées</h3>", unsafe_allow_html=True)
+    bbox_coords = st.text_input("", key="bbox_coords", label_visibility="collapsed")
     
     if bbox_coords:
         try:
@@ -74,38 +87,46 @@ with col2:
             if len(bbox) == 4:
                 coordinate_systems = get_coordinate_systems()
                 for epsg, name in coordinate_systems.items():
-                    st.text(f"{epsg} - {name}")
+                    st.markdown(f"<b>{epsg} - {name}</b>", unsafe_allow_html=True)
                     if epsg == "EPSG:4326":
                         converted_bbox = bbox
                     else:
                         converted_bbox = convert_coordinates(bbox, "EPSG:4326", epsg)
-                    result = f"  {converted_bbox[0]:.6f},{converted_bbox[1]:.6f},{converted_bbox[2]:.6f},{converted_bbox[3]:.6f}"
+                    result = f"{converted_bbox[0]:.6f},{converted_bbox[1]:.6f},{converted_bbox[2]:.6f},{converted_bbox[3]:.6f}"
                     st.code(result, language="plaintext")
-                
+                    if st.button(f"Copier {epsg}", key=f"copy_{epsg}"):
+                        st.write(f"{epsg} copié!")
+
                 # Formats supplémentaires
-                st.text("GeoJSON")
-                geojson = f"""{{
-  "type": "Feature",
-  "properties": {{}},
-  "geometry": {{
-    "type": "Polygon",
-    "coordinates": [[
-      [{bbox[0]}, {bbox[1]}],
-      [{bbox[2]}, {bbox[1]}],
-      [{bbox[2]}, {bbox[3]}],
-      [{bbox[0]}, {bbox[3]}],
-      [{bbox[0]}, {bbox[1]}]
-    ]]
-  }}
-}}"""
+                st.markdown("<b>GeoJSON</b>", unsafe_allow_html=True)
+                geojson = json.dumps({
+                    "type": "Feature",
+                    "properties": {},
+                    "geometry": {
+                        "type": "Polygon",
+                        "coordinates": [[
+                            [bbox[0], bbox[1]],
+                            [bbox[2], bbox[1]],
+                            [bbox[2], bbox[3]],
+                            [bbox[0], bbox[3]],
+                            [bbox[0], bbox[1]]
+                        ]]
+                    }
+                }, indent=2)
                 st.code(geojson, language="json")
-                
-                st.text("WKT")
+                if st.button("Copier GeoJSON"):
+                    st.write("GeoJSON copié!")
+
+                st.markdown("<b>WKT</b>", unsafe_allow_html=True)
                 wkt = f"POLYGON(({bbox[0]} {bbox[1]}, {bbox[2]} {bbox[1]}, {bbox[2]} {bbox[3]}, {bbox[0]} {bbox[3]}, {bbox[0]} {bbox[1]}))"
                 st.code(wkt, language="plaintext")
+                if st.button("Copier WKT"):
+                    st.write("WKT copié!")
+
             else:
                 st.error("Veuillez entrer 4 coordonnées séparées par des virgules.")
         except ValueError:
             st.error("Veuillez entrer des coordonnées valides (nombres séparés par des virgules).")
 
-    st.button("Copier toutes les coordonnées", on_click=lambda: st.success("Coordonnées copiées dans le presse-papier !"))
+# Footer
+st.markdown("<div style='text-align: center; color: gray;'>Créé avec Streamlit - Inspiré par bboxfinder.com</div>", unsafe_allow_html=True)