jekyll-dice-tray 0.5.1 → 0.6.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: d9bd0677666a51acbbbb3ca6bf5b67d1f5bb1ef638fa4ba2fc86a3ea5a0f4cc9
-  data.tar.gz: 8832cb5174a2d58f10f7aa8534a91b8865b296323d81a097e6d476422b2b1e31
+  metadata.gz: 2a26bfe4476cf5803127bbeedc4d880e33c99542f5d4b1c81b0e51a06d0ef181
+  data.tar.gz: 30a10792b7e94cf0323d54f60a14eb269cd35eed615e0796ab6c67b54debfb6b
 SHA512:
-  metadata.gz: 558222307d26787647131df280b6e35055d644a9dfe2c97b9f2ce752e5ff179a56b21b96467dcea47633b4fb6a3128536931b2a0600a2b935dabdb5946867ba7
-  data.tar.gz: 5e69d92fe00836cef6d4aa013a3f4e320cbed50e4a082a7826f8085ef4ec68b6f9a4b4d96829e4348ff95aa7ce5706e03c336fd8dd81924366343b21dd73dd1b
+  metadata.gz: 21124bf090c27e159ebdf5d1bdf547060edf559a46837cc573b4f2a11e5eb3d6905d720d4091d68a730e01f2b6da2b6f99db31ec0625967630d8aee8c6863e36
+  data.tar.gz: 0a3f664eb69e877948cbdd2a302509491b73bc81894233f9945bde69d710361f8de8cb96ece2133716e7f4398217272c1a7ab22666a9d0df3c3002107bb96a48

data/assets/jekyll-dice-tray/dice_tray.css

@@ -34,13 +34,16 @@
   border-radius: 12px;
   box-shadow: 0 18px 48px rgba(0, 0, 0, 0.22);
   overflow: hidden;
-  display: flex;
+  /* Stay collapsed until data-expanded="true". A default of flex overrides the
+     hidden attribute and paints the open tray before hydration. */
+  display: none;
   flex-direction: column;
   max-height: 360px;
 }
 
-#jekyll-dice-tray[data-expanded="false"] .jdt-body {
-  display: none;
+/* Only the pre-paint script or dice_tray.js sets this; absent means minimized. */
+#jekyll-dice-tray[data-expanded="true"] .jdt-body {
+  display: flex;
 }
 
 #jekyll-dice-tray .jdt-clue {

data/assets/jekyll-dice-tray/dice_tray.js

@@ -2,6 +2,7 @@
   "use strict";
 
   var STORAGE_PREFIX = "jekyll_dice_tray:";
+  // Also read before first paint by the inline script in HtmlRewriter.inject_tray.
   var STORAGE_EXPANDED = STORAGE_PREFIX + "expanded";
   var STORAGE_HISTORY = STORAGE_PREFIX + "history_v1";
   var STORAGE_INPUT_HISTORY = STORAGE_PREFIX + "input_history_v1";
@@ -521,15 +522,41 @@
       root.setAttribute("data-expanded", expanded ? "true" : "false");
       // Some themes override [hidden], so enforce display too.
       body.hidden = !expanded;
+      // Clear the pre-paint inline lock so the expanded stylesheet rule can show the body.
       body.style.display = expanded ? "" : "none";
       saveBool(STORAGE_EXPANDED, expanded);
       if (expanded) {
         setTimeout(function () {
           input && input.focus();
         }, 0);
+      } else if (input && document.activeElement === input) {
+        input.blur();
       }
     }
 
