deploy: e31bb2b40e

static/scripts/tips.js

@@ -1,8 +1,4 @@
 const isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
-if (isMobile) {
-  return;
-}
-
 const body = document.querySelector('body');
 const elements = document.querySelectorAll('[data-tip]');
 const hint = document.querySelector("#headerSubtitle");
@@ -10,36 +6,11 @@ const hintPanelDefaultText = hint.innerHTML;
 let fixedHint;
 let currentObserver;
 
-elements.forEach(el => {
-  el.addEventListener('mouseenter', function() {
-    cleanup();
-    
-    if (currentObserver) {
-      currentObserver.disconnect();
-    }
-    
-    currentObserver = new IntersectionObserver((entries) => {
-      entries.forEach(entry => {
-        if (!entry.isIntersecting) {
-          fixedHint = document.createElement('p');
-          fixedHint.id = "fixedHint";
-          fixedHint.innerHTML = el.dataset.tip;
-          fixedHint.setAttribute('aria-hidden', 'true');
-          body.appendChild(fixedHint);
-        } else {
-          hint.innerHTML = el.dataset.tip;
-        }
-      })
-    });
-    
-    hint.innerHTML = el.dataset.tip;
-    currentObserver.observe(hint);
-  });
-  
-  el.addEventListener('mouseleave', function() {
-    cleanup();
-  });
-})
+if (!isMobile) {
+  elements.forEach(el => {
+    registerElementHint(el);
+  })  
+}
 
 function cleanup() {
   hint.innerHTML = hintPanelDefaultText;
@@ -52,3 +23,34 @@ function cleanup() {
     currentObserver = null;
   }
 }
+
+export function registerElementHint(el) {
+  el.addEventListener('mouseenter', function() {
+      cleanup();
+      
+      if (currentObserver) {
+        currentObserver.disconnect();
+      }
+      
+      currentObserver = new IntersectionObserver((entries) => {
+        entries.forEach(entry => {
+          if (!entry.isIntersecting) {
+            fixedHint = document.createElement('p');
+            fixedHint.id = "fixedHint";
+            fixedHint.innerHTML = el.dataset.tip;
+            fixedHint.setAttribute('aria-hidden', 'true');
+            body.appendChild(fixedHint);
+          } else {
+            hint.innerHTML = el.dataset.tip;
+          }
+        })
+      });
+      
+      hint.innerHTML = el.dataset.tip;
+      currentObserver.observe(hint);
+    });
+    
+    el.addEventListener('mouseleave', function() {
+      cleanup();
+    });
+}