Fine tune bot positioning on different pages.

diffplug · Oct 10, 2023 · 09433c4 · 09433c4
1 parent 419a5f7
commit 09433c4
Showing 1 changed file with 22 additions and 7 deletions.
diff --git a/gradle/dokka/scripts/selfie.js b/gradle/dokka/scripts/selfie.js
@@ -12,28 +12,43 @@ function selfieMain() {
     function calculateBotOffset() {
         // The bottom of the selfie bot should align with the top of the first visible code block
         const codeBlocks = Array.from(main.querySelectorAll(".symbol"));
-        codeBlocks.some((cb, idx) => {
-            const box = cb.getBoundingClientRect()
-            baseBotOffset = box.top - SELFIE_BOT_HEIGHT;
-            return cb.offsetParent !== null;
+        const isFound = codeBlocks.some(function(cb) {
+            const parent = cb.parentElement;
+            const parentHasBorder = hasBorder(parent);
+            bot.style.marginRight = parentHasBorder ? "4px" : "0";
+            const element = parentHasBorder ? parent : cb;
+            baseBotOffset = element.getBoundingClientRect().top - SELFIE_BOT_HEIGHT;
+            return element.offsetParent !== null;
         })
-        bot.style.setProperty("--selfie-bot", "" + baseBotOffset - main.scrollTop + "px");
-        fadeBotIn();
+        if (isFound) {
+            bot.style.setProperty("--selfie-bot", "" + baseBotOffset - main.scrollTop + "px");
+            fadeBotIn();
+        } else {
+            hideBot();
+        }
     }
 
     function fadeBotIn() {
         bot.style.setProperty("--selfie-opacity", "1");
         bot.style.opacity = "var(--selfie-opacity)";
     }
 
+    function hideBot() {
+        bot.style.setProperty("--selfie-opacity", "0");
+    }
+
     calculateBotOffset();
 
     main.addEventListener("scroll", onContentScroll, false);
     let timeout;
     window.onresize = function(){
         clearTimeout(timeout);
-        timeout = setTimeout(calculateBotOffset, 100);
+        timeout = setTimeout(calculateBotOffset, 50);
     };
 }
 
 window.addEventListener("load", selfieMain);
+
+function hasBorder(element) {
+    return element.matches(".cover > .with-platform-tabs > .content");
+}