wordpress-theme-aksrt/assets/js/widget-set.js

/**
 * AKSRT Widget Set
 *
 * Handles widget-local interactions and floating QR widgets.
 *
 * @package AKSRT
 */

(function () {
  'use strict';

  function initWidgetTabs() {
    document.querySelectorAll('.widget-tab-posts').forEach(function (widget) {
      if (widget.dataset.aksrtWidgetTabsBound === '1') return;
      widget.dataset.aksrtWidgetTabsBound = '1';

      var tabs = widget.querySelectorAll('.widget-tab-posts__tab');
      var panels = widget.querySelectorAll('.widget-tab-posts__panel');
      if (!tabs.length || !panels.length) return;
      var rest = widget.getAttribute('data-rest') || '';
      var defaultCount = widget.getAttribute('data-count') || '5';

      function loadPanel(panel, tab) {
        if (!panel || panel.getAttribute('data-loaded') === '1' || !rest) return;
        var orderby = tab.getAttribute('data-orderby') || 'date';
        var cat = tab.getAttribute('data-cat') || '0';
        var tabCount = tab.getAttribute('data-tab-count') || '0';
        var style = widget.getAttribute('data-style') || 'mini';
        var paginate = widget.getAttribute('data-paginate') || 'none';
        var qs = new URLSearchParams({
          count: defaultCount,
          orderby: orderby,
          cat: cat,
          tab_count: tabCount,
          style: style,
          paginate: paginate,
        });
        var url = rest + (rest.indexOf('?') > -1 ? '&' : '?') + qs.toString();
        panel.classList.add('is-ajax-loading');
        var headers = { Accept: 'application/json' };
        if (window.aksrtData && aksrtData.restNonce) {
          headers['X-WP-Nonce'] = aksrtData.restNonce;
        }
        fetch(url, { credentials: 'same-origin', headers: headers })
          .then(function (r) { return r.json(); })
          .then(function (j) {
            var d = (j && j.data) || j || {};
            var html = d.html || '';
            var pag = d.paginate_html || d.paginateHtml || '';
            panel.innerHTML = (html || '<p class="widget-empty">暂无文章</p>') + (pag || '');
            panel.setAttribute('data-loaded', '1');
            panel.classList.remove('is-ajax-loading');
          })
          .catch(function () {
            panel.classList.remove('is-ajax-loading');
          });
      }

      tabs.forEach(function (tab) {
        tab.addEventListener('click', function () {
          var target = tab.getAttribute('data-tab');

          tabs.forEach(function (item) {
            var active = item === tab;
            item.classList.toggle('active', active);
            item.setAttribute('aria-selected', active ? 'true' : 'false');
          });

          panels.forEach(function (panel) {
            var active = panel.getAttribute('data-tab-panel') === target;
            panel.classList.toggle('active', active);
            if (active) {
              panel.removeAttribute('hidden');
              loadPanel(panel, tab);
            } else {
              panel.setAttribute('hidden', '');
            }
          });
        });
      });
    });
  }

  function initFloatingQRCodes() {
    var wrap = document.querySelector('.float-right');
    if (!wrap) return;

    wrap.querySelectorAll('.service-wechat .hover-show-con p, .service-qq .hover-show-con p').forEach(function (node) {
      node.remove();
    });

    if (typeof window.kjua !== 'function') return;

    wrap.querySelectorAll('.float-btn-qrcode').forEach(function (node) {
      if (node.dataset.qrReady === '1') return;

      var qrText = node.getAttribute('data-qr-text') || window.location.href;
      var qrSize = parseInt(node.getAttribute('data-qr-size') || '120', 10);
      if (!qrText || !qrSize) return;

      try {
        node.innerHTML = '';
        node.appendChild(window.kjua({
          render: 'svg',
          text: qrText,
          size: qrSize,
          ecLevel: 'H',
          fill: '#15171A',
          back: '#FFFFFF',
          quiet: 0,
          crisp: true
        }));
        node.style.width = qrSize + 'px';
        node.style.height = qrSize + 'px';
        node.dataset.qrReady = '1';
      } catch (error) {
        node.dataset.qrReady = '0';
      }
    });
  }

  function init() {
    initWidgetTabs();
    initFloatingQRCodes();
  }

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