diff options
Diffstat (limited to 'layouts/_partials')
| -rw-r--r-- | layouts/_partials/posts/action-menu.html | 148 |
1 files changed, 67 insertions, 81 deletions
diff --git a/layouts/_partials/posts/action-menu.html b/layouts/_partials/posts/action-menu.html index 1a7c0c56..c1d4cd55 100644 --- a/layouts/_partials/posts/action-menu.html +++ b/layouts/_partials/posts/action-menu.html @@ -54,128 +54,114 @@ } </style> -<script> -// 评论展开/收起功能 -document.addEventListener('DOMContentLoaded', function() { +<script defer> +// 初始化所有功能 +function initializeFeatures() { + const pageId = "{{ .File.UniqueID | urlize }}"; + if (!pageId) return; + + // 评论展开/收起功能 + initializeComments(); + // 点赞功能 + initializeLikes(pageId); + // 评论数量获取 + initializeCommentCount(); +} + +// 评论展开/收起功能初始化 +function initializeComments() { const commentsToggle = document.getElementById('comments-toggle'); const commentsSection = document.getElementById('comments-section'); if (commentsToggle && commentsSection) { commentsToggle.addEventListener('click', function() { - if (commentsSection.style.display === 'none') { - commentsSection.style.display = 'block'; - this.style.background = 'rgba(0, 0, 0, 0.1)'; - } else { - commentsSection.style.display = 'none'; - this.style.background = 'transparent'; - } + const isHidden = commentsSection.style.display === 'none'; + commentsSection.style.display = isHidden ? 'block' : 'none'; + this.style.background = isHidden ? 'rgba(0, 0, 0, 0.1)' : 'transparent'; }); } -}); +} -// 获取 Giscus 评论数量 -function fetchGiscusCommentCount() { +// 评论数量功能初始化 +function initializeCommentCount() { const commentCountEl = document.getElementById('comment-count'); if (!commentCountEl) return; - // 设置初始值 commentCountEl.textContent = '0'; - // 监听 Giscus 的消息事件 window.addEventListener('message', function(event) { if (event.origin !== 'https://giscus.app') return; const giscusData = event.data; - - // 检查是否为 IMetadataMessage - 数据结构是 {giscus: {discussion: {...}}} - if (giscusData.giscus && giscusData.giscus.discussion) { + if (giscusData.giscus?.discussion) { const discussion = giscusData.giscus.discussion; - - // 计算总评论数:主评论数 + 回复数 const totalComments = (discussion.totalCommentCount || 0) + (discussion.totalReplyCount || 0); commentCountEl.textContent = totalComments.toString(); } }); } -// 点赞功能 -(function() { - const pageId = "{{ .File.UniqueID | urlize }}"; - if (!pageId) { - return; - } - - const countEl = document.getElementById("like-count-" + pageId); - const btnEl = document.getElementById("like-btn-" + pageId); - const containerEl = document.getElementById("like-container-" + pageId); - - if (!countEl || !btnEl || !containerEl) { - return; - } +// 点赞功能初始化 +function initializeLikes(pageId) { + const elements = { + count: document.getElementById("like-count-" + pageId), + btn: document.getElementById("like-btn-" + pageId), + container: document.getElementById("like-container-" + pageId), + icon: document.getElementById("like-icon-" + pageId) + }; - const likeIconEl = document.getElementById("like-icon-" + pageId); + if (!elements.count || !elements.btn || !elements.container) return; function updateTooltip() { - if (containerEl.classList.contains('liked')) { - btnEl.setAttribute('title', btnEl.getAttribute('data-liked-title')); - } else { - btnEl.setAttribute('title', '为这篇文章献上心脏'); - } + elements.btn.setAttribute('title', + elements.container.classList.contains('liked') + ? elements.btn.getAttribute('data-liked-title') + : '为这篇文章献上心脏' + ); } function setLikedState() { - if (likeIconEl) { - likeIconEl.classList.add('liked-heart', 'heartbeat'); - } - if (countEl) { - countEl.classList.add('liked-count'); - } - btnEl.disabled = true; - containerEl.classList.add('liked'); + elements.icon?.classList.add('liked-heart', 'heartbeat'); + elements.count?.classList.add('liked-count'); + elements.btn.disabled = true; + elements.container.classList.add('liked'); updateTooltip(); } - function fetchLikes() { - fetch("https://like.guhub.cn/like/" + pageId) - .then(resp => resp.json()) - .then(data => { - countEl.innerText = data.likes ?? 0; - if (localStorage.getItem("liked_" + pageId)) { - setLikedState(); - } - }) - .catch(() => { - countEl.innerText = "❌"; - }); + async function fetchLikes() { + try { + const response = await fetch("https://like.guhub.cn/like/" + pageId); + const data = await response.json(); + elements.count.innerText = data.likes ?? 0; + if (localStorage.getItem("liked_" + pageId)) { + setLikedState(); + } + } catch { + elements.count.innerText = "❌"; + } } - window.sendLike = function(pageId) { + window.sendLike = async function(pageId) { if (localStorage.getItem("liked_" + pageId)) return; - if (window.location.hostname !== 'localhost') { - if (typeof umami !== 'undefined') { - umami.track('👍 Hit Like Button'); - } + if (window.location.hostname !== 'localhost' && typeof umami !== 'undefined') { + umami.track('👍 Hit Like Button'); } - fetch("https://like.guhub.cn/like/" + pageId, { method: "POST" }) - .then(resp => resp.json()) - .then(data => { - localStorage.setItem("liked_" + pageId, "1"); - countEl.innerText = data.likes ?? 1; - setLikedState(); - }) - .catch(() => { - alert("点赞失败,请稍后再试"); - }); + try { + const response = await fetch("https://like.guhub.cn/like/" + pageId, { method: "POST" }); + const data = await response.json(); + localStorage.setItem("liked_" + pageId, "1"); + elements.count.innerText = data.likes ?? 1; + setLikedState(); + } catch { + alert("点赞失败,请稍后再试"); + } }; - // 初始化 fetchLikes(); -})(); +} -// 初始化评论数量获取 -document.addEventListener('DOMContentLoaded', function() { - fetchGiscusCommentCount(); -}); +// 在 DOM 加载完成后初始化所有功能 +document.addEventListener('DOMContentLoaded', initializeFeatures); </script> |
