opencv/docs_sphinx/_templates/layout.html

{% extends "!layout.html" %}
{%- set _doxy = ('../' * ((pagename or '').count('/') + 2)) ~ 'doc/doxygen/html/' %}
{%- set _search = _doxy ~ 'search/' %}
{% block extrahead %}
{{ super() }}
<link rel="stylesheet" href="{{ _search }}search.css"/>
<script src="{{ pathto('_static/search_map.js', 1) }}"></script>
<script src="{{ _doxy }}cookie.js"></script>
<script src="{{ _search }}searchdata.js"></script>
<script src="{{ _search }}search.js"></script>
<script>
  // SearchBox lives in search.js; guard so a load failure can't abort this
  // script (which would leave the modal trigger unwired).
  var searchBox;
  try {
    searchBox = new SearchBox("searchBox", "{{ _search }}", '.html');
    // Short debounce: the top-N renderer below makes each search cheap enough
    // for live-feeling results.
    if (searchBox) searchBox.keyTimeoutLength = 120;
  } catch (e) {}

  // Open/close the centered modal. Defined early so the Ctrl+K handler can use
  // them, and kept independent of the Doxygen backend so opening always works.
  function opencvOpenSearch() {
    var ov = document.getElementById("opencvSearchOverlay");
    if (!ov) return;
    ov.classList.add("opencv-search-open");
    var f = document.getElementById("MSearchField");
    if (f) { f.focus(); f.select(); }
  }
  function opencvCloseSearch() {
    var ov = document.getElementById("opencvSearchOverlay");
    if (ov) ov.classList.remove("opencv-search-open");
    if (window.searchBox && searchBox.CloseResultsWindow) searchBox.CloseResultsWindow();
  }

  // Win Ctrl+K over the theme's deferred handler + the browser (registered
  // before the theme's, so stopImmediatePropagation pre-empts it).
  window.addEventListener("keydown", function (e) {
    if ((e.ctrlKey || e.metaKey) && !e.shiftKey && !e.altKey && /^k$/i.test(e.key)) {
      e.preventDefault();
      e.stopImmediatePropagation();
      opencvOpenSearch();
    }
  }, true);

  document.addEventListener("DOMContentLoaded", function () {
    document.querySelectorAll(".bd-links__title").forEach(function (el) {
      if (/section navigation/i.test(el.textContent)) el.textContent = "Navigation Bar";
    });

    // The theme's hamburger only opens the drawer dialog; add toggle-to-close
    // and backdrop-click-to-close.
    (function () {
      var dlg = document.getElementById("pst-primary-sidebar-modal");
      var tog = document.querySelector(".primary-toggle");
      if (!dlg || !tog) return;
      tog.addEventListener("click", function (e) {
        if (dlg.open) { e.preventDefault(); e.stopImmediatePropagation(); dlg.close(); }
      }, true);  // capture: pre-empt the theme's open-only handler when already open
      dlg.addEventListener("click", function (e) { if (e.target === dlg) dlg.close(); });
    })();

    // The theme renders navbar_end twice (desktop header + mobile drawer), so
    // the search component appears twice → duplicate #opencvSearchTrigger /
    // #opencvSearchOverlay IDs. Keep ONE overlay; wire EVERY trigger to it
    // (the visible button may be the second copy — getElementById sees only the
    // first, which is why clicking did nothing before).
    var overlays = document.querySelectorAll("#opencvSearchOverlay");
    for (var k = overlays.length - 1; k >= 1; k--) overlays[k].parentNode.removeChild(overlays[k]);
    var overlay = overlays[0];
    if (overlay && overlay.parentNode !== document.body) document.body.appendChild(overlay);

    // 1) Wire opening FIRST so the modal works even if Doxygen init throws.
    document.querySelectorAll("#opencvSearchTrigger").forEach(function (btn) {
      btn.addEventListener("click", function (e) { e.preventDefault(); opencvOpenSearch(); });
    });
    if (overlay) overlay.addEventListener("mousedown", function (e) { if (e.target === overlay) opencvCloseSearch(); });
    document.addEventListener("keydown", function (e) { if (/^Escape$/i.test(e.key)) opencvCloseSearch(); });

    // 2) Doxygen search backend (guarded: a failure must not break typing).
    try {
      var boxes = document.querySelectorAll("#MSearchBox");
      for (var i = 1; i < boxes.length; i++) boxes[i].remove();

      var sel = document.createElement("div");
      sel.id = "MSearchSelectWindow";
      sel.setAttribute("onmouseover", "return searchBox.OnSearchSelectShow()");
      sel.setAttribute("onmouseout", "return searchBox.OnSearchSelectHide()");
      sel.setAttribute("onkeydown", "return searchBox.OnSearchSelectKey(event)");
      document.body.appendChild(sel);

      var res = document.createElement("div");
      res.id = "MSearchResultsWindow";
      res.innerHTML = '<div id="MSearchResults"><div class="SRPage"><div id="SRIndex">' +
        '<div id="SRResults"></div>' +
        '<div class="SRStatus" id="Loading">Loading...</div>' +
        '<div class="SRStatus" id="Searching">Searching...</div>' +
        '<div class="SRStatus" id="NoMatches">No Matches</div></div></div></div>';
      document.body.appendChild(res);

      init_search();
      searchBox.OnSelectItem(0); // default to "All" on every page load

      // Fast results: render only the top matches from the in-memory index,
      // instead of Doxygen building/toggling all ~4000 rows every keystroke.
      try { createResults = function () {}; } catch (e) {}
      if (typeof searchResults !== "undefined" && searchResults) {
        searchResults.Search = function (q) {
          q = (q || "").replace(/^ +| +$/g, "").toLowerCase();
          var box = document.getElementById("SRResults");
          if (!box) return true;
          box.innerHTML = "";
          var data = (typeof searchData !== "undefined") ? searchData : [];
          var rp = searchBox.resultsPath, shown = 0, MAX = 40;
          function cls(el, c) { el.setAttribute("class", c); el.setAttribute("className", c); }
          for (var i = 0; i < data.length && shown < MAX; i++) {
            var el = data[i];
            if ((el[1][0] || "").replace(/<[^>]*>/g, "").toLowerCase().indexOf(q) !== 0) continue;
            var r = document.createElement("div");
            r.id = "SR_" + el[0]; cls(r, "SRResult"); r.style.display = "block";
            var e = document.createElement("div"); cls(e, "SREntry");
            var a = document.createElement("a"); a.id = "Item" + shown; cls(a, "SRSymbol");
            a.innerHTML = el[1][0]; e.appendChild(a);
            if (el[1].length === 2) {
              a.setAttribute("href", rp + el[1][1][0]);
              a.setAttribute("onclick", "searchBox.CloseResultsWindow()");
              a.setAttribute("target", el[1][1][1] ? "_parent" : "_blank");
              var sp = document.createElement("span"); cls(sp, "SRScope");
              sp.innerHTML = el[1][1][2] || ""; e.appendChild(sp);
            } else {
              a.setAttribute("href", 'javascript:searchResults.Toggle("SR_' + el[0] + '")');
              var chn = document.createElement("div"); cls(chn, "SRChildren");
              for (var c = 0; c < el[1].length - 1; c++) {
                var ca = document.createElement("a"); cls(ca, "SRScope");
                ca.setAttribute("href", rp + el[1][c + 1][0]);
                ca.setAttribute("onclick", "searchBox.CloseResultsWindow()");
                ca.setAttribute("target", el[1][c + 1][1] ? "_parent" : "_blank");
                ca.innerHTML = el[1][c + 1][2] || ""; chn.appendChild(ca);
              }
              e.appendChild(chn);
            }
            r.appendChild(e); box.appendChild(r); shown++;
          }
          var nm = document.getElementById("NoMatches"); if (nm) nm.style.display = shown ? "none" : "block";
          var ld = document.getElementById("Loading"); if (ld) ld.style.display = "none";
          var sg = document.getElementById("Searching"); if (sg) sg.style.display = "none";
          searchResults.lastMatchCount = shown;
          return true;
        };
      }

      var sphinxRoot = "{{ '../' * (pagename or '').count('/') }}";
      // Doxygen result href -> Sphinx page, or "" if that page is not in our build.
      function resolveSphinx(href) {
        if (!href || href.indexOf("javascript:") === 0) return "";
        var map = (typeof sphinxPageMap !== "undefined") ? sphinxPageMap : {};
        var stem = href.split("/").pop().replace(/#.*$/, "").replace(/\.html$/, "");
        var key = stem.replace(/^group__/, "").replace(/^tutorial_/, "").replace(/__/g, "_");
        var path = map[stem] || map[key];
        if (!path && stem.indexOf("namespace") === 0) path = map["core_basic"];
        var rest = stem;
        while (!path && rest.indexOf("_1_1") >= 0) {
          rest = rest.substring(0, rest.lastIndexOf("_1_1"));
          path = map[rest];
        }
        return path || "";
      }

      document.body.addEventListener("click", function (e) {
        var a = e.target.closest ? e.target.closest("a.SRSymbol, a.SRScope") : null;
        if (!a) return;
        var href = a.getAttribute("href") || "";
        var sphinxPath = resolveSphinx(href);
        if (sphinxPath) {
          e.preventDefault();
          e.stopPropagation();
          // Doxygen anchors (#ga…, #autotoc_md) don't exist in Sphinx, so
          // rebuild the fragment slug from the result text: tutorials use the
          // full heading; symbols use the name with scope + "(args)" stripped
          // -> e.g. "cv::Canny(...)" -> #canny.
          var t = (a.textContent || "").trim();
          var slug = /#autotoc_md/.test(href)
            ? t.toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "")
            : t.replace(/.*::/, "").replace(/\s*\(.*$/, "").toLowerCase()
                .replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "");
          var frag = slug ? "#" + slug : "";
          window.location.href = sphinxRoot + sphinxPath + frag;
        } else if (href.indexOf("doc/doxygen/html/") >= 0) {
          e.preventDefault();
          e.stopPropagation();
        }
      }, true);

      // Pin the Doxygen popups under the (centered) box with position:fixed
      // (Doxygen places them absolute at document-top → off-screen here).
      var box = boxes[0];
      function pin(w, left) {
        if (!box) return;
        var r = box.getBoundingClientRect();
        w.style.setProperty("position", "fixed", "important");
        w.style.setProperty("top", (r.bottom + 4) + "px", "important");
        var x = left ? r.left : Math.max(8, r.right - (w.offsetWidth || 300));
        w.style.setProperty("left", x + "px", "important");
      }
      [[res, false], [sel, true]].forEach(function (p) {
        var w = p[0], opt = { attributes: true, attributeFilter: ["style"] };
        var obs = new MutationObserver(function () {
          if (w.style.display === "block") { obs.disconnect(); pin(w, p[1]); obs.observe(w, opt); }
        });
        obs.observe(w, opt);
      });
    } catch (err) {
      if (window.console) console.error("Doxygen search init failed:", err);
    }
  });
</script>
{% endblock %}