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

/**
 * AKSRT Page Template
 *
 * Handles template-scoped content interactions: expandable article bodies
 * and one-shot query cleanup banners.
 *
 * @package AKSRT
 */

(function () {
  'use strict';

  function queryAll(root, selector) {
    var nodes = Array.prototype.slice.call((root || document).querySelectorAll(selector));
    if (root && root.nodeType === 1 && root.matches(selector)) nodes.unshift(root);
    return nodes;
  }

  function initContentExpand(root) {
    // legacy-style: inject .read-more inside .limit-height and expand on click.
    queryAll(root, '.wp-posts-content.limit-height, .limit-height[data-nav]').forEach(function (content) {
      if (content.dataset.aksrtExpandBound === '1') return;
      content.dataset.aksrtExpandBound = '1';

      var customMax = parseInt(content.getAttribute('data-maxheight') || content.dataset.maxheight || '0', 10);
      // data-maxheight may be maxheight-80 (legacy) or absolute maxheight; prefer style max-height.
      var styleMax = 0;
      if (content.style && content.style.maxHeight) {
        styleMax = parseInt(content.style.maxHeight, 10) || 0;
      }
      var limit = styleMax > 0 ? styleMax : (customMax > 0 ? customMax + 80 : 0);
      if (!(limit > 0) && customMax > 0) {
        limit = customMax;
      }
      if (!(limit > 0)) {
        content.classList.remove('limit-height');
        return;
      }

      if (content.scrollHeight <= limit + 40) {
        content.classList.remove('limit-height');
        content.style.maxHeight = '';
        return;
      }

      content.classList.add('limit-height');
      content.style.maxHeight = limit + 'px';

      if (content.querySelector('.read-more')) return;

      var wrap = document.createElement('div');
      wrap.className = 'read-more';
      var link = document.createElement('a');
      link.href = 'javascript:;';
      link.className = 'read-more-open';
      link.innerHTML = '展开阅读全文<i class="fa ml10 fa-angle-down" aria-hidden="true"></i>';
      wrap.appendChild(link);
      content.appendChild(wrap);

      link.addEventListener('click', function (event) {
        event.preventDefault();
        content.classList.remove('limit-height');
        content.style.maxHeight = '';
        wrap.remove();
      });
    });
  }

  var expandDelegateBound = false;

  function bindExpandDelegate() {
    if (expandDelegateBound) return;
    expandDelegateBound = true;
    document.addEventListener('click', function (event) {
      var open = event.target.closest && event.target.closest('.read-more-open');
      if (!open) return;
      var limitBox = open.closest('.limit-height');
      if (!limitBox) return;
      event.preventDefault();
      limitBox.classList.remove('limit-height');
      limitBox.style.maxHeight = '';
      var more = open.closest('.read-more');
      if (more) more.remove();
    });
  }

  function initFlashQueryCleanup(root) {
    queryAll(root, '[data-aksrt-flash-query]').forEach(function (node) {
      var queryKey = node.getAttribute('data-aksrt-flash-query');
      if (!queryKey || !window.history || typeof window.history.replaceState !== 'function') return;

      var url = new URL(window.location.href);
      if (!url.searchParams.has(queryKey)) return;

      url.searchParams.delete(queryKey);
      window.history.replaceState({}, '', url.toString());
    });
  }

  function init(root) {
    root = root || document;
    bindExpandDelegate();
    initContentExpand(root);
    initFlashQueryCleanup(root);
  }

  window.AksrtFrontend.register('aksrt-page-template', init);
})();