/* gallery.js: the gallery page's own script, the chrome's half, and no
   part of the design system. It is served joined with view.js, the
   preview widget's half, as the one gallery.js every page loads
   blocking in <head>. It is Rastrillo's gallery script for the same
   chrome: the rail filter, keeping your place across a theme or
   language switch, and following a moved section's old link; and in
   place of Rastrillo's own colour toggle, a bootstrap for the scheme
   fiesta.js owns.

   Same rules as the scripts it loads beside: first-party,
   dependency-free, no network, and inert-safe: the page it enhances is
   a complete document with scripts off.

   Why it is a blocking <script> in <head> rather than a deferred one
   at the foot: two of the things it does have to happen before the
   first paint. A stored Dark applied after the body has parsed is a
   visible flash of the system scheme on every load, and the marker
   that hides the filter box and the unpainted frames has to be on the
   root before either could paint. It does no work beyond setting two
   attributes before DOMContentLoaded, so blocking on it costs one
   parse.

   The filter box is display: none until this file sets
   data-gallery-js on <html>, which is the whole of the scriptless
   story: with scripts off the control is never shown and the rail is
   a complete list of every page. A visible control that cannot do
   anything would be the misleading version. */
(function () {
  "use strict";

  var root = document.documentElement;
  root.setAttribute("data-gallery-js", "on");

  function ready(fn) {
    if (document.readyState === "loading") document.addEventListener("DOMContentLoaded", fn);
    else fn();
  }

  // The scheme, before the first paint. fiesta.js owns the choice:
  // its menu writes data-theme on <html> and, on a page that carries
  // data-rst-scheme-store="local", remembers it under fiesta-scheme.
  // It restores a stored choice itself when it runs, but it is
  // deferred, which is after the first paint, and it skips its own
  // restore, menu marking included, when data-theme is already on the
  // root. So this file, at parse time, puts the stored scheme on the
  // root; then at readiness, and again when a page comes back from
  // the back/forward cache (where the stored choice may have changed
  // since), marks every copy of the scheme menu on the page (the
  // bar's and the display settings menu's) the way fiesta.js marks
  // one: aria-current on the button whose form's scheme is the one on
  // the root, System when the root carries none. The root, not
  // storage: where storage refuses, a choice is applied but never
  // stored, and the marks follow what the page shows. view.js repaints
  // the frames from the root on pageshow.
  var KEY = "fiesta-scheme";
  var remembers = root.getAttribute("data-rst-scheme-store") === "local";

  function stored() {
    if (!remembers) return null;
    try {
      var v = localStorage.getItem(KEY);
      return v === "light" || v === "dark" ? v : null;
    } catch (e) {
      return null;
    }
  }

  function restore() {
    var s = stored();
    if (s) root.setAttribute("data-theme", s);
    else if (remembers) root.removeAttribute("data-theme");
  }

  // Not toggleAttribute: aria-current="" reads as false.
  function mark() {
    var s = root.getAttribute("data-theme") || "system";
    var menus = document.querySelectorAll("[rst-scheme]");
    for (var i = 0; i < menus.length; i++) {
      var buttons = menus[i].querySelectorAll("button");
      for (var j = 0; j < buttons.length; j++) {
        var f = buttons[j].form, v = f && f.elements.scheme && f.elements.scheme.value;
        if (v === s) buttons[j].setAttribute("aria-current", "true");
        else buttons[j].removeAttribute("aria-current");
      }
    }
  }

  if (!root.hasAttribute("data-theme")) restore();
  ready(mark);
  addEventListener("pageshow", function (event) {
    if (!event.persisted) return;
    restore();
    mark();
  });
  // A choice made in one copy of the menu marks the other copy too;
  // fiesta.js marks only the menu the form was in.
  document.addEventListener("rst-scheme", function () { requestAnimationFrame(mark); });

  // ── The nav filter ──────────────────────────────────────────────────
  //
  // The sidebar is a complete list of every page before this runs and
  // stays one if it never does: the box is display:none until
  // data-gallery-js is set, so scripts off gets the nav and no dead
  // control.
  //
  // It says nothing of its own: the one sentence it can put on screen,
  // No matches, is rendered by the page in the page's language and
  // starts out hidden, and this file only takes the attribute off it.
  ready(function () {
    var input = document.querySelector("[data-ds-filter]");
    var nav = input && document.getElementById(input.getAttribute("aria-controls"));
    if (!input || !nav) return;
    var empty = document.querySelector("[data-ds-filter-empty]");
    var sections = nav.querySelectorAll("details");

    // Folded both sides: "seccion" finds "Sección", and the rail is
    // headings in twelve languages. NFD splits a letter from its
    // accents; the range is the combining marks, and dropping them is
    // the whole of it.
    function fold(s) {
      return s.toLowerCase().normalize("NFD").replace(/[̀-ͯ]/g, "");
    }

    var links = nav.querySelectorAll("a");
    // An entry's synonyms (data-ds-terms) match beside its name, and
    // the plain page links filter like every entry, so No matches and
    // a visible Overview link never show together.
    for (var i = 0; i < links.length; i++) links[i].dsText = fold(links[i].textContent + " " + (links[i].getAttribute("data-ds-terms") || ""));
    var pages = nav.querySelectorAll(":scope > a");
    // A section's own name is searchable too: "shells" has to land
    // somewhere, and the reader typing it means the whole section.
    for (var i = 0; i < sections.length; i++) {
      var head = sections[i].querySelector("summary");
      sections[i].dsText = head ? fold(head.textContent) : "";
    }

    // What the reader had open before they typed. A query opens
    // whatever it found something in; clearing it hands the reader
    // their own arrangement back.
    var chosen = null;

    function run(query) {
      var q = fold(query.trim());
      if (q && chosen === null) {
        chosen = [];
        for (var i = 0; i < sections.length; i++) chosen.push(sections[i].open);
      }
      var found = false;
      for (var s = 0; s < sections.length; s++) {
        var section = sections[s];
        var kids = section.children;
        var shown = 0;
        // The section's own name matching stands for everything under
        // it: a reader who types "form" means the Form page, not the
        // one entry in it whose name happens to contain the word.
        var whole = !q || section.dsText.indexOf(q) >= 0;
        for (var k = 0; k < kids.length; k++) {
          var el = kids[k];
          if (el.tagName !== "A") continue;
          var hit = whole || el.dsText.indexOf(q) >= 0;
          el.hidden = !hit;
          if (hit) shown++;
        }
        section.hidden = shown === 0;
        if (shown) found = true;
        section.open = q ? shown > 0 : chosen ? chosen[s] : section.open;
      }
      for (var p = 0; p < pages.length; p++) {
        pages[p].hidden = q && pages[p].dsText.indexOf(q) < 0;
        if (q && !pages[p].hidden) found = true;
      }
      if (!q) chosen = null;
      if (empty) empty.hidden = !q || found;
    }

    input.addEventListener("input", function () {
      run(input.value);
    });

    // Escape clears a query that is there and is left alone when there
    // is not, so the key still belongs to whatever is around the box.
    // Focus never moves: nothing here touches it.
    input.addEventListener("keydown", function (event) {
      if (event.key !== "Escape" || input.value === "") return;
      event.preventDefault();
      input.value = "";
      run("");
    });

    // A back-navigation restores the box with a value already in it:
    // filter to what it says, not to what the page was rendered saying.
    if (input.value) run(input.value);
  });

  // ── Keeping your place ──────────────────────────────────────────────
  //
  // A theme or language link, in the pinned bar or in the phone's
  // display settings menu, carries the section being read, worked out
  // at the click; the address bar is never rewritten.
  //  1. A fragment this document put in place, while its target has not
  //     moved (2px): the case geometry cannot answer, the last section
  //     of a page that clamps, or a glyph in a row of icons sharing a
  //     top.
  //  2. Else the anchor at the reading line (the scroll padding plus a
  //     pixel, where a fragment lands): the greatest top at or above
  //     it, first in document order.
  //  3. Above every anchor, nothing.
  // The rule-1 record is written only when this document scrolls to a
  // target: at load on a fresh, untouched navigation (redoing the
  // parser's scroll, which late layout may have moved), and a frame
  // after a plain, uncancelled click on a fragment link here, the only
  // signal when that fragment is already in the address. History drops
  // it, because Back restores where the reader had scrolled.
  var record = null, touched = false;

  function anchor(id) {
    var el = id && document.getElementById(id);
    return el && el.hasAttribute("data-ds-anchor") ? el : null;
  }

  function fragment(hash) {
    try {
      return decodeURIComponent(hash.slice(1));
    } catch (e) {
      return hash.slice(1);
    }
  }

  function keep(el) {
    record = { id: el.id, top: el.getBoundingClientRect().top };
  }

  ["wheel", "touchstart", "pointerdown", "keydown"].forEach(function (type) {
    addEventListener(type, function () { touched = true; }, { capture: true, passive: true });
  });

  addEventListener("load", function () {
    var nav = performance.getEntriesByType("navigation")[0], el = anchor(fragment(location.hash));
    if (!el || touched || !nav || nav.type !== "navigate") return;
    el.scrollIntoView({ block: "start" });
    requestAnimationFrame(function () { keep(el); });
  });

  document.addEventListener("click", function (event) {
    var a = event.target.closest && event.target.closest("a[href]"), el = a && anchor(fragment(a.hash));
    if (!el || event.button || event.ctrlKey || event.metaKey || event.shiftKey || event.altKey || a.target || a.hasAttribute("download") ||
        a.origin + a.pathname + a.search !== location.origin + location.pathname + location.search) return;
    requestAnimationFrame(function () {
      if (!event.defaultPrevented) keep(el);
    });
  });

  addEventListener("popstate", function () { record = null; });
  if (window.navigation) navigation.addEventListener("navigate", function (event) {
    if (event.navigationType === "traverse") record = null;
  });

  function place() {
    var el = record && fragment(location.hash) === record.id && anchor(record.id);
    if (el && Math.abs(el.getBoundingClientRect().top - record.top) <= 2) return el.id;
    var line = (parseFloat(getComputedStyle(root).scrollPaddingBlockStart) || 0) + 1;
    var all = document.querySelectorAll("[data-ds-anchor]"), best = "", top = -Infinity;
    for (var i = 0; i < all.length; i++) {
      var r = all[i].getBoundingClientRect();
      if ((r.width || r.height) && r.top <= line && r.top > top) {
        best = all[i].id;
        top = r.top;
      }
    }
    return best;
  }

  // A link's address is restored by a timer scheduled before it is
  // changed, so nothing failing between can leave it set. Not a
  // microtask: that checkpoint comes before activation reads href.
  // Again on pageshow, for a page back from the cache whose timer never
  // ran.
  ready(function () {
    var links = document.querySelectorAll(".ds-top__controls a[href], .ds-prefs a[href]");
    if (!links.length) return;
    for (var i = 0; i < links.length; i++) links[i].dsHref = links[i].getAttribute("href");
    function canonical() {
      for (var i = 0; i < links.length; i++) links[i].setAttribute("href", links[i].dsHref);
    }
    addEventListener("pageshow", canonical);
    document.addEventListener("click", function (event) {
      var a = event.target.closest && event.target.closest("a[href]"), id;
      if (!a || a.dsHref === undefined) return;
      setTimeout(canonical, 0);
      if ((id = place())) a.setAttribute("href", a.dsHref + "#" + encodeURIComponent(id));
    });
  });

  // ── A section that moved pages ──────────────────────────────────────
  //
  // A fragment naming nothing here that the rail links on another
  // page: the section moved, and the old link in a bookmark or a search
  // result is followed to where it went. The rail is the lookup, so no
  // page keeps a list and the next move works the same way. Two
  // lookups: Rastrillo's, a rail link whose fragment is the one asked
  // for; and Fiesta's own, a rail link whose page stem is the fragment,
  // since part 3 kept every example on one page under its name
  // (index.html#button is button.html now). Only a fragment with no
  // element at all is looked up, so a hash that is on the page is left
  // alone; only a link to another path is followed, so a page can
  // never send a reader to itself; a link that opens a new tab is not
  // followed in this one; and the address is replaced, so Back does
  // not return to a page that would send them on again. On hashchange
  // as well as at readiness: a reader already on the page who opens
  // the old link changes only the fragment, and nothing is loaded.
  function moved() {
    var id = fragment(location.hash), nav = id && !document.getElementById(id) && document.getElementById("ds-nav");
    var links = nav ? nav.querySelectorAll("a[href]") : [];
    for (var i = 0; i < links.length; i++) {
      var a = links[i];
      if (a.target || a.pathname === location.pathname) continue;
      var stem = a.pathname.slice(a.pathname.lastIndexOf("/") + 1);
      if (fragment(a.hash) === id || (!a.hash && stem === id + ".html")) {
        location.replace(a.href);
        return;
      }
    }
  }
  ready(moved);
  addEventListener("hashchange", moved);
})();