补充主题静态资源与归档模板
This commit is contained in:
@@ -0,0 +1,270 @@
|
||||
/**
|
||||
* AKSRT AJAX Pagination & Lazy Load
|
||||
*/
|
||||
(function () {
|
||||
"use strict";
|
||||
|
||||
function initAjaxPagination(root) {
|
||||
var containers = (root || document).querySelectorAll(".aksrt-pagination-ajax, .ajax-pagination");
|
||||
if (!containers.length) return;
|
||||
|
||||
var triggerText = (window.aksrtData && aksrtData.ajaxTrigger) || "加载更多";
|
||||
var nomoreText = (window.aksrtData && aksrtData.ajaxNomore) || "没有更多了";
|
||||
var loadingText = (window.aksrtData && aksrtData.ajaxLoading) || "正在加载...";
|
||||
|
||||
containers.forEach(function (container) {
|
||||
if (container.dataset.aksrtPaginationBound === "1") return;
|
||||
container.dataset.aksrtPaginationBound = "1";
|
||||
|
||||
var mode = container.dataset.mode || "load_more";
|
||||
var nextPage = parseInt(container.dataset.nextPage, 10) || 2;
|
||||
var maxPages = parseInt(container.dataset.maxPages, 10) || 1;
|
||||
var isComment = container.classList.contains("aksrt-comment-pagination");
|
||||
var postId = container.dataset.postId || "";
|
||||
var commentOrder = container.dataset.commentOrder || "newest";
|
||||
var loading = false;
|
||||
var loadMoreBtn = container.querySelector(".aksrt-load-more-btn, .ajax-next");
|
||||
var indicator = container.querySelector(".aksrt-loading-indicator");
|
||||
// 目标容器:文章列表取 .post-grid,评论取 .comment-list
|
||||
var target = container.previousElementSibling;
|
||||
|
||||
function showSkeleton() {
|
||||
if (!target) return;
|
||||
var loader = target.querySelector(".post-ajax-loader");
|
||||
if (loader) {
|
||||
loader.classList.add("is-loading");
|
||||
}
|
||||
}
|
||||
|
||||
function hideSkeleton() {
|
||||
if (!target) return;
|
||||
var loader = target.querySelector(".post-ajax-loader");
|
||||
if (loader) {
|
||||
loader.classList.remove("is-loading");
|
||||
}
|
||||
}
|
||||
|
||||
function loadNextPage() {
|
||||
if (loading || nextPage > maxPages || !target) return;
|
||||
loading = true;
|
||||
if (indicator) indicator.style.display = "flex";
|
||||
if (loadMoreBtn) {
|
||||
loadMoreBtn.classList.add("is-loading");
|
||||
loadMoreBtn.textContent = loadingText;
|
||||
}
|
||||
showSkeleton();
|
||||
|
||||
var action = isComment ? "aksrt_load_more_comments" : "aksrt_load_more_posts";
|
||||
var queryContext = container.dataset.queryContext || "";
|
||||
var queryVars = container.dataset.queryVars || "";
|
||||
var renderConfig = container.dataset.renderConfig || "";
|
||||
var body = new URLSearchParams();
|
||||
body.set("action", action);
|
||||
body.set("nonce", aksrtData.nonce);
|
||||
body.set("page", String(nextPage));
|
||||
if (queryContext) {
|
||||
body.set("query_context", queryContext);
|
||||
}
|
||||
if (!isComment && queryVars) {
|
||||
body.set("query_vars", queryVars);
|
||||
}
|
||||
if (!isComment && renderConfig) {
|
||||
body.set("render_config", renderConfig);
|
||||
}
|
||||
if (isComment && postId) {
|
||||
body.set("post_id", postId);
|
||||
body.set("comment_order", commentOrder);
|
||||
}
|
||||
|
||||
fetch(aksrtData.ajaxUrl, {
|
||||
method: "POST",
|
||||
headers: { "Content-Type": "application/x-www-form-urlencoded; charset=UTF-8" },
|
||||
credentials: "same-origin",
|
||||
body: body.toString(),
|
||||
})
|
||||
.then(function (r) {
|
||||
return r.json();
|
||||
})
|
||||
.then(function (res) {
|
||||
if (res.success && res.data && res.data.html) {
|
||||
var temp = document.createElement("div");
|
||||
temp.innerHTML = res.data.html;
|
||||
var newItems = temp.children;
|
||||
while (newItems.length > 0) {
|
||||
target.appendChild(newItems[0]);
|
||||
}
|
||||
nextPage++;
|
||||
container.dataset.nextPage = String(nextPage);
|
||||
|
||||
// 重新初始化懒加载(新加载的图片)
|
||||
if (typeof initLazyLoad === "function") initLazyLoad();
|
||||
|
||||
// 如果没有更多页
|
||||
if (nextPage > maxPages || !res.data.has_more) {
|
||||
if (loadMoreBtn) {
|
||||
loadMoreBtn.textContent = nomoreText;
|
||||
loadMoreBtn.classList.remove("is-loading");
|
||||
loadMoreBtn.classList.add("ajax-nomore");
|
||||
loadMoreBtn.style.pointerEvents = "none";
|
||||
} else {
|
||||
container.innerHTML = '<span class="ajax-nomore">' + nomoreText + '</span>';
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
.catch(function () {})
|
||||
.finally(function () {
|
||||
loading = false;
|
||||
hideSkeleton();
|
||||
if (indicator) indicator.style.display = "none";
|
||||
if (loadMoreBtn && !loadMoreBtn.classList.contains("ajax-nomore")) {
|
||||
loadMoreBtn.classList.remove("is-loading");
|
||||
loadMoreBtn.textContent = triggerText;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// 加载更多按钮点击
|
||||
if (loadMoreBtn) {
|
||||
loadMoreBtn.addEventListener("click", function(e) {
|
||||
e.preventDefault();
|
||||
if (loadMoreBtn.dataset.jumpComments === "1") {
|
||||
var jumpInput = container.querySelector(".jump-input");
|
||||
if (!jumpInput) return;
|
||||
var targetPage = parseInt(jumpInput.value, 10) || 1;
|
||||
var max = parseInt(jumpInput.dataset.maxPages || String(maxPages), 10) || maxPages;
|
||||
targetPage = Math.max(1, Math.min(max, targetPage));
|
||||
var url = new URL(window.location.href);
|
||||
url.searchParams.set("cpage", String(targetPage));
|
||||
window.location.href = url.toString();
|
||||
return;
|
||||
}
|
||||
if (loadMoreBtn.dataset.jumpArchive === "1") {
|
||||
var archiveJumpInput = container.querySelector(".jump-input");
|
||||
if (!archiveJumpInput) return;
|
||||
var archiveTargetPage = parseInt(archiveJumpInput.value, 10) || 1;
|
||||
var archiveMax = parseInt(archiveJumpInput.dataset.maxPages || String(maxPages), 10) || maxPages;
|
||||
archiveTargetPage = Math.max(1, Math.min(archiveMax, archiveTargetPage));
|
||||
var archiveUrl = new URL(window.location.href);
|
||||
archiveUrl.searchParams.set("paged", String(archiveTargetPage));
|
||||
window.location.href = archiveUrl.toString();
|
||||
return;
|
||||
}
|
||||
loadNextPage();
|
||||
});
|
||||
}
|
||||
|
||||
// 无限滚动:IntersectionObserver
|
||||
if (mode === "infinite" && "IntersectionObserver" in window) {
|
||||
// Comment containers respect commentIasAuto; if disabled, fall back to click-to-load
|
||||
if (isComment && window.aksrtData && aksrtData.commentIasAuto === false) {
|
||||
// Skip IntersectionObserver — load_more button already present
|
||||
} else {
|
||||
var sentinel = document.createElement("div");
|
||||
sentinel.className = "aksrt-scroll-sentinel";
|
||||
container.appendChild(sentinel);
|
||||
var lazyloadAction = container.dataset.lazyloadAction || "";
|
||||
var iasMax = isComment
|
||||
? ((window.aksrtData && typeof aksrtData.commentIasMax !== "undefined") ? parseInt(aksrtData.commentIasMax, 10) : 0)
|
||||
: ((window.aksrtData && typeof aksrtData.iasMax !== "undefined") ? parseInt(aksrtData.iasMax, 10) : 0);
|
||||
var initialPage = nextPage - 1; // page at init time
|
||||
var observer = new IntersectionObserver(
|
||||
function (entries) {
|
||||
if (entries[0].isIntersecting && !loading) {
|
||||
// iasMax = 0 means unlimited, otherwise limit additional pages
|
||||
if (iasMax > 0 && (nextPage - initialPage) >= iasMax) {
|
||||
// Reached ias max, show nomore and disconnect
|
||||
observer.disconnect();
|
||||
if (loadMoreBtn) {
|
||||
loadMoreBtn.textContent = nomoreText;
|
||||
loadMoreBtn.classList.add("ajax-nomore");
|
||||
loadMoreBtn.style.pointerEvents = "none";
|
||||
}
|
||||
return;
|
||||
}
|
||||
loadNextPage();
|
||||
}
|
||||
},
|
||||
{ rootMargin: "400px" }
|
||||
);
|
||||
if (lazyloadAction === "ias") {
|
||||
container.classList.add("ias-pending");
|
||||
}
|
||||
observer.observe(sentinel);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/* ====== 图片懒加载 ====== */
|
||||
function initLazyLoad(root) {
|
||||
var scope = root || document;
|
||||
var lazyImages = scope.querySelectorAll("img.aksrt-lazy");
|
||||
if (!lazyImages.length) return;
|
||||
|
||||
// 不支持 IntersectionObserver 时直接加载所有图片
|
||||
if (!("IntersectionObserver" in window)) {
|
||||
lazyImages.forEach(function (img) {
|
||||
var src = img.dataset.src;
|
||||
if (src) {
|
||||
img.src = src;
|
||||
img.classList.remove("aksrt-lazy");
|
||||
img.classList.add("aksrt-loaded");
|
||||
}
|
||||
var skeleton = img.previousElementSibling;
|
||||
if (skeleton && skeleton.classList.contains("aksrt-skeleton")) {
|
||||
skeleton.remove();
|
||||
}
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
var observer = new IntersectionObserver(function (entries) {
|
||||
entries.forEach(function (entry) {
|
||||
if (!entry.isIntersecting) return;
|
||||
|
||||
var img = entry.target;
|
||||
var src = img.dataset.src;
|
||||
if (!src) {
|
||||
observer.unobserve(img);
|
||||
return;
|
||||
}
|
||||
|
||||
// 创建新图片预加载
|
||||
var tempImg = new Image();
|
||||
tempImg.onload = function () {
|
||||
img.src = src;
|
||||
img.classList.remove("aksrt-lazy");
|
||||
img.classList.add("aksrt-loaded");
|
||||
// 移除骨架
|
||||
var skeleton = img.previousElementSibling;
|
||||
if (skeleton && skeleton.classList.contains("aksrt-skeleton")) {
|
||||
skeleton.remove();
|
||||
}
|
||||
};
|
||||
tempImg.onerror = function () {
|
||||
img.classList.remove("aksrt-lazy");
|
||||
img.classList.add("aksrt-error");
|
||||
// 移除骨架
|
||||
var skeleton = img.previousElementSibling;
|
||||
if (skeleton && skeleton.classList.contains("aksrt-skeleton")) {
|
||||
skeleton.remove();
|
||||
}
|
||||
};
|
||||
tempImg.src = src;
|
||||
|
||||
observer.unobserve(img);
|
||||
});
|
||||
}, {
|
||||
rootMargin: "200px 0px",
|
||||
threshold: 0.01
|
||||
});
|
||||
|
||||
lazyImages.forEach(function (img) {
|
||||
observer.observe(img);
|
||||
});
|
||||
}
|
||||
|
||||
window.AksrtFrontend.register("aksrt-ajax-pagination", function (root) { initAjaxPagination(root); });
|
||||
window.AksrtFrontend.register("aksrt-lazy-load", function (root) { initLazyLoad(root); });
|
||||
})();
|
||||
Reference in New Issue
Block a user