From: Jo-Philipp Wich <jo@mein.io>
Date: Fri, 7 Dec 2018 16:57:45 +0000 (+0100)
Subject: luci-base: luci.js: emit custom events for tooltip open/close actions
X-Git-Url: https://git.librecmc.org/?a=commitdiff_plain;h=a7dcfbe06be893fa05fc1cfc675c774ff858e5d2;p=oweals%2Fluci.git

luci-base: luci.js: emit custom events for tooltip open/close actions

The new `tooltip-open` and `tooltip-close` events allow other code to hook
into the tooltip div rendering, e.g. to populate it with custom markup.

Also ignore tooltip events originating from descendant elements while
we're at it.

Signed-off-by: Jo-Philipp Wich <jo@mein.io>
---

diff --git a/modules/luci-base/htdocs/luci-static/resources/luci.js b/modules/luci-base/htdocs/luci-static/resources/luci.js
index 04c460182..c1c1b0dd3 100644
--- a/modules/luci-base/htdocs/luci-static/resources/luci.js
+++ b/modules/luci-base/htdocs/luci-static/resources/luci.js
@@ -129,10 +129,16 @@
 			tooltipDiv.style.top = y + 'px';
 			tooltipDiv.style.left = x + 'px';
 			tooltipDiv.style.opacity = 1;
+
+			tooltipDiv.dispatchEvent(new CustomEvent('tooltip-open', {
+				bubbles: true,
+				detail: { target: target }
+			}));
 		},
 
 		hideTooltip: function(ev) {
-			if (ev.target === tooltipDiv || ev.relatedTarget === tooltipDiv)
+			if (ev.target === tooltipDiv || ev.relatedTarget === tooltipDiv ||
+			    tooltipDiv.contains(ev.target) || tooltipDiv.contains(ev.relatedTarget))
 				return;
 
 			if (tooltipTimeout !== null) {
@@ -142,6 +148,8 @@
 
 			tooltipDiv.style.opacity = 0;
 			tooltipTimeout = window.setTimeout(function() { tooltipDiv.removeAttribute('style'); }, 250);
+
+			tooltipDiv.dispatchEvent(new CustomEvent('tooltip-close', { bubbles: true }));
 		},