C-Dash: Add tooltips

Change-Id: I00cf78e2e777fa96754f7b06aab02a8bf8682da5
Signed-off-by: Tibor Frank <tifrank@cisco.com>

8 files changed, 201 insertions, 101 deletions

diff --git a/csit.infra.dash/app/cdash/comparisons/comparisons.py b/csit.infra.dash/app/cdash/comparisons/comparisons.py
index 01319ada77..5700552af3 100644
--- a/csit.infra.dash/app/cdash/comparisons/comparisons.py
+++ b/csit.infra.dash/app/cdash/comparisons/comparisons.py
@@ -43,7 +43,8 @@ def init_comparisons(
     layout = Layout(
         app=dash_app,
         data_iterative=data_iterative,
-        html_layout_file=C.HTML_LAYOUT_FILE
+        html_layout_file=C.HTML_LAYOUT_FILE,
+        tooltip_file=C.TOOLTIP_FILE
     )
     dash_app.index_string = layout.html_layout
     dash_app.layout = layout.add_content()
diff --git a/csit.infra.dash/app/cdash/comparisons/layout.py b/csit.infra.dash/app/cdash/comparisons/layout.py
index 9c89a55bcb..d32542617c 100644
--- a/csit.infra.dash/app/cdash/comparisons/layout.py
+++ b/csit.infra.dash/app/cdash/comparisons/layout.py
@@ -14,6 +14,8 @@
 """Plotly Dash HTML layout override.
 """
 
+
+import logging
 import pandas as pd
 import dash_bootstrap_components as dbc
 
@@ -23,13 +25,14 @@ from dash import Input, Output, State
 from dash.exceptions import PreventUpdate
 from dash.dash_table.Format import Format, Scheme
 from ast import literal_eval
+from yaml import load, FullLoader, YAMLError
 
 from ..utils.constants import Constants as C
 from ..utils.control_panel import ControlPanel
 from ..utils.trigger import Trigger
 from ..utils.url_processing import url_decode
 from ..utils.utils import generate_options, gen_new_url, navbar_report, \
-    filter_table_data
+    filter_table_data, show_tooltip
 from .tables import comparison_table
 
 
@@ -76,7 +79,8 @@ class Layout:
             self,
             app: Flask,
             data_iterative: pd.DataFrame,
-            html_layout_file: str
+            html_layout_file: str,
+            tooltip_file: str
         ) -> None:
         """Initialization:
         - save the input parameters,
@@ -87,15 +91,19 @@ class Layout:
         :param data_iterative: Iterative data to be used in comparison tables.
         :param html_layout_file: Path and name of the file specifying the HTML
             layout of the dash application.
+        :param tooltip_file: Path and name of the yaml file specifying the
+            tooltips.
         :type app: Flask
         :type data_iterative: pandas.DataFrame
         :type html_layout_file: str
+        :type tooltip_file: str
         """
 
         # Inputs
         self._app = app
-        self._html_layout_file = html_layout_file
         self._data = data_iterative
+        self._html_layout_file = html_layout_file
+        self._tooltip_file = tooltip_file
 
         # Get structure of tests:
         tbs = dict()
@@ -166,6 +174,19 @@ class Layout:
                 f"Not possible to open the file {self._html_layout_file}\n{err}"
             )
 
+        try:
+            with open(self._tooltip_file, "r") as file_read:
+                self._tooltips = load(file_read, Loader=FullLoader)
+        except IOError as err:
+            logging.warning(
+                f"Not possible to open the file {self._tooltip_file}\n{err}"
+            )
+        except YAMLError as err:
+            logging.warning(
+                f"An error occurred while parsing the specification file "
+                f"{self._tooltip_file}\n{err}"
+            )
+
         # Callbacks:
         if self._app is not None and hasattr(self, "callbacks"):
             self.callbacks(self._app)
