{
 "cells": [
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "[![Open In Colab](https://colab.research.google.com/assets/colab-badge.svg)](https://colab.research.google.com/github/opengeos/solara-geemap/blob/main/notebooks/07_jrc.ipynb)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "# %pip install -U geemap solara"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "import ee\n",
    "import geemap\n",
    "import ipywidgets as widgets\n",
    "from IPython.display import display\n",
    "import solara\n",
    "\n",
    "\n",
    "class Map(geemap.Map):\n",
    "    def __init__(self, **kwargs):\n",
    "        super().__init__(**kwargs)\n",
    "        self.add_basemap(\"Esri.WorldImagery\")\n",
    "        self.add_ee_data()\n",
    "        self.add_buttons(add_header=True)\n",
    "\n",
    "    def add_ee_data(self):\n",
    "\n",
    "        dataset = ee.Image(\"JRC/GSW1_4/GlobalSurfaceWater\")\n",
    "        image = dataset.select([\"occurrence\"])\n",
    "        vis_params = {\n",
    "            \"min\": 0.0,\n",
    "            \"max\": 100.0,\n",
    "            \"palette\": [\"ffffff\", \"ffbbbb\", \"0000ff\"],\n",
    "        }\n",
    "        self.addLayer(image, vis_params, \"Occurrence\")\n",
    "        self.add_colorbar(\n",
    "            vis_params, label=\"Water occurrence (%)\", layer_name=\"Occurrence\"\n",
    "        )\n",
    "\n",
    "    def add_buttons(self, position=\"topright\", **kwargs):\n",
    "        padding = \"0px 5px 0px 5px\"\n",
    "        widget = widgets.VBox(layout=widgets.Layout(padding=padding))\n",
    "        layout = widgets.Layout(width=\"auto\")\n",
    "        style = {\"description_width\": \"initial\"}\n",
    "        hist_btn = widgets.Button(description=\"Occurrence\", layout=layout)\n",
    "        bar_btn = widgets.Button(description=\"Monthly history\", layout=layout)\n",
    "        reset_btn = widgets.Button(description=\"Reset\", layout=layout)\n",
    "        scale = widgets.IntSlider(\n",
    "            min=30, max=1000, value=90, description=\"Scale\", layout=layout, style=style\n",
    "        )\n",
    "        month_slider = widgets.IntRangeSlider(\n",
    "            description=\"Months\",\n",
    "            value=[5, 10],\n",
    "            min=1,\n",
    "            max=12,\n",
    "            step=1,\n",
    "            layout=layout,\n",
    "            style=style,\n",
    "        )\n",
    "        widget.children = [\n",
    "            widgets.HBox([hist_btn, bar_btn, reset_btn]),\n",
    "            month_slider,\n",
    "            scale,\n",
    "        ]\n",
    "        self.add_widget(widget, position=position, **kwargs)\n",
    "        output = widgets.Output()\n",
    "        self.add_widget(output, position=\"bottomleft\", add_header=False)\n",
    "\n",
    "        def hist_btn_click(b):\n",
    "            region = self.user_roi\n",
    "            if region is not None:\n",
    "                output.clear_output()\n",
    "                output.append_stdout(\"Computing histogram...\")\n",
    "                image = ee.Image(\"JRC/GSW1_4/GlobalSurfaceWater\").select([\"occurrence\"])\n",
    "                self.default_style = {\"cursor\": \"wait\"}\n",
    "                hist = geemap.image_histogram(\n",
    "                    image,\n",
    "                    region,\n",
    "                    scale=scale.value,\n",
    "                    height=350,\n",
    "                    width=550,\n",
    "                    x_label=\"Water Occurrence (%)\",\n",
    "                    y_label=\"Pixel Count\",\n",
    "                    layout_args={\n",
    "                        \"title\": dict(x=0.5),\n",
    "                        \"margin\": dict(l=0, r=0, t=10, b=0),\n",
    "                    },\n",
    "                    return_df=False,\n",
    "                )\n",
    "\n",
    "                with output:\n",
    "                    output.clear_output()\n",
    "                    display(hist)\n",
    "                self.default_style = {\"cursor\": \"default\"}\n",
    "            else:\n",
    "                output.clear_output()\n",
    "                with output:\n",
    "                    output.append_stdout(\"Please draw a region of interest first.\")\n",
    "\n",
    "        hist_btn.on_click(hist_btn_click)\n",
    "\n",
    "        def bar_btn_click(b):\n",
    "            region = self.user_roi\n",
    "            if region is not None:\n",
    "                self.default_style = {\"cursor\": \"wait\"}\n",
    "                output.clear_output()\n",
    "                output.append_stdout(\"Computing monthly history...\")\n",
    "                bar = geemap.jrc_hist_monthly_history(\n",
    "                    region=region,\n",
    "                    scale=scale.value,\n",
    "                    height=350,\n",
    "                    width=550,\n",
    "                    layout_args={\n",
    "                        \"title\": dict(x=0.5),\n",
    "                        \"margin\": dict(l=0, r=0, t=10, b=0),\n",
    "                    },\n",
    "                    frequency=\"month\",\n",
    "                    start_month=month_slider.value[0],\n",
    "                    end_month=month_slider.value[1],\n",
    "                    denominator=1e4,\n",
    "                    y_label=\"Area (ha)\",\n",
    "                )\n",
    "\n",
    "                with output:\n",
    "                    output.clear_output()\n",
    "                    display(bar)\n",
    "                self.default_style = {\"cursor\": \"default\"}\n",
    "            else:\n",
    "                output.clear_output()\n",
    "                with output:\n",
    "                    output.append_stdout(\"Please draw a region of interest first.\")\n",
    "\n",
    "        bar_btn.on_click(bar_btn_click)\n",
    "\n",
    "        def reset_btn_click(b):\n",
    "            self._draw_control.clear()\n",
    "            output.clear_output()\n",
    "\n",
    "        reset_btn.on_click(reset_btn_click)\n",
    "\n",
    "\n",
    "@solara.component\n",
    "def Page():\n",
    "    with solara.Column(style={\"min-width\": \"500px\"}):\n",
    "        Map.element(\n",
    "            center=[20, -0],\n",
    "            zoom=2,\n",
    "            height=\"750px\",\n",
    "            zoom_ctrl=False,\n",
    "            measure_ctrl=False,\n",
    "        )"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "Page()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": []
  }
 ],
 "metadata": {
  "kernelspec": {
   "display_name": "geo",
   "language": "python",
   "name": "python3"
  },
  "language_info": {
   "codemirror_mode": {
    "name": "ipython",
    "version": 3
   },
   "file_extension": ".py",
   "mimetype": "text/x-python",
   "name": "python",
   "nbconvert_exporter": "python",
   "pygments_lexer": "ipython3",
   "version": "3.11.8"
  }
 },
 "nbformat": 4,
 "nbformat_minor": 2
}