From 8214a0b17dd0a9fc8645230ee3a99155c37fac71 Mon Sep 17 00:00:00 2001
From: Raymond Hill <rhill@raymondhill.net>
Date: Sat, 15 Dec 2018 12:23:13 -0500
Subject: [PATCH] Improve tooltip for partyness information in logger

---
 src/css/logger-ui.css | 17 ++++++++++++++++-
 src/js/logger-ui.js   | 17 ++++++++---------
 2 files changed, 24 insertions(+), 10 deletions(-)

diff --git a/src/css/logger-ui.css b/src/css/logger-ui.css
index a2170377b..5cc760959 100644
--- a/src/css/logger-ui.css
+++ b/src/css/logger-ui.css
@@ -254,10 +254,12 @@ body #netInspector td {
     }
 #netInspector tr td:nth-of-type(5) {
     cursor: default;
+    overflow: visible !important;
     position: relative;
     text-align: center;
     }
-#netInspector tr.tab_bts td:nth-of-type(5)::after {
+/* visual for tabless network requests */
+#netInspector tr.tab_bts td:nth-of-type(5)::before {
     border: 5px solid #bbb;
     border-bottom: 0;
     border-top: 0;
@@ -270,6 +272,19 @@ body #netInspector td {
     width: calc(100% - 10px);
     z-index: -1;
     }
+/* visual for quick tooltip */
+#netInspector tr td[data-parties]:nth-of-type(5):hover::after {
+    background-color: #feb;
+    border: 1px outset #feb;
+    color: black;
+    content: attr(data-parties);
+    left: 100%;
+    padding: 0.4em 0.6em;
+    position: absolute;
+    text-align: left;
+    top: -50%;
+    white-space: pre;
+}
 #netInspector tr td:nth-of-type(6) {
     text-align: right;
     }
diff --git a/src/js/logger-ui.js b/src/js/logger-ui.js
index 96421a5d7..c45e2dffb 100644
--- a/src/js/logger-ui.js
+++ b/src/js/logger-ui.js
@@ -165,7 +165,7 @@ const createCellAt = function(tr, index) {
     }
     if ( td ) {
         td.removeAttribute('colspan');
-        td.removeAttribute('title');
+        td.removeAttribute('data-parties');
         td.textContent = '';
     } else {
         td = document.createElement('td');
@@ -186,7 +186,6 @@ var createRow = function(layout) {
         tr.removeAttribute('data-dochn');
         tr.removeAttribute('data-filter');
         tr.removeAttribute('data-tabid');
-        tr.removeAttribute('title');
     } else {
         tr = document.createElement('tr');
     }
@@ -318,14 +317,14 @@ var renderNetLogEntry = function(tr, details) {
             }
         }
         td.textContent = text;
-        text = details.domain;
-        if ( details.docDomain ) {
-            text = details.docDomain + ' \u21d2 ' + text;
+        let indent = '\t';
+        text = details.tabDomain;
+        if ( details.docDomain !== details.tabDomain ) {
+            text += ` \u21d2\n\t${details.docDomain}`;
+            indent = '\t\t';
         }
-        if ( details.tabDomain && details.tabDomain !== details.docDomain ) {
-            text = details.tabDomain + ' \u21d2 ' + text;
-        }
-        td.setAttribute('title', text);
+        text += ` \u21d2\n${indent}${details.domain}`;
+        td.setAttribute('data-parties', text);
     }
 
     tr.cells[5].textContent = (prettyRequestTypes[type] || type);