wordpress-theme-aksrt/assets/js/links-page.js

/**
 * AKSRT 网址导航页 — search tabs, sticky cat nav, submit modal/AJAX.
 *
 * @package AKSRT
 */
(function () {
  'use strict';

  function qs(sel, root) {
    return (root || document).querySelector(sel);
  }

  function qsa(sel, root) {
    return Array.prototype.slice.call((root || document).querySelectorAll(sel));
  }

  function ajaxUrl() {
    if (window.aksrtData && window.aksrtData.ajaxUrl) return window.aksrtData.ajaxUrl;
    if (window.ajaxurl) return window.ajaxurl;
    return '/wp-admin/admin-ajax.php';
  }

  function toast(msg, type) {
    if (window.aksrt && typeof window.aksrt.toast === 'function') {
      window.aksrt.toast(msg, type || 'info');
      return;
    }
    if (window.notyf) {
      try {
        window.notyf(msg, type === 'danger' ? 'danger' : '');
        return;
      } catch (e) { /* ignore */ }
    }
    // eslint-disable-next-line no-alert
    window.alert(msg);
  }

  /* ---------- search engine tabs ---------- */
  function initSearchTabs() {
    var cover = qs('.link-page-search-cover');
    if (!cover) return;

    qsa('.tab-nav-theme a[data-aksrt-tab-target]', cover).forEach(function (a) {
      a.addEventListener('click', function (e) {
        e.preventDefault();
        var target = a.getAttribute('data-aksrt-tab-target');
        if (!target) return;
        qsa('.tab-nav-theme li', cover).forEach(function (li) {
          li.classList.remove('active');
        });
        if (a.parentElement) a.parentElement.classList.add('active');
        qsa('.tab-pane', cover).forEach(function (pane) {
          pane.classList.remove('active', 'in');
        });
        var pane = qs(target, cover);
        if (pane) pane.classList.add('active', 'in');
      });
    });
  }

  /* ---------- sticky category nav highlight ---------- */
  function initCatNav() {
    var wrap = qs('.links-page-container .fixed-wrap');
    if (!wrap) return;
    var nav = qs('.link-nav-box', wrap);
    var links = qsa('.link-nav-box a[href^="#"]', wrap);
    var sections = links
      .map(function (a) {
        var id = a.getAttribute('href');
        return id ? document.getElementById(id.replace(/^#/, '')) : null;
      })
      .filter(Boolean);
    if (!links.length || !sections.length) return;

    links.forEach(function (a) {
      a.addEventListener('click', function (e) {
        var id = a.getAttribute('href');
        var el = id ? document.getElementById(id.replace(/^#/, '')) : null;
        if (!el) return;
        e.preventDefault();
        var top = el.getBoundingClientRect().top + window.pageYOffset - 90;
        window.scrollTo({ top: top, behavior: 'smooth' });
      });
    });

    function updateActive() {
      var y = window.pageYOffset + 120;
      var current = sections[0];
      for (var i = 0; i < sections.length; i++) {
        if (sections[i].offsetTop <= y) current = sections[i];
      }
      if (!current) return;
      links.forEach(function (a) {
        var li = a.parentElement;
        if (!li) return;
        if (a.getAttribute('href') === '#' + current.id) {
          li.classList.add('active');
        } else {
          li.classList.remove('active');
        }
      });
      if (nav) nav.classList.add('affix');
    }

    window.addEventListener('scroll', updateActive, { passive: true });
    updateActive();
  }

  /* ---------- submit modal ---------- */
  function initSubmitModal() {
    var modal = qs('#submit-links-modal');
    if (!modal) return;

    function openModal(e) {
      if (e) e.preventDefault();
      modal.classList.add('is-open', 'show');
      modal.setAttribute('aria-hidden', 'false');
      document.documentElement.classList.add('aksrt-modal-open');
    }

    function closeModal(e) {
      if (e) e.preventDefault();
      modal.classList.remove('is-open', 'show');
      modal.setAttribute('aria-hidden', 'true');
      document.documentElement.classList.remove('aksrt-modal-open');
    }

    qsa('a[href="#submit-links-modal"], [data-toggle="modal"][href="#submit-links-modal"]').forEach(function (btn) {
      btn.addEventListener('click', openModal);
    });

    qsa('[data-dismiss="modal"]', modal).forEach(function (btn) {
      btn.addEventListener('click', closeModal);
    });

    modal.addEventListener('click', function (e) {
      if (e.target === modal) closeModal(e);
    });

    document.addEventListener('keydown', function (e) {
      if (e.key === 'Escape' && modal.classList.contains('is-open')) closeModal(e);
    });

    var fileInput = qs('.aksrt-links-logo-input', modal);
    var preview = qs('.aksrt-links-logo-preview', modal);
    if (fileInput && preview) {
      fileInput.addEventListener('change', function () {
        var file = fileInput.files && fileInput.files[0];
        if (!file) return;
        var url = URL.createObjectURL(file);
        preview.src = url;
      });
    }

    var form = qs('.aksrt-links-submit-form', modal);
    if (!form) return;

    form.addEventListener('submit', function (e) {
      e.preventDefault();
      var btn = qs('.aksrt-links-submit-btn', form);
      if (btn) {
        btn.disabled = true;
        btn.classList.add('loading');
      }

      var fd = new FormData(form);
      if (!fd.get('action')) fd.set('action', 'aksrt_frontend_links_submit');

      fetch(ajaxUrl(), {
        method: 'POST',
        body: fd,
        credentials: 'same-origin',
      })
        .then(function (r) {
          return r.json();
        })
        .then(function (data) {
          if (!data || data.error) {
            toast((data && data.msg) || '提交失败', 'danger');
            return;
          }
          toast(data.msg || '提交成功', 'success');
          if (data.reload) {
            window.setTimeout(function () {
              window.location.reload();
            }, 600);
          } else {
            closeModal();
            form.reset();
          }
        })
        .catch(function () {
          toast('网络错误，请稍后重试', 'danger');
        })
        .finally(function () {
          if (btn) {
            btn.disabled = false;
            btn.classList.remove('loading');
          }
        });
    });
  }

  function init() {
    if (!document.body.classList.contains('page-template-templates-pages-page-links-php')
      && !qs('.page-template-links')
      && !qs('.links-page-container')
      && !qs('#submit-links-modal')) {
      // Still bind if modal exists alone.
    }
    initSearchTabs();
    initCatNav();
    initSubmitModal();
  }

  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', init);
  } else {
    init();
  }
})();