From 15f72dcf7bec602b979621d6c9e9c6d11617ffbb Mon Sep 17 00:00:00 2001
From: "(quasar) nebula" <qznebula@protonmail.com>
Date: Thu, 9 Nov 2023 22:35:18 -0400
Subject: client: integrate new tooltip system into external link icons

Reference code currently retained, waiting for focus and touch
support in the new tooltip system. But this commit should fully
cover all the new integration needed!
---
 src/static/client3.js | 64 +++++++++++++++++++++++++++++++++++++++++++++++++--
 1 file changed, 62 insertions(+), 2 deletions(-)

(limited to 'src')

diff --git a/src/static/client3.js b/src/static/client3.js
index acd85880..57922022 100644
--- a/src/static/client3.js
+++ b/src/static/client3.js
@@ -1502,8 +1502,67 @@ for (const info of groupContributionsTableInfo) {
 
 // Artist link icon tooltips ------------------------------
 
-// TODO: Update to clientSteps style.
+const externalIconTooltipInfo = clientInfo.externalIconTooltipInfo = {
+  hoverableLinks: null,
+  iconContainers: null,
+};
+
+function getExternalIconTooltipReferences() {
+  const info = externalIconTooltipInfo;
+
+  const spans =
+    Array.from(document.querySelectorAll('span.contribution.has-tooltip'));
+
+  info.hoverableLinks =
+    spans
+      .map(span => span.querySelector('a'));
+
+  info.iconContainers =
+    spans
+      .map(span => span.querySelector('span.icons-tooltip'));
+}
+
+function addExternalIconTooltipInternalListeners() {
+  const info = externalIconTooltipInfo;
+
+  hoverableTooltipInfo.event.whenTooltipShouldBeShown.push(({tooltip}) => {
+    if (!info.iconContainers.includes(tooltip)) return;
+    showExternalIconTooltip(tooltip);
+  });
+
+  hoverableTooltipInfo.event.whenTooltipShouldBeHidden.push(({tooltip}) => {
+    if (!info.iconContainers.includes(tooltip)) return;
+    hideExternalIconTooltip(tooltip);
+  });
+}
 
+function showExternalIconTooltip(iconContainer) {
+  iconContainer.classList.add('visible');
+  iconContainer.inert = false;
+}
+
+function hideExternalIconTooltip(iconContainer) {
+  iconContainer.classList.remove('visible');
+  iconContainer.inert = true;
+}
+
+function addExternalIconTooltipPageListeners() {
+  const info = externalIconTooltipInfo;
+
+  for (const {hoverable, tooltip} of stitchArrays({
+    hoverable: info.hoverableLinks,
+    tooltip: info.iconContainers,
+  })) {
+    registerTooltipElement(tooltip);
+    registerTooltipHoverableElement(hoverable, tooltip);
+  }
+}
+
+clientSteps.getPageReferences.push(getExternalIconTooltipReferences);
+clientSteps.addInternalListeners.push(addExternalIconTooltipInternalListeners);
+clientSteps.addPageListeners.push(addExternalIconTooltipPageListeners);
+
+/*
 const linkIconTooltipInfo =
   Array.from(document.querySelectorAll('span.contribution.has-tooltip'))
     .map(span => ({
@@ -1538,7 +1597,7 @@ for (const info of linkIconTooltipInfo) {
       return;
     }
 
-    if (focusElements.includes(document.activeElement)) {
+    if (<document.activeElement is inside tooltip>) {
       return;
     }
 
@@ -1645,6 +1704,7 @@ for (const info of linkIconTooltipInfo) {
     hide();
   });
 }
+*/
 
 // Sticky commentary sidebar ------------------------------
 
-- 
cgit 1.3.0-6-gf8a5