Add description to buttons in panel app (#54)

Co-authored-by: Jean-Luc Stevens <jlrstevens@gmail.com>
holoviz · Nov 10, 2023 · 560a88f · 560a88f
1 parent 4f6d00f
commit 560a88f
Showing 1 changed file with 39 additions and 0 deletions.
diff --git a/holonote/app/panel.py b/holonote/app/panel.py
@@ -6,10 +6,13 @@
 
 import panel as pn
 import param
+from packaging.version import Version
 
 if TYPE_CHECKING:
     from holonote.annotate import Annotator
 
+PN13 = Version(pn.__version__) >= Version("1.3.0")
+
 
 class PanelWidgets:
     mapping = {
@@ -30,6 +33,8 @@ def __init__(self, annotator: Annotator, field_values: dict[str, Any] | None = N
         self._widget_apply_button = pn.widgets.Button(name="✓", width=20)
         self._widget_revert_button = pn.widgets.Button(name="↺", width=20)
         self._widget_commit_button = pn.widgets.Button(name="▲", width=20)
+        if PN13:
+            self._add_button_description()
 
         if field_values is None:
             self._fields_values = {k: "" for k in self.annotator.fields}
@@ -39,6 +44,40 @@ def __init__(self, annotator: Annotator, field_values: dict[str, Any] | None = N
 
         self._set_standard_callbacks()
 
+    def _add_button_description(self):
+        from bokeh.models import Tooltip
+        from bokeh.models.dom import HTML
+
+        html_table = """
+        <h3>Mode:</h3>
+        <table style="width:100%">
+        <tr>
+            <td style="min-width:50px">+</td>
+            <td>Add annotation</td>
+        </tr>
+        <tr>
+            <td>-</td>
+            <td>Delete annotation</td>
+        </tr>
+        <tr>
+            <td>✏</td>
+            <td>Edit annotation</td>
+        </tr>
+        </table>
+        """
+
+        self._widget_mode_group.description = Tooltip(
+            content=HTML(html_table),
+            position="bottom",
+        )
+        self._widget_apply_button.description = Tooltip(content="Apply changes", position="bottom")
+        self._widget_revert_button.description = Tooltip(
+            content="Revert changes not yet saved to database", position="bottom"
+        )
+        self._widget_commit_button.description = Tooltip(
+            content="Save to database", position="bottom"
+        )
+
     @property
     def tool_widgets(self):
         return pn.Row(