From: Jo-Philipp Wich 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: http://git.99rst.org/?a=commitdiff_plain;h=a7dcfbe06be893fa05fc1cfc675c774ff858e5d2;p=openwrt-luci.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 --- diff --git a/modules/luci-base/htdocs/luci-static/resources/luci.js b/modules/luci-base/htdocs/luci-static/resources/luci.js index 04c460182f..c1c1b0dd3c 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 })); },