补充主题静态资源与归档模板

2026-07-03 23:15:11 +08:00
parent 1268a55dd0
commit 3247db7ed1
265 changed files with 59174 additions and 0 deletions
@@ -0,0 +1,178 @@
+/**
+ * AKSRT Waterfall — 瀑布流/异步列表
+ *
+ * 提供纯 CSS column-based 瀑布流布局和无限滚动加载能力。
+ * 无外部依赖。
+ *
+ * @package AKSRT
+ */
+(function () {
+  'use strict';
+
+  /**
+   * Initialize waterfall layout on a container.
+   *
+   * @param {HTMLElement} container - The container element
+   * @param {Object} options
+   * @param {number} options.columns - Number of columns (default: auto from CSS)
+   * @param {string} options.itemSelector - Child item selector (default: '.waterfall-item')
+   * @param {number} options.gap - Gap between items in px (default: 16)
+   */
+  function Waterfall(container, options) {
+    if (!container) return;
+
+    this.container = container;
+    this.options = Object.assign({
+      columns: 0,
+      itemSelector: '.waterfall-item',
+      gap: 16,
+    }, options || {});
+
+    this._resizeHandler = this.layout.bind(this);
+    window.addEventListener('resize', this._resizeHandler);
+    this.layout();
+  }
+
+  Waterfall.prototype.layout = function () {
+    var items = this.container.querySelectorAll(this.options.itemSelector);
+    if (items.length === 0) return;
+
+    var cols = this.options.columns;
+    if (cols <= 0) {
+      var containerWidth = this.container.offsetWidth;
+      cols = Math.max(1, Math.floor(containerWidth / 280));
+    }
+
+    var gap = this.options.gap;
+    var colWidth = (this.container.offsetWidth - gap * (cols - 1)) / cols;
+    var colHeights = new Array(cols).fill(0);
+
+    for (var i = 0; i < items.length; i++) {
+      var item = items[i];
+      item.style.width = colWidth + 'px';
+      item.style.position = 'absolute';
+
+      // Find shortest column
+      var minHeight = Infinity;
+      var minCol = 0;
+      for (var c = 0; c < cols; c++) {
+        if (colHeights[c] < minHeight) {
+          minHeight = colHeights[c];
+          minCol = c;
+        }
+      }
+
+      item.style.left = (minCol * (colWidth + gap)) + 'px';
+      item.style.top = colHeights[minCol] + 'px';
+
+      colHeights[minCol] += item.offsetHeight + gap;
+    }
+
+    // Set container height to tallest column
+    var maxHeight = Math.max.apply(null, colHeights);
+    this.container.style.height = maxHeight + 'px';
+    this.container.style.position = 'relative';
+  };
+
+  Waterfall.prototype.relayout = function () {
+    this.layout();
+  };
+
+  Waterfall.prototype.destroy = function () {
+    window.removeEventListener('resize', this._resizeHandler);
+  };
+
+  /**
+   * Infinite scroll loader.
+   *
+   * @param {Object} options
+   * @param {string} options.containerSelector - List container selector
+   * @param {string} options.loadMoreSelector - Load-more button selector
+   * @param {Function} options.loadMore - Async function that loads more items
+   * @param {number} options.threshold - Distance from bottom to trigger (default: 200)
+   */
+  function InfiniteScroll(options) {
+    this.options = Object.assign({
+      containerSelector: '.aksrt-infinite-list',
+      loadMoreSelector: '.aksrt-load-more',
+      loadMore: null,
+      threshold: 200,
+    }, options || {});
+
+    this.loading = false;
+    this.hasMore = true;
+    this._scrollHandler = this._check.bind(this);
+
+    window.addEventListener('scroll', this._scrollHandler);
+    this._check();
+  }
+
+  InfiniteScroll.prototype._check = function () {
+    if (this.loading || !this.hasMore) return;
+
+    var loadMoreBtn = document.querySelector(this.options.loadMoreSelector);
+    if (!loadMoreBtn) {
+      this.hasMore = false;
+      return;
+    }
+
+    var rect = loadMoreBtn.getBoundingClientRect();
+    if (rect.top < window.innerHeight + this.options.threshold) {
+      this._load();
+    }
+  };
+
+  InfiniteScroll.prototype._load = function () {
+    if (!this.options.loadMore) return;
+
+    this.loading = true;
+    var self = this;
+
+    this.options.loadMore().then(function (hasMore) {
+      self.hasMore = hasMore !== false;
+      self.loading = false;
+      if (self.hasMore) {
+        self._check();
+      }
+    }).catch(function () {
+      self.loading = false;
+    });
+  };
+
+  InfiniteScroll.prototype.destroy = function () {
+    window.removeEventListener('scroll', this._scrollHandler);
+  };
+
+  // Auto-init
+  var waterfallInstances = [];
+
+  function relayoutAll() {
+    waterfallInstances.forEach(function (instance) {
+      if (instance && typeof instance.relayout === 'function') {
+        instance.relayout();
+      }
+    });
+  }
+
+  function autoInit() {
+    document.querySelectorAll('[data-aksrt-waterfall]').forEach(function (el) {
+      var cols = parseInt(el.dataset.aksrtWaterfallColumns) || 0;
+      var gap = parseInt(el.dataset.aksrtWaterfallGap) || 16;
+      waterfallInstances.push(new Waterfall(el, { columns: cols, gap: gap }));
+    });
+  }
+
+  document.addEventListener('post_ajax.ed', relayoutAll);
+  document.addEventListener('aksrt:posts:rendered', relayoutAll);
+  document.addEventListener('lazyloaded', relayoutAll, true);
+
+  if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', autoInit);
+  } else {
+    autoInit();
+  }
+
+  // Export to global
+  window.AksrtWaterfall = Waterfall;
+  window.AksrtInfiniteScroll = InfiniteScroll;
+})();