@@ -288,7 +309,9 @@ class Layout:
                 children=[
                     dbc.InputGroup(
                         [
-                            dbc.InputGroupText("DUT"),
+                            dbc.InputGroupText(
+                                show_tooltip(self._tooltips, "help-dut", "DUT")
+                            ),
                             dbc.Select(
                                 id={"type": "ctrl-dd", "index": "dut"},
                                 placeholder="Select a Device under Test...",
@@ -310,7 +333,11 @@ class Layout:
                 children=[
                     dbc.InputGroup(
                         [
-                            dbc.InputGroupText("CSIT and DUT Version"),
+                            dbc.InputGroupText(show_tooltip(
+                                self._tooltips,
+                                "help-csit-dut",
+                                "CSIT and DUT Version"
+                            )),
                             dbc.Select(
                                 id={"type": "ctrl-dd", "index": "dutver"},
                                 placeholder="Select a CSIT and DUT Version...")
@@ -324,7 +351,11 @@ class Layout:
                 children=[
                     dbc.InputGroup(
                         [
-                            dbc.InputGroupText("Infra"),
+                            dbc.InputGroupText(show_tooltip(
+                                self._tooltips,
+                                "help-infra",
+                                "Infra"
+                            )),
                             dbc.Select(
                                 id={"type": "ctrl-dd", "index": "infra"},
                                 placeholder=\
@@ -340,7 +371,11 @@ class Layout:
                 children=[
                     dbc.InputGroup(
                         [
-                            dbc.InputGroupText("Frame Size"),
+                            dbc.InputGroupText(show_tooltip(
+                                self._tooltips,
+                                "help-framesize",
+                                "Frame Size"
+                            )),
                             dbc.Checklist(
                                 id={"type": "ctrl-cl", "index": "frmsize"},
                                 inline=True,
@@ -357,7 +392,11 @@ class Layout:
                 children=[
                     dbc.InputGroup(
                         [
-                            dbc.InputGroupText("Number of Cores"),
+                            dbc.InputGroupText(show_tooltip(
+                                self._tooltips,
+                                "help-cores",
+                                "Number of Cores"
+                            )),
                             dbc.Checklist(
                                 id={"type": "ctrl-cl", "index": "core"},
                                 inline=True,
@@ -374,7 +413,11 @@ class Layout:
                 children=[
                     dbc.InputGroup(
                         [
-                            dbc.InputGroupText("Measurement"),
+                            dbc.InputGroupText(show_tooltip(
+                                self._tooltips,
+                                "help-measurement",
+                                "Measurement"
+                            )),
                             dbc.Checklist(
                                 id={"type": "ctrl-cl", "index": "ttype"},
                                 inline=True,
@@ -394,7 +437,11 @@ class Layout:
                 children=[
                     dbc.InputGroup(
                         [
-                            dbc.InputGroupText("Parameter"),
+                            dbc.InputGroupText(show_tooltip(
+                                self._tooltips,
+                                "help-cmp-parameter",
+                                "Parameter"
+                            )),
                             dbc.Select(
                                 id={"type": "ctrl-dd", "index": "cmpprm"},
                                 placeholder="Select a Parameter..."
@@ -409,7 +456,11 @@ class Layout:
                 children=[
                     dbc.InputGroup(
                         [
-                            dbc.InputGroupText("Value"),
+                            dbc.InputGroupText(show_tooltip(
+                                self._tooltips,
+                                "help-cmp-value",
+                                "Value"
+                            )),
                             dbc.Select(
                                 id={"type": "ctrl-dd", "index": "cmpval"},
                                 placeholder="Select a Value..."
diff --git a/csit.infra.dash/app/cdash/coverage/coverage.py b/csit.infra.dash/app/cdash/coverage/coverage.py
index 3388d48ad8..f62057d59b 100644
--- a/csit.infra.dash/app/cdash/coverage/coverage.py
+++ b/csit.infra.dash/app/cdash/coverage/coverage.py
@@ -42,7 +42,8 @@ def init_coverage(
     layout = Layout(
         app=dash_app,
         data_coverage=data_coverage,
-        html_layout_file=C.HTML_LAYOUT_FILE
+        html_layout_file=C.HTML_LAYOUT_FILE,
+        tooltip_file=C.TOOLTIP_FILE
     )
     dash_app.index_string = layout.html_layout
     dash_app.layout = layout.add_content()
diff --git a/csit.infra.dash/app/cdash/coverage/layout.py b/csit.infra.dash/app/cdash/coverage/layout.py
index 8ebda5e127..b8fa0236a5 100644
--- a/csit.infra.dash/app/cdash/coverage/layout.py
+++ b/csit.infra.dash/app/cdash/coverage/layout.py
@@ -15,6 +15,7 @@
 """
 
 
+import logging
 import pandas as pd
 import dash_bootstrap_components as dbc
 
@@ -25,11 +26,13 @@ from dash import callback_context, no_update, ALL
 from dash import Input, Output, State
 from dash.exceptions import PreventUpdate
 from ast import literal_eval
+from yaml import load, FullLoader, YAMLError
 
 from ..utils.constants import Constants as C
 from ..utils.control_panel import ControlPanel
 from ..utils.trigger import Trigger
-from ..utils.utils import label, gen_new_url, generate_options, navbar_report
+from ..utils.utils import label, gen_new_url, generate_options, navbar_report, \
+    show_tooltip
 from ..utils.url_processing import url_decode
 from .tables import coverage_tables, select_coverage_data
 
@@ -61,7 +64,8 @@ class Layout:
             self,
             app: Flask,
             data_coverage: pd.DataFrame,
-            html_layout_file: str
+            html_layout_file: str,
+            tooltip_file: str
         ) -> None:
         """Initialization:
         - save the input parameters,
@@ -71,14 +75,18 @@ class Layout:
         :param app: Flask application running the dash application.
         :param html_layout_file: Path and name of the file specifying the HTML
             layout of the dash application.
+        :param tooltip_file: Path and name of the yaml file specifying the
+            tooltips.
         :type app: Flask
         :type html_layout_file: str
+        :type tooltip_file: str
         """
 
         # Inputs
         self._app = app
-        self._html_layout_file = html_layout_file
         self._data = data_coverage
+        self._html_layout_file = html_layout_file
+        self._tooltip_file = tooltip_file
 
         # Get structure of tests:
         tbs = dict()
@@ -131,6 +139,19 @@ class Layout:
                 f"Not possible to open the file {self._html_layout_file}\n{err}"
             )
 
+        try:
+            with open(self._tooltip_file, "r") as file_read:
+                self._tooltips = load(file_read, Loader=FullLoader)
+        except IOError as err:
+            logging.warning(
+                f"Not possible to open the file {self._tooltip_file}\n{err}"
+            )
+        except YAMLError as err:
+            logging.warning(
+                f"An error occurred while parsing the specification file "
+                f"{self._tooltip_file}\n{err}"
+            )
+
         # Callbacks:
         if self._app is not None and hasattr(self, "callbacks"):
             self.callbacks(self._app)
@@ -250,7 +271,11 @@ class Layout:
                 children=[
                     dbc.InputGroup(
                         [
-                            dbc.InputGroupText("CSIT Release"),
+                            dbc.InputGroupText(show_tooltip(
+                                self._tooltips,
+                                "help-release",
+                                "CSIT Release"
+                            )),
                             dbc.Select(
                                 id={"type": "ctrl-dd", "index": "rls"},
                                 placeholder="Select a Release...",
@@ -272,7 +297,11 @@ class Layout:
                 children=[
                     dbc.InputGroup(
                         [
-                            dbc.InputGroupText("DUT"),
+                            dbc.InputGroupText(show_tooltip(
+                                self._tooltips,
+                                "help-dut",
+                                "DUT"
+                            )),
                             dbc.Select(
                                 id={"type": "ctrl-dd", "index": "dut"},
                                 placeholder="Select a Device under Test..."
@@ -287,7 +316,11 @@ class Layout:
                 children=[
                     dbc.InputGroup(
                         [
-                            dbc.InputGroupText("DUT Version"),
+                            dbc.InputGroupText(show_tooltip(
+                                self._tooltips,
+                                "help-dut-ver",
+                                "DUT Version"
+                            )),
                             dbc.Select(
                                 id={"type": "ctrl-dd", "index": "dutver"},
                                 placeholder=\
@@ -303,7 +336,11 @@ class Layout:
                 children=[
                     dbc.InputGroup(
                         [
-                            dbc.InputGroupText("Area"),
+                            dbc.InputGroupText(show_tooltip(
+                                self._tooltips,
+                                "help-area",
+                                "Area"
+                            )),
                             dbc.Select(
                                 id={"type": "ctrl-dd", "index": "area"},
                                 placeholder="Select an Area..."
@@ -318,7 +355,11 @@ class Layout:
                 children=[
                     dbc.InputGroup(
                         [
-                            dbc.InputGroupText("Infra"),
+                            dbc.InputGroupText(show_tooltip(
+                                self._tooltips,
+                                "help-infra",
+                                "Infra"
+                            )),
                             dbc.Select(
                                 id={"type": "ctrl-dd", "index": "phy"},
                                 placeholder=\
@@ -334,7 +375,11 @@ class Layout:
                 children=[
                     dbc.InputGroup(
                         [
-                            dbc.InputGroupText("Latency"),
+                            dbc.InputGroupText(show_tooltip(
+                                self._tooltips,
+                                "help-show-latency",
+                                "Latency"
+                            )),
                             dbc.Checklist(
                                 id="show-latency",
                                 options=[{
diff --git a/csit.infra.dash/app/cdash/report/layout.py b/csit.infra.dash/app/cdash/report/layout.py
index 400fd60f38..1978e7abae 100644
--- a/csit.infra.dash/app/cdash/report/layout.py
+++ b/csit.infra.dash/app/cdash/report/layout.py
@@ -354,13 +354,11 @@ class Layout:
                 children=[
                     dbc.InputGroup(
                         [
-                            dbc.InputGroupText(
-                                children=show_tooltip(
-                                    self._tooltips,
-                                    "help-release",
-                                    "CSIT Release"
-                                )
-                            ),
+                            dbc.InputGroupText(show_tooltip(
+                                self._tooltips,
+                                "help-release",
+                                "CSIT Release"
+                            )),
                             dbc.Select(
                                 id={"type": "ctrl-dd", "index": "rls"},
                                 placeholder="Select a Release...",
@@ -382,13 +380,11 @@ class Layout:
                 children=[
                     dbc.InputGroup(
                         [
-                            dbc.InputGroupText(
-                                children=show_tooltip(
-                                    self._tooltips,
-                                    "help-dut",
-                                    "DUT"
-                                )
-                            ),
+                            dbc.InputGroupText(show_tooltip(
+                                self._tooltips,
+                                "help-dut",
+                                "DUT"
+                            )),
                             dbc.Select(
                                 id={"type": "ctrl-dd", "index": "dut"},
                                 placeholder="Select a Device under Test..."
@@ -403,13 +399,11 @@ class Layout:
                 children=[
                     dbc.InputGroup(
                         [
-                            dbc.InputGroupText(
-                                children=show_tooltip(
-                                    self._tooltips,
-                                    "help-dut-ver",
-                                    "DUT Version"
-                                )
-                            ),
+                            dbc.InputGroupText(show_tooltip(
+                                self._tooltips,
+                                "help-dut-ver",
+                                "DUT Version"
+                            )),
                             dbc.Select(
                                 id={"type": "ctrl-dd", "index": "dutver"},
                                 placeholder=\
@@ -425,13 +419,11 @@ class Layout:
                 children=[
                     dbc.InputGroup(
                         [
-                            dbc.InputGroupText(
-                                children=show_tooltip(
-                                    self._tooltips,
-                                    "help-area",
-                                    "Area"
-                                )
-                            ),
+                            dbc.InputGroupText(show_tooltip(
+                                self._tooltips,
+                                "help-area",
+                                "Area"
+                            )),
                             dbc.Select(
                                 id={"type": "ctrl-dd", "index": "area"},
                                 placeholder="Select an Area..."
@@ -446,13 +438,11 @@ class Layout:
                 children=[
                     dbc.InputGroup(
                         [
-                            dbc.InputGroupText(
-                                children=show_tooltip(
-                                    self._tooltips,
-                                    "help-test",
-                                    "Test"
-                                )
-                            ),
+                            dbc.InputGroupText(show_tooltip(
+                                self._tooltips,
+                                "help-test",
+                                "Test"
+                            )),
                             dbc.Select(
                                 id={"type": "ctrl-dd", "index": "test"},
                                 placeholder="Select a Test..."
@@ -467,13 +457,11 @@ class Layout:
                 children=[
                     dbc.InputGroup(
                         [
-                            dbc.InputGroupText(
-                                children=show_tooltip(
-                                    self._tooltips,
-                                    "help-infra",
-                                    "Infra"
-                                )
-                            ),
+                            dbc.InputGroupText(show_tooltip(
+                                self._tooltips,
+                                "help-infra",
+                                "Infra"
+                            )),
                             dbc.Select(
                                 id={"type": "ctrl-dd", "index": "phy"},
                                 placeholder=\
diff --git a/csit.infra.dash/app/cdash/search/layout.py b/csit.infra.dash/app/cdash/search/layout.py
index 2c50fba352..c8035055e4 100644
--- a/csit.infra.dash/app/cdash/search/layout.py
+++ b/csit.infra.dash/app/cdash/search/layout.py
@@ -32,7 +32,8 @@ from ..utils.constants import Constants as C
 from ..utils.control_panel import ControlPanel
 from ..utils.trigger import Trigger
 from ..utils.utils import gen_new_url, generate_options, navbar_trending, \
-    filter_table_data, show_trending_graph_data, show_iterative_graph_data
+    filter_table_data, show_trending_graph_data, show_iterative_graph_data, \
+    show_tooltip
 from ..utils.url_processing import url_decode
 from .tables import search_table
 from ..coverage.tables import coverage_tables
@@ -297,7 +298,11 @@ class Layout:
                 children=[
                     dbc.InputGroup(
                         [
-                            dbc.InputGroupText("Data Type"),
+                            dbc.InputGroupText(show_tooltip(
+                                self._tooltips,
+                                "help-data-type",
+                                "Data Type"
+                            )),
                             dbc.Select(
                                 id={"type": "ctrl-dd", "index": "datatype"},
                                 placeholder="Select a Data Type...",
@@ -321,7 +326,11 @@ class Layout:
                 children=[
                     dbc.InputGroup(
                         [
-                            dbc.InputGroupText("DUT"),
+                            dbc.InputGroupText(show_tooltip(
+                                self._tooltips,
+                                "help-dut",
+                                "DUT"
+                            )),
                             dbc.Select(
                                 id={"type": "ctrl-dd", "index": "dut"},
                                 placeholder="Select a Device under Test..."
@@ -338,7 +347,11 @@ class Layout:
                 children=[
                     dbc.InputGroup(
                         [
-                            dbc.InputGroupText("Release"),
+                            dbc.InputGroupText(show_tooltip(
+                                self._tooltips,
+                                "help-release",
+                                "CSIT Release"
+                            )),
                             dbc.Select(
                                 id={"type": "ctrl-dd", "index": "release"},
                                 placeholder="Select a Release..."
diff --git a/csit.infra.dash/app/cdash/stats/layout.py b/csit.infra.dash/app/cdash/stats/layout.py
index 56b24e045a..4e7b72e06f 100644
--- a/csit.infra.dash/app/cdash/stats/layout.py
+++ b/csit.infra.dash/app/cdash/stats/layout.py
@@ -331,13 +331,11 @@ class Layout:
                 children=[
                     dbc.InputGroup(
                         [
-                            dbc.InputGroupText(
-                                children=show_tooltip(
-                                    self._tooltips,
-                                    "help-dut",
-                                    "DUT"
-                                )
-                            ),
+                            dbc.InputGroupText(show_tooltip(
+                                self._tooltips,
+                                "help-dut",
+                                "DUT"
+                            )),
                             dbc.RadioItems(
                                 id="ri-duts",
                                 inline=True,
@@ -355,13 +353,11 @@ class Layout:
                 children=[
                     dbc.InputGroup(
                         [
-                            dbc.InputGroupText(
-                                children=show_tooltip(
-                                    self._tooltips,
-                                    "help-ttype",
-                                    "Test Type"
-                                )
-                            ),
+                            dbc.InputGroupText(show_tooltip(
+                                self._tooltips,
+                                "help-ttype",
+                                "Test Type"
+                            )),
                             dbc.RadioItems(
                                 id="ri-ttypes",
                                 inline=True,
@@ -379,13 +375,11 @@ class Layout:
                 children=[
                     dbc.InputGroup(
                         [
-                            dbc.InputGroupText(
-                                children=show_tooltip(
-                                    self._tooltips,
-                                    "help-cadence",
-                                    "Cadence"
-                                )
-                            ),
+                            dbc.InputGroupText(show_tooltip(
+                                self._tooltips,
+                                "help-cadence",
+                                "Cadence"
+                            )),
                             dbc.RadioItems(
                                 id="ri-cadences",
                                 inline=True,
@@ -403,13 +397,11 @@ class Layout:
                 children=[
                     dbc.InputGroup(
                         [
-                            dbc.InputGroupText(
-                                children=show_tooltip(
-                                    self._tooltips,
-                                    "help-tbed",
-                                    "Test Bed"
-                                )
-                            ),
+                            dbc.InputGroupText(show_tooltip(
+                                self._tooltips,
+                                "help-tbed",
+                                "Test Bed"
+                            )),
                             dbc.Select(
                                 id="dd-tbeds",
                                 placeholder="Select a test bed...",
diff --git a/csit.infra.dash/app/cdash/utils/tooltips.yaml b/csit.infra.dash/app/cdash/utils/tooltips.yaml
index 476882076c..a51e9ffae4 100644
--- a/csit.infra.dash/app/cdash/utils/tooltips.yaml
+++ b/csit.infra.dash/app/cdash/utils/tooltips.yaml
@@ -1,9 +1,18 @@
 help-area:
-  The area defines a VPP packet path and lookup type.
+  The area defines a DUT packet path and lookup type.
 help-cadence:
   The cadence of the Jenkins job which runs the tests.
+help-cmp-parameter:
+  The parameter to be used for comparison.
+help-cmp-value:
+  The value of parameter to be used for comparison.
 help-cores:
   Number of cores the DUT uses during the test.
+help-csit-dut:
+  The version of CSIT (the part in front of the first hyphen) and the version of
+  Device under Test (the rest).
+help-data-type:
+  The type of collected data.
 help-download:
   Download the selected data as a csv file.
 help-dut:
@@ -19,13 +28,15 @@ help-framesize:
 help-infra:
   Infrastructure is defined by the toplology (number of nodes), processor
   architecture, NIC and driver.
+help-measurement:
+  The measured quantity in interest.
 help-normalize:
   Normalize the results to CPU frequency 2GHz. The results from AWS environment
   are not normalized as we do not know the exact value of CPU frequency.
 help-release:
   The CSIT release.
-help-summary-period:
-  Choose the number of runs for summary tables.
+help-show-latency:
+  If selected, the latency is included in tables.
 help-tbed:
   The test bed is defined by toplology (number of nodes) and processor
   architecture.
@@ -33,8 +44,6 @@ help-test:
   The test specification consists of packet encapsulation, VPP packet processing
   (packet forwarding mode and packet processing function(s)) and packet
   forwarding path.
-help-time-period:
-  Choose a time period for selected tests.
 help-ttype:
   Main measured variable.
 help-url: