/* ==========================================================================
   GUAN 官网 —— 交互脚本
   站点是纯静态的，所以所有交互都放在这里，按功能分成若干独立的小模块。
   每个模块都先判断页面上有没有对应的元素，没有就直接退出，
   这样同一份脚本可以用在所有页面上。
   ========================================================================== */

(function () {
  "use strict";

  var root = document.documentElement;

  /* 页面把自己的语言文案传进来（见 i18n.py），
     这里做一次兜底，脚本单独拿出来调试时也不会报错。 */
  var I18N = window.SITE_I18N || {};
  function text(key, fallback) {
    return I18N[key] || fallback || key;
  }

  /* ---------- 通用小工具 ---------- */

  function copyText(text) {
    if (navigator.clipboard && navigator.clipboard.writeText) {
      return navigator.clipboard.writeText(text);
    }
    return new Promise(function (resolve, reject) {
      var area = document.createElement("textarea");
      area.value = text;
      area.setAttribute("readonly", "");
      area.style.position = "fixed";
      area.style.opacity = "0";
      document.body.appendChild(area);
      area.select();
      try {
        document.execCommand("copy");
        resolve();
      } catch (err) {
        reject(err);
      }
      document.body.removeChild(area);
    });
  }

  /* 给按钮加一个「已复制 → 恢复」的反馈 */
  function flash(button, text, done) {
    var original = button.getAttribute("data-label") || button.textContent;
    button.setAttribute("data-label", original);
    button.textContent = text;
    clearTimeout(button._flashTimer);
    button._flashTimer = setTimeout(function () {
      button.textContent = original;
      if (done) done();
    }, 1500);
  }

  /* ==========================================================================
     主题切换：默认跟随系统，用户点一次就固定下来
     ========================================================================== */

  (function theme() {
    var button = document.getElementById("theme-toggle");
    if (!button) return;

    function current() {
      var explicit = root.getAttribute("data-theme");
      if (explicit === "light" || explicit === "dark") return explicit;
      return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
    }

    function apply(mode) {
      if (mode === "light" || mode === "dark") {
        root.setAttribute("data-theme", mode);
      } else {
        root.removeAttribute("data-theme");
      }
    }

    button.addEventListener("click", function () {
      var next = current() === "dark" ? "light" : "dark";
      apply(next);
      try {
        localStorage.setItem("guan-theme", next);
      } catch (e) {}
      button.setAttribute(
        "title",
        next === "dark"
          ? text("theme_to_light", "切换到浅色主题")
          : text("theme_to_dark", "切换到深色主题")
      );
      button.setAttribute("aria-label", button.getAttribute("title"));
    });
  })();

  /* ==========================================================================
     窄屏菜单：展开 / 收起导航
     ========================================================================== */

  (function navToggle() {
    var toggle = document.getElementById("nav-toggle");
    var nav = document.getElementById("site-nav");
    if (!toggle || !nav) return;

    function close() {
      nav.classList.remove("is-open");
      toggle.setAttribute("aria-expanded", "false");
      toggle.setAttribute("aria-label", text("menu_open", "打开菜单"));
    }

    toggle.addEventListener("click", function () {
      var open = nav.classList.toggle("is-open");
      toggle.setAttribute("aria-expanded", open ? "true" : "false");
      toggle.setAttribute(
        "aria-label",
        open ? text("menu_close", "关闭菜单") : text("menu_open", "打开菜单")
      );
    });

    nav.addEventListener("click", function (e) {
      if (e.target.tagName === "A") close();
    });

    document.addEventListener("keydown", function (e) {
      if (e.key === "Escape") close();
    });

    window.addEventListener("resize", function () {
      if (window.innerWidth > 900) close();
    });
  })();

  /* ==========================================================================
     复制：安装命令、代码块、函数链接
     ========================================================================== */

  (function copyButtons() {
    document.querySelectorAll(".copy[data-copy]").forEach(function (button) {
      button.addEventListener("click", function () {
        var value = button.getAttribute("data-copy");
        copyText(value).then(function () {
          flash(button, text("copied", "已复制"));
        }, function () {});
      });
    });

    // 给每个代码块加一个右上角的复制按钮
    document.querySelectorAll("pre.code").forEach(function (pre) {
      var code = pre.querySelector("code");
      if (!code) return;
      var button = document.createElement("button");
      button.type = "button";
      button.className = "code-copy";
      button.textContent = text("copy", "复制");
      button.title = text("copy_code", "复制代码");
      button.setAttribute("aria-label", text("copy_code", "复制代码"));
      button.addEventListener("click", function () {
        copyText(code.innerText).then(function () {
          flash(button, text("copied", "已复制"));
        }, function () {});
      });
      pre.appendChild(button);
    });
  })();

  /* ==========================================================================
     下载：教程页的「下载脚本」
     直接用 <a download> 的话，本地以 file:// 方式预览时浏览器会忽略
     download 属性、把源码显示出来。这里改成拿页面里的源码生成文件再下载，
     这样无论站点怎么打开，点击都会启动下载程序。
     ========================================================================== */

  (function downloadLinks() {
    document.querySelectorAll("a[data-download]").forEach(function (link) {
      link.addEventListener("click", function (event) {
        var card = link.closest(".tut-card");
        var code = card && card.querySelector("pre.code code");
        if (!code) return; // 页面里没有源码，就用浏览器自己的下载行为

        event.preventDefault();
        var blob = new Blob([code.textContent], {
          type: "text/x-python;charset=utf-8"
        });
        var url = URL.createObjectURL(blob);
        var anchor = document.createElement("a");
        anchor.href = url;
        anchor.download = link.getAttribute("data-download");
        document.body.appendChild(anchor);
        anchor.click();
        anchor.remove();
        setTimeout(function () { URL.revokeObjectURL(url); }, 1000);
      });
    });
  })();

  /* ==========================================================================
     回到顶部
     ========================================================================== */

  (function toTop() {
    var button = document.getElementById("to-top");
    if (!button) return;

    var pending = false;

    function update() {
      pending = false;
      button.classList.toggle("is-visible", window.scrollY > 420);
    }

    function onScroll() {
      if (pending) return;
      pending = true;
      window.requestAnimationFrame(update);
    }

    button.addEventListener("click", function () {
      window.scrollTo({ top: 0, behavior: "smooth" });
    });

    window.addEventListener("scroll", onScroll, { passive: true });
    window.addEventListener("resize", onScroll);
    update();
  })();

  /* ==========================================================================
     滚动跟随高亮：API 页的模块列表、关于页 / 教程页的目录
     --------------------------------------------------------------------------
     侧栏里最后一个条目往往太短，页面滚不到它的标题上方那条基线，
     只按滚动位置判断的话，高亮会留在上一项上，点它也没反应。
     所以点一下的时候先把高亮锁在被点的条目上，等用户自己滚动时
     再交还给滚动位置决定；页面滚到底部时，最后一个条目也会被点亮。
     ========================================================================== */

  function setupScrollSpy(options) {
    var links = options.links;
    var targets = options.targets;
    var offset = options.offset || 120;
    var container = options.container || null;

    if (!links.length || !targets.length) return;

    var locked = null; // 点击后锁定的目标
    var settledY = null; // 跳转停下来时的滚动位置
    var settleTimer = null;
    var pending = false;

    function hrefId(link) {
      var href = link.getAttribute("href") || "";
      if (href.charAt(0) !== "#") return "";
      return decodeURIComponent(href.slice(1));
    }

    function isVisible(el) {
      return el.getClientRects().length > 0;
    }

    /* 当前所在的目标：最后一个越过基线的；页面到底了就是最后一个 */
    function pick() {
      var doc = document.documentElement;
      var shown = targets.filter(isVisible);
      if (!shown.length) return null;
      if (window.innerHeight + window.pageYOffset >= doc.scrollHeight - 4) {
        return shown[shown.length - 1];
      }
      var current = null;
      shown.forEach(function (target) {
        if (target.getBoundingClientRect().top <= offset) current = target;
      });
      return current || shown[0];
    }

    /* 让被点亮的条目留在侧栏自身的可视范围内 */
    function keepVisible(link) {
      if (!container) return;
      var box = container.getBoundingClientRect();
      var item = link.getBoundingClientRect();
      if (item.top < box.top) container.scrollTop -= box.top - item.top + 6;
      else if (item.bottom > box.bottom) container.scrollTop += item.bottom - box.bottom + 6;
    }

    function apply(target) {
      links.forEach(function (link) {
        var active = !!target && hrefId(link) === target.id;
        link.classList.toggle("is-active", active);
        if (active) keepVisible(link);
      });
    }

    /* 滚动停下来之后记下位置，用来分辨「程序滚动」和「用户滚动」 */
    function markSettled() {
      clearTimeout(settleTimer);
      settleTimer = setTimeout(function () {
        settledY = window.scrollY;
        apply(locked || pick());
      }, 200);
    }

    function update() {
      pending = false;
      // 用户自己滚动了 → 解除点击时的锁定
      if (locked && settledY !== null && Math.abs(window.scrollY - settledY) > 4) {
        locked = null;
        settledY = null;
      }
      apply(locked || pick());
      markSettled();
    }

    function onScroll() {
      if (pending) return;
      pending = true;
      window.requestAnimationFrame(update);
    }

    links.forEach(function (link) {
      link.addEventListener("click", function () {
        var id = hrefId(link);
        if (!id) return;
        var target = document.getElementById(id);
        if (!target) return;
        locked = target;
        settledY = null;
        apply(target);
        markSettled();
      });
    });

    window.addEventListener("scroll", onScroll, { passive: true });
    window.addEventListener("resize", onScroll);
    apply(pick());
    markSettled();
  }

  /* ==========================================================================
     API 页：模块速查、模块高亮、函数筛选
     ========================================================================== */

  (function apiPage() {
    var layout = document.querySelector(".api-layout");
    if (!layout) return;

    var modules = Array.prototype.slice.call(document.querySelectorAll(".module"));

    /* 每个模块下方加一排函数快捷入口 */
    modules.forEach(function (module) {
      var funcs = Array.prototype.slice.call(module.querySelectorAll(".func"));
      if (funcs.length < 2) return;
      var list = document.createElement("ul");
      list.className = "module-index";
      funcs.forEach(function (func) {
        var id = func.id;
        if (!id) return;
        var name = id.split(".").pop();
        var li = document.createElement("li");
        var link = document.createElement("a");
        link.href = "#" + id;
        link.textContent = name;
        link.setAttribute("data-target", id);
        li.appendChild(link);
        list.appendChild(li);
      });
      var meta = module.querySelector(".module-meta");
      if (meta) meta.insertAdjacentElement("afterend", list);
      else module.insertBefore(list, module.firstChild);
    });

    /* 函数卡片右上角的「复制链接」按钮 */
    document.querySelectorAll(".func").forEach(function (func) {
      if (!func.id) return;
      var button = document.createElement("button");
      button.type = "button";
      button.className = "anchor-btn";
      button.textContent = "#";
      button.title = text("copy_anchor", "复制本函数的链接");
      button.setAttribute("aria-label", text("copy_anchor", "复制本函数的链接"));
      button.addEventListener("click", function () {
        var url = location.href.split("#")[0] + "#" + func.id;
        copyText(url).then(function () {
          flash(button, text("copied", "已复制"));
        }, function () {});
      });
      var heading = func.querySelector("h3");
      if (heading) heading.appendChild(button);
    });

    /* 顶部筛选框：按函数名 / 说明过滤 */
    var total = document.querySelectorAll(".func").length;
    var filter = document.createElement("div");
    filter.className = "api-filter";
    filter.innerHTML =
      '<input type="search" placeholder="' +
      text("filter_placeholder", "在本页筛选函数…") +
      '" aria-label="' + text("filter_label", "筛选函数") +
      '" autocomplete="off">' +
      '<span class="filter-count"></span>' +
      '<button class="filter-clear" type="button" hidden>' +
      text("filter_clear", "清除") + "</button>";
    // 放在正文列的上方，跟左侧模块列表对齐
    var body = document.querySelector(".api-body");
    if (body) body.insertBefore(filter, body.firstChild);
    else layout.parentNode.insertBefore(filter, layout);

    var field = filter.querySelector("input");
    var count = filter.querySelector(".filter-count");
    var clear = filter.querySelector(".filter-clear");

    function applyFilter() {
      var q = field.value.trim().toLowerCase();
      clear.hidden = !q;
      var shown = 0;

      document.querySelectorAll(".func").forEach(function (func) {
        var content = (func.textContent || "").toLowerCase();
        var hit = !q || content.indexOf(q) !== -1;
        func.classList.toggle("is-hidden", !hit);
        if (hit) shown += 1;
      });

      // 一个函数都不剩的模块整块隐藏
      modules.forEach(function (module) {
        var visible = module.querySelectorAll(".func:not(.is-hidden)").length;
        module.style.display = visible ? "" : "none";
        var index = module.querySelector(".module-index");
        if (index) {
          index.querySelectorAll("a").forEach(function (link) {
            var target = document.getElementById(link.getAttribute("data-target"));
            link.style.display = target && !target.classList.contains("is-hidden") ? "" : "none";
          });
        }
      });

      count.textContent = q
        ? text("filter_count", "显示 {shown} / {total} 个函数")
            .replace("{shown}", shown)
            .replace("{total}", total)
        : "";
    }

    field.addEventListener("input", applyFilter);
    clear.addEventListener("click", function () {
      field.value = "";
      applyFilter();
      field.focus();
    });

    /* 左侧模块列表：滚动时高亮当前所在的模块 */
    var nav = document.querySelector(".api-nav");
    var navLinks = Array.prototype.slice.call(
      document.querySelectorAll(".api-nav li a")
    );
    if (!navLinks.length) return;

    setupScrollSpy({
      links: navLinks,
      targets: modules,
      offset: 120,
      container: nav,
    });
  })();

  /* ==========================================================================
     关于页 / 教程页的目录：跟随滚动高亮当前章节
     ========================================================================== */

  (function tocScrollSpy() {
    var toc = document.querySelector(".toc");
    if (!toc) return;

    var links = Array.prototype.slice.call(toc.querySelectorAll("a[href^='#']"));
    if (!links.length) return;

    var targets = links
      .map(function (link) {
        return document.getElementById(decodeURIComponent(link.getAttribute("href").slice(1)));
      })
      .filter(Boolean);
    if (!targets.length) return;

    setupScrollSpy({
      links: links,
      targets: targets,
      offset: 140,
      container: toc,
    });
  })();
})();