+    function isOtherTextEntry(node) {
+      if (!node || node === input) return false;
+      var el = node.nodeType === 1 ? node : node.parentElement;
+      if (!el) return false;
+      if (el.closest && el.closest("#jekyll-dice-tray")) return false;
+      var tag = el.tagName;
+      if (tag === "TEXTAREA") return true;
+      if (tag === "INPUT") {
+        var type = (el.getAttribute("type") || "text").toLowerCase();
+        return (
+          type !== "button" &&
+          type !== "submit" &&
+          type !== "reset" &&
+          type !== "checkbox" &&
+          type !== "radio" &&
+          type !== "file" &&
+          type !== "color" &&
+          type !== "range"
+        );
+      }
+      return !!el.isContentEditable;
+    }
+
     function renderHistory() {
       log.innerHTML = "";
       history.forEach(function (item) {
@@ -787,6 +814,15 @@
       setExpanded(!expanded);
     });
 
+    document.addEventListener("keydown", function (e) {
+      if (e.defaultPrevented || e.repeat || e.isComposing) return;
+      if (e.key !== "~" && e.key !== "`") return;
+      if (e.ctrlKey || e.metaKey || e.altKey) return;
+      if (isOtherTextEntry(e.target)) return;
+      e.preventDefault();
+      setExpanded(toggle.getAttribute("aria-expanded") !== "true");
+    });
+
     input.addEventListener("keydown", function (e) {
       if (e.key !== "Enter") return;
       var v = input.value;

data/lib/jekyll/dice_tray/html_rewriter.rb

@@ -199,18 +199,42 @@ module Jekyll
       def self.inject_tray(html, assets_path:)
         return html if html.include?('data-dice-tray-root="true"')
 
+        # Start collapsed. Inline display:none holds the body shut until the script
+        # below runs: the hidden attribute loses to author CSS (including ours), and
+        # the deferred dice_tray.js can run after first paint, which flashes the
+        # open tray on navigation. This script reads the same localStorage key as
+        # STORAGE_EXPANDED in dice_tray.js and applies it before first paint.
         tray = <<~HTML
-          <div id="jekyll-dice-tray" data-dice-tray-root="true" data-version="#{VERSION}" aria-live="polite">
+          <div id="jekyll-dice-tray" data-dice-tray-root="true" data-version="#{VERSION}" data-expanded="false" aria-live="polite">
             <div class="jdt-header">
-              <button type="button" class="jdt-toggle" aria-expanded="false" title="Toggle dice tray">Dice</button>
+              <button type="button" class="jdt-toggle" aria-expanded="false" title="Toggle dice tray (~)">Dice</button>
             </div>
-            <div class="jdt-body" hidden>
+            <div class="jdt-body" hidden style="display:none">
               <div class="jdt-clue">Type <code>1d20+5</code> or <code>/help</code>, then press Enter.</div>
               <div class="jdt-log" role="log" aria-label="Dice roll log"></div>
               <input class="jdt-input" type="text" inputmode="text" autocomplete="off" spellcheck="false"
                 placeholder="Roll: 1d6, d4, 2d8+1, /help" />
             </div>
           </div>
+          <script>
+          // Synchronous on purpose: must finish before the browser paints the tray.
+          (function () {
+            try {
+              // Keep in sync with STORAGE_EXPANDED in dice_tray.js.
+              var expanded = localStorage.getItem("jekyll_dice_tray:expanded") === "true";
+              var root = document.getElementById("jekyll-dice-tray");
+              if (!root) return;
+              root.setAttribute("data-expanded", expanded ? "true" : "false");
+              var toggle = root.querySelector(".jdt-toggle");
+              if (toggle) toggle.setAttribute("aria-expanded", expanded ? "true" : "false");
+              var body = root.querySelector(".jdt-body");
+              if (!body) return;
+              body.hidden = !expanded;
+              // Inline display wins over theme rules that override [hidden].
+              body.style.display = expanded ? "flex" : "none";
+            } catch (e) {}
+          })();
+          </script>
         HTML
 
         tags = <<~HTML

data/lib/jekyll/dice_tray/version.rb

@@ -1,6 +1,6 @@
 module Jekyll
   module DiceTray
-    VERSION = "0.5.1"
+    VERSION = "0.6.0"
   end
 end
 

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: jekyll-dice-tray
 version: !ruby/object:Gem::Version
-  version: 0.5.1
+  version: 0.6.0
 platform: ruby
 authors:
 - directsun