From a7dcfbe06be893fa05fc1cfc675c774ff858e5d2 Mon Sep 17 00:00:00 2001 From: Jo-Philipp Wich Date: Fri, 7 Dec 2018 17:57:45 +0100 Subject: 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 --- modules/luci-base/htdocs/luci-static/resources/luci.js | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) 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 })); }, -- cgit v1.2.3