feat(frontend): wire comment sort/author filter like Zibll
Apply comments_template_query_args for newest/hottest/author-only, keep filter bar visible under empty author filters, and restyle order tabs/buttons with Zibll-compatible classes.
This commit is contained in:
@@ -225,6 +225,62 @@
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* Zibll-compatible class names used by aksrt-comments.php */
|
||||
.comment-order-box {
|
||||
display: flex;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
gap: 4px;
|
||||
}
|
||||
.comment-order-box li a,
|
||||
.comment-order-box .comment-orderby {
|
||||
display: inline-block;
|
||||
padding: 4px 12px;
|
||||
border-radius: 4px;
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
color: var(--color-ink-4);
|
||||
text-decoration: none;
|
||||
transition: background 0.15s ease, color 0.15s ease;
|
||||
}
|
||||
.comment-order-box li a:hover,
|
||||
.comment-order-box .comment-orderby:hover {
|
||||
background: var(--surface-3);
|
||||
color: var(--color-ink);
|
||||
}
|
||||
.comment-order-box li.active a,
|
||||
.comment-order-box li.active .comment-orderby {
|
||||
background: var(--color-primary-soft, rgba(240, 68, 148, 0.12));
|
||||
color: var(--color-primary);
|
||||
font-weight: 600;
|
||||
}
|
||||
.btn-only-author,
|
||||
.comment-author-filter {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
padding: 4px 12px;
|
||||
border-radius: 999px;
|
||||
border: 1px solid var(--color-line);
|
||||
background: var(--surface-1);
|
||||
color: var(--color-ink-3);
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
|
||||
}
|
||||
.btn-only-author:hover,
|
||||
.comment-author-filter:hover {
|
||||
border-color: var(--color-primary);
|
||||
color: var(--color-primary);
|
||||
}
|
||||
.btn-only-author.active,
|
||||
.comment-author-filter.active {
|
||||
border-color: var(--color-primary);
|
||||
background: var(--color-primary-soft, rgba(240, 68, 148, 0.12));
|
||||
color: var(--color-primary);
|
||||
}
|
||||
|
||||
/* ============================================================
|
||||
* 评论列表
|
||||
* ============================================================ */
|
||||
|
||||
@@ -596,14 +596,48 @@
|
||||
var newFilter = newComments.querySelector(".comment-filter");
|
||||
if (currentFilter && newFilter) {
|
||||
currentFilter.replaceWith(newFilter.cloneNode(true));
|
||||
} else if (!currentFilter && newFilter) {
|
||||
var listAnchor = commentsArea.querySelector("#postcomments, #comment-list");
|
||||
if (listAnchor && listAnchor.parentNode) {
|
||||
listAnchor.parentNode.insertBefore(newFilter.cloneNode(true), listAnchor);
|
||||
}
|
||||
}
|
||||
|
||||
var currentListWrap = commentsArea.querySelector("#postcomments");
|
||||
var newListWrap = newComments.querySelector("#postcomments");
|
||||
var currentList = commentsArea.querySelector("#comment-list");
|
||||
var newList = newComments.querySelector("#comment-list");
|
||||
if (currentList && newList) {
|
||||
if (currentListWrap && newListWrap) {
|
||||
currentListWrap.replaceWith(newListWrap.cloneNode(true));
|
||||
} else if (currentList && newList) {
|
||||
currentList.replaceWith(newList.cloneNode(true));
|
||||
}
|
||||
|
||||
var currentEmpty = commentsArea.querySelector(".comments-empty");
|
||||
var newEmpty = newComments.querySelector(".comments-empty");
|
||||
if (currentEmpty && newEmpty) {
|
||||
currentEmpty.replaceWith(newEmpty.cloneNode(true));
|
||||
} else if (currentEmpty && !newEmpty) {
|
||||
currentEmpty.remove();
|
||||
} else if (!currentEmpty && newEmpty) {
|
||||
var insertAt = commentsArea.querySelector("#postcomments") || commentsArea;
|
||||
insertAt.appendChild(newEmpty.cloneNode(true));
|
||||
}
|
||||
|
||||
var currentPagination = getPaginationEl(commentsArea);
|
||||
var newPagination = getPaginationEl(newComments);
|
||||
if (currentPagination && newPagination) {
|
||||
currentPagination.replaceWith(newPagination.cloneNode(true));
|
||||
} else if (currentPagination && !newPagination) {
|
||||
currentPagination.remove();
|
||||
}
|
||||
|
||||
var currentCount = commentsArea.querySelector(".comments-count");
|
||||
var newCount = newComments.querySelector(".comments-count");
|
||||
if (currentCount && newCount) {
|
||||
currentCount.textContent = newCount.textContent;
|
||||
}
|
||||
|
||||
if (window.history && typeof window.history.replaceState === "function") {
|
||||
window.history.replaceState(null, "", url.toString());
|
||||
}
|
||||
|
||||
@@ -9,6 +9,60 @@
|
||||
|
||||
defined('ABSPATH') || exit;
|
||||
|
||||
if (!function_exists('aksrt_comments_template_query_args')) :
|
||||
/**
|
||||
* Apply order / author-only filters to the comments template query.
|
||||
*
|
||||
* @param array<string,mixed> $args Comment query args.
|
||||
* @return array<string,mixed>
|
||||
*/
|
||||
function aksrt_comments_template_query_args(array $args): array {
|
||||
$order = isset($_GET['aksrt_comment_order'])
|
||||
? sanitize_key((string) wp_unslash($_GET['aksrt_comment_order']))
|
||||
: '';
|
||||
if ($order === '') {
|
||||
$settings = class_exists('AKSRT_Settings')
|
||||
? AKSRT_Settings::get_comment_display_settings()
|
||||
: [];
|
||||
$order = (($settings['order'] ?? 'desc') === 'asc') ? 'oldest' : 'newest';
|
||||
}
|
||||
if (!in_array($order, ['newest', 'oldest', 'hottest'], true)) {
|
||||
$order = 'newest';
|
||||
}
|
||||
|
||||
if ($order === 'oldest') {
|
||||
$args['order'] = 'ASC';
|
||||
$args['orderby'] = 'comment_date_gmt';
|
||||
} else {
|
||||
// newest + hottest: base DESC; hottest reorders via comments_clauses.
|
||||
$args['order'] = 'DESC';
|
||||
$args['orderby'] = 'comment_date_gmt';
|
||||
}
|
||||
|
||||
if (isset($_GET['aksrt_author_only']) && (int) wp_unslash($_GET['aksrt_author_only']) === 1) {
|
||||
$post_id = (int) get_queried_object_id();
|
||||
if ($post_id <= 0 && !empty($args['post_id'])) {
|
||||
$post_id = (int) $args['post_id'];
|
||||
}
|
||||
$author_id = $post_id > 0 ? (int) get_post_field('post_author', $post_id) : 0;
|
||||
if ($author_id > 0) {
|
||||
$args['user_id'] = $author_id;
|
||||
}
|
||||
}
|
||||
|
||||
return $args;
|
||||
}
|
||||
endif;
|
||||
|
||||
add_filter('comments_template_query_args', static function ($args) {
|
||||
if (!is_array($args)) {
|
||||
$args = [];
|
||||
}
|
||||
return function_exists('aksrt_comments_template_query_args')
|
||||
? aksrt_comments_template_query_args($args)
|
||||
: $args;
|
||||
});
|
||||
|
||||
if (!function_exists('aksrt_comments_build_context')) :
|
||||
/**
|
||||
* Resolve comments runtime context once.
|
||||
@@ -208,13 +262,19 @@ if (!function_exists('aksrt_comments_render_filter')) :
|
||||
$author_only = !empty($ctx['author_only']);
|
||||
$post_author_id = (int) $ctx['post_author_id'];
|
||||
?>
|
||||
<div class="comment-filter tab-nav-theme flex ac jsb">
|
||||
<ul class="list-inline comment-order-box">
|
||||
<li class="<?php echo $order === 'newest' ? 'active' : ''; ?>"><a href="javascript:;" class="comment-orderby" data-order="newest"><?php esc_html_e('最新', 'aksrt'); ?></a></li>
|
||||
<li class="<?php echo $order === 'hottest' ? 'active' : ''; ?>"><a href="javascript:;" class="comment-orderby" data-order="hottest"><?php esc_html_e('最热', 'aksrt'); ?></a></li>
|
||||
<div class="comment-filter tab-nav-theme flex ac jsb" win-ajax-replace="comment-order-btn">
|
||||
<ul class="list-inline comment-order-box comment-filter__tabs">
|
||||
<li class="<?php echo $order === 'newest' ? 'active' : ''; ?>">
|
||||
<a href="javascript:;" class="comment-orderby" data-order="newest" rel="nofollow"><?php esc_html_e('最新', 'aksrt'); ?></a>
|
||||
</li>
|
||||
<li class="<?php echo $order === 'hottest' ? 'active' : ''; ?>">
|
||||
<a href="javascript:;" class="comment-orderby" data-order="hottest" rel="nofollow"><?php esc_html_e('最热', 'aksrt'); ?></a>
|
||||
</li>
|
||||
</ul>
|
||||
<?php if ($post_author_id > 0) : ?>
|
||||
<a href="javascript:;" class="btn-only-author<?php echo $author_only ? ' active' : ''; ?> comment-author-filter" data-author-only="<?php echo $author_only ? '0' : '1'; ?>"><?php esc_html_e('只看作者', 'aksrt'); ?></a>
|
||||
<a href="javascript:;" class="but comment-orderby btn-only-author p2-10 comment-author-filter<?php echo $author_only ? ' active' : ''; ?>" data-author-only="<?php echo $author_only ? '0' : '1'; ?>" rel="nofollow">
|
||||
<?php echo $author_only ? esc_html__('查看全部', 'aksrt') : esc_html__('只看作者', 'aksrt'); ?>
|
||||
</a>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
<?php
|
||||
@@ -306,10 +366,17 @@ if (!function_exists('aksrt_comments_render')) :
|
||||
<?php endif; ?>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php
|
||||
// Keep filter visible under author-only empty results.
|
||||
$show_filter = !empty($ctx['corderby_enabled']) && ((int) $ctx['comment_count'] > 0 || !empty($ctx['author_only']) || have_comments());
|
||||
if ($show_filter) {
|
||||
aksrt_comments_render_filter($ctx);
|
||||
}
|
||||
?>
|
||||
|
||||
<?php if (have_comments()) : ?>
|
||||
<?php aksrt_comments_render_filter($ctx); ?>
|
||||
<?php aksrt_comments_render_list($ctx); ?>
|
||||
<?php elseif (!have_comments() && !post_password_required()) : ?>
|
||||
<?php elseif (!post_password_required()) : ?>
|
||||
<?php aksrt_comments_render_empty($ctx); ?>
|
||||
<?php endif; ?>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user