From 0d3de604399fd22cf5df22732c8872be72067abe Mon Sep 17 00:00:00 2001
From: Kim Huebel <dg9vh@darc.de>
Date: Thu, 4 Feb 2021 18:24:29 +0000
Subject: [PATCH] METAR-decoded messages in same look&feel like names on heard
 lists.

---
 html/css/tooltip.css | 41 ++++++++++++++++++++++++++++++++++++++++-
 html/js/functions.js |  3 ++-
 html/js/version.js   |  2 +-
 3 files changed, 43 insertions(+), 3 deletions(-)

diff --git a/html/css/tooltip.css b/html/css/tooltip.css
index 0066c88..1505573 100644
--- a/html/css/tooltip.css
+++ b/html/css/tooltip.css
@@ -17,7 +17,7 @@
 
     /* Position the tooltip text */
     position: absolute;
-    z-index: 1;
+    z-index: 99;
     bottom: 125%;
     left: 50%;
     margin-left: -60px;
@@ -27,6 +27,45 @@
     transition: opacity 1s;
 }
 
+.tooltip2 .tooltiptext {
+    visibility: hidden;
+    width: 300px;
+    background-color: #555;
+    color: #fff;
+    text-align: center;
+    padding: 5px 0;
+    border-radius: 6px;
+
+    /* Position the tooltip text */
+    position: absolute;
+    z-index: 99;
+    bottom: 125%;
+    left: 50%;
+    margin-left: -60px;
+
+    /* Fade in tooltip */
+    opacity: 0;
+    transition: opacity 1s;
+}
+
+/* Tooltip arrow */
+.tooltip2 .tooltiptext::after {
+    content: "";
+    position: absolute;
+    top: 100%;
+    left: 50%;
+    margin-left: -5px;
+    border-width: 5px;
+    border-style: solid;
+    border-color: #555 transparent transparent transparent;
+}
+
+/* Show the tooltip text when you mouse over the tooltip container */
+.tooltip2:hover .tooltiptext {
+    visibility: visible;
+    opacity: 1;
+}
+
 /* Tooltip arrow */
 .tooltip2 .tooltip2text::after {
     content: "";
diff --git a/html/js/functions.js b/html/js/functions.js
index 3ee07c4..682c7a7 100644
--- a/html/js/functions.js
+++ b/html/js/functions.js
@@ -220,7 +220,8 @@ function getMessage(logline) {
 	}
 	
 	if (1062 == parseInt(getRIC(logline)) || 1063 == parseInt(getRIC(logline))) {
-		message = '<a href="#" class="tooltip-test" title="' + JSON.stringify(parseMETAR(message)).replace(/\"/g, '').replace(/,/g, ',\n') + '">' + message + '</a>';
+		//message = '<a href="#" class="tooltip-test" title="' + JSON.stringify(parseMETAR(message)).replace(/\"/g, '').replace(/,/g, ',\n') + '">' + message + '</a>';
+		message = '<div class=\"tooltip2\">' + message + '<span class=\"tooltiptext\">Decoded Message:<br>' + JSON.stringify(parseMETAR(message)).replace(/\"/g, '').replace(/,/g, ',\n') + '</span></div>';
 	}
 	return message;
 }
diff --git a/html/js/version.js b/html/js/version.js
index 3a04963..8fe8162 100644
--- a/html/js/version.js
+++ b/html/js/version.js
@@ -1 +1 @@
-var dashboard_version = "2021-02-04 12:07:19";
+var dashboard_version = "2021-02-04 18:24:29";