From 118b62c979ff8af9a8f01bc5c13a9a04334ea827 Mon Sep 17 00:00:00 2001
From: TwinProduction <twin@twinnation.org>
Date: Wed, 30 Dec 2020 01:20:22 -0500
Subject: [PATCH] Revert "Revert changes that were accidentally committed" but
 default to showing status on hover

---
 static/index.html | 30 ++++++++++++++++++++++++++----
 1 file changed, 26 insertions(+), 4 deletions(-)

diff --git a/static/index.html b/static/index.html
index 9393e263..a90064d4 100644
--- a/static/index.html
+++ b/static/index.html
@@ -166,8 +166,11 @@
 	let refreshIntervalHandler = 0;
 	let userClickedStatus = false;
 
+	// TODO: make this variable configurable and persist the choice in localStorage
+	let showStatusOnHover = true;
+
 	function showTooltip(serviceName, index, element) {
-		userClickedStatus = false;
+		//userClickedStatus = false;
 		clearTimeout(timerHandler);
 		let serviceResult = serviceStatuses[serviceName].results[index];
 		$("#tooltip-timestamp").text(prettifyTimestamp(serviceResult.timestamp));
@@ -219,11 +222,30 @@
 		}
 	}
 
+	function toggleTooltip(serviceName, index, element) {
+		console.log("userClickedStatus="+userClickedStatus);
+		if (!userClickedStatus) {
+			showTooltip(serviceName, index, element);
+			userClickedStatus = true;
+		} else {
+			$("#tooltip").hide();
+			userClickedStatus = false;
+		}
+	}
+
 	function createStatusBadge(serviceStatusIndex, index, success) {
 		if (success) {
-			return "<span class='status badge badge-success' style='width: 5%' onmouseenter='showTooltip(\""+serviceStatusIndex+"\", "+index+", this)' onmouseleave='fadeTooltip()' onclick='userClickedStatus = !userClickedStatus;'>&#10003;</span>";
+			if (showStatusOnHover) {
+				return "<span class='status badge badge-success' style='width: 5%' onmouseenter='showTooltip(\"" + serviceStatusIndex + "\", " + index + ", this)' onmouseleave='fadeTooltip()' onclick='userClickedStatus = !userClickedStatus;'>&#10003;</span>";
+			} else {
+				return "<span class='status badge badge-success' style='width: 5%' onclick='toggleTooltip(\"" + serviceStatusIndex + "\", " + index + ", this)'>&#10003;</span>";
+			}
+		}
+		if (showStatusOnHover) {
+			return "<span class='status badge badge-danger' style='width: 5%' onmouseenter='showTooltip(\"" + serviceStatusIndex + "\", " + index + ", this)' onmouseleave='fadeTooltip()' onclick='userClickedStatus = !userClickedStatus;'>X</span>";
+		} else {
+			return "<span class='status badge badge-danger' style='width: 5%' onclick='toggleTooltip(\"" + serviceStatusIndex + "\", " + index + ", this)'>X</span>";
 		}
-		return "<span class='status badge badge-danger' style='width: 5%' onmouseenter='showTooltip(\""+serviceStatusIndex+"\", "+index+", this)' onmouseleave='fadeTooltip()' onclick='userClickedStatus = !userClickedStatus;'>X</span>";
 	}
 
 	function refreshStatuses() {
@@ -389,4 +411,4 @@
 	$("#refresh-rate").val(30);
 </script>
 </body>
-</html>
+</html>
\ No newline at end of file