dbus-vis: fix errors and clean up preload.js

This change fixes two errors and does some clean-up:

1. After updating Electron to 11.5.0, "enableRemoteModule: true" is
needed for require('electron').remote to work.

2. Add handler for stderr in parsing output

Sometimes when a Malformed packet is encountered, the error message does
not get out and the parsing process gets stuck. Adding the handlers can
enable the processes to continue executing in these situations.

3. Removed the unused "preload.js" file.

4. Now clicking the time line after panning the time axis will not cause
an accidental zoom-in to an interval starting with -999.

The cause of this bug is due to HighlightedRegion.t1 being set to the
current mouse location by the OnMouseMove function. This can be
fixed by ensuring that MouseState.hoveredSide must be "timeline".

Signed-off-by: Sui Chen <suichen@google.com>
Change-Id: Ib07cf7a33591ee506ab502b206f0351063ef6eea
diff --git a/dbus-vis/boost_handler_timeline_vis.js b/dbus-vis/boost_handler_timeline_vis.js
index 63378cb..2b887e5 100644
--- a/dbus-vis/boost_handler_timeline_vis.js
+++ b/dbus-vis/boost_handler_timeline_vis.js
@@ -185,7 +185,8 @@
   const v = boost_asio_handler_timeline_view;
   v.MouseState.x = event.pageX - this.offsetLeft;
   v.MouseState.y = event.pageY - this.offsetTop;
-  if (v.MouseState.pressed == true) {  // Update highlighted area
+  if (v.MouseState.pressed == true &&
+      v.MouseState.hoveredSide == 'timeline') {  // Update highlighted area
     v.HighlightedRegion.t1 = v.MouseXToTimestamp(v.MouseState.x);
   }
   v.OnMouseMove();
@@ -194,7 +195,8 @@
   v.linked_views.forEach(function(u) {
     u.MouseState.x = event.pageX - Canvas_Asio.offsetLeft;
     u.MouseState.y = 0;                  // Do not highlight any entry
-    if (u.MouseState.pressed == true) {  // Update highlighted area
+    if (u.MouseState.pressed == true &&
+        u.MouseState.hoveredSide == 'timeline') {  // Update highlighted area
       u.HighlightedRegion.t1 = u.MouseXToTimestamp(u.MouseState.x);
     }
     u.OnMouseMove();
diff --git a/dbus-vis/dbus_pcap_loader.js b/dbus-vis/dbus_pcap_loader.js
index 729c316..adbdec0 100644
--- a/dbus-vis/dbus_pcap_loader.js
+++ b/dbus-vis/dbus_pcap_loader.js
@@ -61,6 +61,10 @@
       }
     });
 
+    dbus_pcap1.stderr.on('data', (data) => {
+      console.err(data.toString());
+    });
+
     dbus_pcap1.on('close', (code) => {
       ShowBlocker('Running dbus-pcap (Pass 2/2, packet contents) ...');
       let stdout2 = '';
@@ -90,6 +94,10 @@
         }
       });
 
+      dbus_pcap2.stderr.on('data', (data) => {
+        console.err(data.toString());
+      });
+
       dbus_pcap2.on('close', (code) => {
         { ShowBlocker('Processing dbus-pcap output ... '); }
 
diff --git a/dbus-vis/ipmi_timeline_vis.js b/dbus-vis/ipmi_timeline_vis.js
index 64af5fc..0b3aa74 100644
--- a/dbus-vis/ipmi_timeline_vis.js
+++ b/dbus-vis/ipmi_timeline_vis.js
@@ -575,7 +575,12 @@
   x: 0,
   y: 0,
   hoveredVisibleLineIndex: -999,
-  hoveredSide: undefined
+  hoveredSide: undefined,
+  IsHoveredOverHorizontalScrollbar: function() {
+    if (this.hoveredSide == "top_horizontal_scrollbar") return true;
+    else if (this.hoveredSide == "bottom_horizontal_scrollbar") return true;
+    else return false;
+  }
 };
 let Canvas = document.getElementById('my_canvas_ipmi');
 
@@ -583,7 +588,8 @@
   const v = ipmi_timeline_view;
   v.MouseState.x = event.pageX - this.offsetLeft;
   v.MouseState.y = event.pageY - this.offsetTop;
-  if (v.MouseState.pressed == true) {  // Update highlighted area
+  if (v.MouseState.pressed == true &&
+      v.MouseState.hoveredSide == 'timeline') {  // Update highlighted area
     v.HighlightedRegion.t1 = v.MouseXToTimestamp(v.MouseState.x);
   }
   v.OnMouseMove();
@@ -592,7 +598,8 @@
   v.linked_views.forEach(function(u) {
     u.MouseState.x = event.pageX - Canvas.offsetLeft;
     u.MouseState.y = 0;                  // Do not highlight any entry
-    if (u.MouseState.pressed == true) {  // Update highlighted area
+    if (u.MouseState.pressed == true &&
+        u.MouseState.hoveredSide == 'timeline') {  // Update highlighted area
       u.HighlightedRegion.t1 = u.MouseXToTimestamp(u.MouseState.x);
     }
     u.OnMouseMove();
diff --git a/dbus-vis/main.js b/dbus-vis/main.js
index b165fe6..705ce4e 100644
--- a/dbus-vis/main.js
+++ b/dbus-vis/main.js
@@ -8,9 +8,9 @@
     width: 1440,
     height: 900,
     webPreferences: {
-      preload: path.join(__dirname, 'preload.js'),
       nodeIntegration:
-          true  // For opening file dialog from the renderer process
+          true,  // For opening file dialog from the renderer process
+      enableRemoteModule: true  // For require('electron').remote
     }
   });
 
diff --git a/dbus-vis/preload.js b/dbus-vis/preload.js
deleted file mode 100644
index fe6bb56..0000000
--- a/dbus-vis/preload.js
+++ /dev/null
@@ -1,17 +0,0 @@
-// All of the Node.js APIs are available in the preload process.
-// It has the same sandbox as a Chrome extension.
-
-const dialog = require('electron').remote.dialog;  // Must add "remote"
-
-window.addEventListener('DOMContentLoaded', () => {
-  const replaceText = (selector, text) => {
-    const element = document.getElementById(selector);
-    if (element) element.innerText = text;
-  };
-
-  for (const type of ['chrome', 'node', 'electron']) {
-    replaceText(`${type}-version`, process.versions[type]);
-  }
-})
-
-console.log(document.getElementById('btn_open_file'));
diff --git a/dbus-vis/timeline_view.js b/dbus-vis/timeline_view.js
index a132cb8..394dab1 100644
--- a/dbus-vis/timeline_view.js
+++ b/dbus-vis/timeline_view.js
@@ -171,6 +171,11 @@
       EndDragScrollBar: function() {
         this.drag_begin_y = undefined;
         this.drag_begin_title_start_idx = undefined;
+      },
+      IsHoveredOverHorizontalScrollbar: function() {
+        if (this.hoveredSide == "top_horizontal_scrollbar") return true;
+        else if (this.hoveredSide == "bottom_horizontal_scrollbar") return true;
+        else return false;
       }
     };
     this.ScrollBarState = {