Add popup for low level metrics (#101)

Signed-off-by: coleramos425 <colramos@amd.com>


[ROCm/rocprofiler-compute commit: e2eaebe483]

projects/rocprofiler-compute/src/omniperf_analyze/assets/layout.css

@@ -396,6 +396,18 @@ button.report:hover {
 #memchart a, #memchart a:visited { color: #fff; }
 #memchart a:hover, #memchart a:focus { color: #11ABB0; }
 
+/* ------------------------------------------------------------------ */
+/* Popup Section
+/* ------------------------------------------------------------------ */
+#popup{
+   text-align: center;
+   border: 3px solid #F06000;
+   margin: auto;
+   width: 50%;
+   padding: 10px;
+   color: white;
+}
+
 /* ------------------------------------------------------------------ */
 /* Top Stat Section
 /* ------------------------------------------------------------------ */

projects/rocprofiler-compute/src/omniperf_analyze/utils/gui.py

@@ -468,7 +468,7 @@ def build_layout(
         )
         # append roofline section
         has_roofline = os.path.isfile(path_to_dir + "/roofline.csv")
-        if (has_roofline):
+        if has_roofline:
             div_children.append(
                 get_roofline(
                     path_to_dir,
@@ -593,4 +593,17 @@ def build_layout(
                     )
                 )
 
+        # Display pop-up message if no filters are applied
+        if not (disp_filt or kernel_filter or gcd_filter):
+            div_children.append(
+                html.Section(
+                    id="popup",
+                    children=[
+                        html.Div(
+                            children="To dive deeper, use the top drop down menus to isolate particular kernel(s) or dispatch(s). You will then see the web page update with additional low-level metrics specific to the filter you've applied..",
+                        ),
+                    ],
+                )
+            )
+
         return div_children