Made the cog-focused page, reorganized into more of an app framework, and updated the requirements

Dockerfile

@@ -9,10 +9,11 @@ RUN mamba install -c conda-forge leafmap geopandas localtileserver -y && \
 COPY requirements.txt .
 RUN pip install -r requirements.txt
 
-RUN mkdir ./pages
-COPY /pages ./pages
+RUN mkdir ./toy_app
+COPY /toy_app ./toy_app
 
 ENV PROJ_LIB='/opt/conda/share/proj'
+ENV PYTHONPATH "${PYTHONPATH}:/toy_app/src"
 
 USER root
 RUN chown -R ${NB_UID} ${HOME}
@@ -20,5 +21,4 @@ USER ${NB_USER}
 
 EXPOSE 8765
 
-CMD ["solara", "run", "./pages", "--host=0.0.0.0"]
-
+CMD ["solara", "run", "./toy_app/pages", "--host=0.0.0.0"]

etc/cog_test.py

@@ -0,0 +1,48 @@
+from typing import List
+from pystac_client import Client
+import leafmap
+
+# s2_url = "https://earth-search.aws.element84.com/v1/collections/sentinel-2-l2a"
+# client = Client.open(s2_url)
+#
+# s2_cols = client.get_collections()
+# cog_ids: List[str] = list()
+# for collection in s2_cols:
+#     cog_ids.append(collection.id)
+#
+# selected_cog = client.get_collection(cog_ids[1])
+# selected_cog
+esa_url = "https://services.terrascope.be/stac/"
+
+client = Client.open(esa_url)
+collections = client.get_collections()
+stac_ids: List[str] = list()
+for collection in collections:
+    stac_ids.append(collection.id)
+
+center_point = [41.633484, -70.154371]
+converted_center_point = dict(type="Point", coordinates=center_point)
+m = leafmap.Map(center=center_point, zoom=8, height="500px")
+esa_results = client.search(
+    collections=[stac_ids[15]],
+    intersects=converted_center_point,
+    max_items=12,
+    datetime="2021-01-01/2023-09-22",
+    query=["eo:cloud_cover<5"],
+)
+
+# import pystac
+#
+# lulc_url = (
+#     "https://api.impactobservatory.com/stac-aws/collections/io-10m-annual-lulc/items"
+# )
+# collections = pystac
+# print(collections)
+
+
+# import leafmap
+#
+# esa_url = "https://services.terrascope.be/stac/api/"
+#
+# m = leafmap.Map(center=[41.633484, -70.154371], zoom=8, height="500px")
+# m.add_stac_layer(esa_url)

requirements.txt

@@ -1,4 +1,6 @@
 solara
-leafmap
-pmtiles
-geopandas
+area==1.1.1
+geojson==3.1.0
+ipyleaflet==0.18.2
+ipywidgets==8.1.2
+leafmap==0.31.9

requirements.txt.bak

@@ -0,0 +1,4 @@
+solara
+leafmap
+pmtiles
+geopandas

{pages → toy_app/pages}/01_overture.py

@@ -1,8 +1,10 @@
 import leafmap
 from leafmap import pmtiles_style
+from reacton import component as component
 import solara
 import ipywidgets as widgets
 
+
 # THings to come:
 # TODO: Calculate some metrics given the area.
 # TODO: add a raster to the toy
@@ -65,7 +67,7 @@ class Map(leafmap.Map):
         print(self.user_roi)
 
 
-@solara.component
+@component
 def Page():
     with solara.Row():
         solara.Button(label="Area", on_click=Map.run_area)

toy_app/pages/03_cog.py

@@ -0,0 +1,167 @@
+from ipyleaflet import Polygon, WidgetControl
+from ipywidgets import widgets
+import leafmap
+import logging
+import solara
+from reacton import component as component
+
+from toy_app.src import map_utils
+
+log = logging.getLogger(__name__)
+
+
+# Display a cog in leafmap
+# Allow the user to draw a shape on the map
+# Retrieve the user's shape and run metrics on it
+# Used Stac to get the available collections from the 10m Annual Land Use Land Cover (9-class)
+libya_fire_url = (
+    "https://github.com/opengeos/data/releases/download/raster/Libya-2023-07-01.tif"
+)
+libya_fire_name = "Libya Fire"
+libya_layer_visible = solara.reactive("True")
+test_poly = {
+    "type": "Feature",
+    "properties": {},
+    "geometry": {
+        "type": "Polygon",
+        "coordinates": [
+            [
+                [-72.949219, 42.447781],
+                [-73.35022, 42.195969],
+                [-73.372192, 41.799983],
+                [-73.026123, 41.566142],
+                [-72.608643, 41.343825],
+                [-72.301025, 41.590797],
+                [-71.993408, 41.442726],
+                [-71.768188, 41.967659],
+                [-71.28479, 42.138968],
+                [-72.064819, 42.362603],
+                [-72.614136, 42.195969],
+                [-72.949219, 42.447781],
+            ]
+        ],
+    },
+}
+
+
+class Map(leafmap.Map):
+    """
+    This is the map which will be displayed in the solara webapp
+    """
+
+    def __init__(self, **kwargs):
+        log.warning("Starting Map init")
+        kwargs["toolbar_control"] = False
+        super().__init__(**kwargs)
+        basemap = {
+            "url": "https://mt1.google.com/vt/lyrs=s&x={x}&y={y}&z={z}",
+            "attribution": "Google",
+            "name": "Google Satellite",
+            "opacity": 1.0,
+        }
+        self.add_tile_layer(**basemap, shown=False)
+        self.add_layer_manager(opened=False)
+        self.add_cog_layer(
+            url=libya_fire_url, name=libya_fire_name
+        )  # Just display the cog for now, the layer toggle isn't working as expected
+        # self.toggle_libya_layer()
+        # user_poly = map_utils.get_user_polygon(self)
+        # if user_poly:
+        #     log.warning(f"Polygon? {user_poly}")
+        # self.add_click_detector_widget()
+        self.add_button()
+
+    def add_click_detector_widget(self, position="bottomright"):
+        output = widgets.Output()
+        control = WidgetControl(widget=output, position=position)
+        self.add(control)
+
+        def update_user_click(**kwargs):
+            with output:
+                print(kwargs)
+
+        self.on_interaction(update_user_click)
+
+    def add_button(self):
+        button = widgets.Button(description="Get ROI")
+        output = widgets.Output()
+
+        def on_button_click(_):
+            if self.user_roi is not None:
+                with output:
+                    output.clear_output()
+                    print(map_utils.calculate_area(self.user_roi))
+
+        button.on_click(on_button_click)
+
+        widget = widgets.VBox([button, output])
+        self.add_widget(widget)
+
+    def toggle_libya_layer(self):
+        if libya_layer_visible.value == "True":
+            # The layer should be visible, if you don't find it, add it
+            log.warning("Layer should be visible, checking it needs to be added")
+            for layer in self.layers:
+                l_name = layer.name
+                if l_name == libya_fire_name:
+                    return
+            else:
+                log.warning("Layer not found, adding new cog layer")
+                self.add_cog_layer(url=libya_fire_url, name=libya_fire_name)
+        else:
+            # The layer should not be visible, if you find it, remove it
+            log.warning("Layer should not be visible, checking to see if it's there")
+            for layer in self.layers:
+                l_name = layer.name
+                if l_name != libya_fire_name:
+                    continue
+                log.warning("Layer found, removing it")
+                self.remove_layer(l_name)
+
+
+zoom = solara.reactive(2)
+center = solara.reactive((20, 0))
+drawing = solara.reactive(Polygon())
+
+
+@component
+def Page():
+    l_map = Map()
+
+    # def toggle_map():
+    #     log.warning("Attempting to toggle the layer")
+    #     if libya_layer_visible.value == "True":
+    #         libya_layer_visible.set("False")
+    #     else:
+    #         libya_layer_visible.set("True")
+    #     log.warning(f"New layer visibility is set to {libya_layer_visible.value}")
+    def calc_area():
+        log.info("Trying to calculate the area")
+        # user_polygon = l_map.user_roi
+        user_polygon = drawing.value
+        log.warning(f"The polygon is: {user_polygon}")
+        log.warning(f"The user_roi is: {l_map.user_rois}")
+
+        print("Not yet implemented")
+
+    with solara.Column(style={"min_width": "500px"}):
+        # Map.element(  # type: ignore
+        l_map.element(  # type: ignore
+            zoom=zoom.value,
+            on_zoom=zoom.set,
+            center=center.value,
+            on_center=center.set,
+            scroll_wheel_zoom=True,
+            toolbar_ctrl=False,
+            draw_control=True,
+            on_draw=drawing.set,
+            # data_ctrl=False,
+            height="780px",
+        )
+        with solara.Row():
+            solara.Text(f"Center: {center.value}")
+            solara.Text(f"Zoom: {zoom.value}")
+
+    with solara.Row():
+        solara.Button(label="Calculate Polygon Area", on_click=calc_area)
+        # solara.Button(label="Toggle Fire Image", on_click=toggle_map)  # Disable toggle for now since it's not working as expected

toy_app/src/map_utils.py

@@ -0,0 +1,23 @@
+"""
+These functions are meant to manipulate and act on a given leafmap instance in solara.
+"""
+
+import logging
+import typing
+import leafmap
+import geojson
+from area import area as area
+
+
+log = logging.getLogger(__name__)
+
+
+def calculate_area(poly: geojson.GeoJSON) -> float:
+    output: float = 0.0
+    try:
+        if poly["geometry"] and poly["geometry"]["type"] == "Polgon":
+            output = area(poly["geometry"])
+    except KeyError:
+        raise TypeError("The given GeoJSON did not contain a Polygon as was expected")
+
+    return output