[tools][system-analyzer] Hide/Display panels

This CL attempts to hide panels from the user view until
data upload event to help users read instructions more easily.

Screenshots: https://imgur.com/a/qFgIKI8

Bug: v8:10665
Change-Id: Ida666aa850b80cff3f428e1789cc92592ec79a6c
Reviewed-on: https://chromium-review.googlesource.com/c/v8/v8/+/2278474Reviewed-by: Camillo Bruni <cbruni@chromium.org>
Commit-Queue: Zeynep Cankara <zcankara@google.com>
Cr-Commit-Position: refs/heads/master@{#68738}

tools/system-analyzer/index.html

@@ -16,6 +16,7 @@ found in the LICENSE file. -->
   <script type="module" src="map-panel.mjs"></script>
   <script type="module" src="timeline-panel.mjs"></script>
   <script type="module" src="ic-panel.mjs"></script>
+
   <script src="../splaytree.js"></script>
   <script src="../codemap.js"></script>
   <script src="../csvparser.js"></script>
@@ -177,6 +178,7 @@ let stateGlobal = Object.create(null);
 function globalDataUpload(e) {
   stateGlobal.timeline = e.detail;
   if(!e.detail) return;
+  $('#container').style.display = 'block';
   // instantiate the app logic
   stateGlobal.fileData = e.detail;
   stateGlobal.state = new State('#map-panel', '#stats', '#timeline-panel');
@@ -200,6 +202,7 @@ function globalSearchBarEvent(e) {
       <log-file-reader id="log-file-reader" onchange="globalDataUpload(event)"></log-file-reader>
       <br></br>
     </section>
+    <div id="container" style="display: none;">
       <div class="stats-panel">
         <section id="stats"><h2>Stats</h2></section>
       </div>
@@ -207,6 +210,7 @@ function globalSearchBarEvent(e) {
       <map-panel id="map-panel" onclick="globalSearchBarEvent(event)"></map-panel>
       <ic-panel id="ic-panel"></ic-panel>
     </div>
+  </div>
 
   <div id="instructions">
     <h2>Instructions</h2>