diff options
| author | Eltrac <hi@guhub.cn> | 2025-08-02 09:27:40 +0800 |
|---|---|---|
| committer | Eltrac <hi@guhub.cn> | 2025-08-02 09:27:40 +0800 |
| commit | ea845e50495d79f48315c281186a51aa486ae263 (patch) | |
| tree | 2c84db4e66e639b6dc40d9e4dece3227cbb9cad2 /layouts/_partials/posts | |
| parent | 472574f12a7b9c2f4617feda17e54d940dfc8972 (diff) | |
perf: refactor render-blocking action-menu logic
- put initialization script at the end of the page
- delay initialization furthermore
- delay comment count fetch after giscus iframe is loaded
Diffstat (limited to 'layouts/_partials/posts')
| -rw-r--r-- | layouts/_partials/posts/action-menu.html | 116 |
1 files changed, 0 insertions, 116 deletions
diff --git a/layouts/_partials/posts/action-menu.html b/layouts/_partials/posts/action-menu.html index dcc881d3..602004c8 100644 --- a/layouts/_partials/posts/action-menu.html +++ b/layouts/_partials/posts/action-menu.html @@ -53,119 +53,3 @@ color: #8B0000 !important; } </style> - -<script defer> -// 初始化所有功能 -function initializeFeatures() { - const pageId = "{{ .File.UniqueID | urlize }}"; - console.log(pageId) - 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() { - const isHidden = commentsSection.style.display === 'none'; - commentsSection.style.display = isHidden ? 'block' : 'none'; - this.style.background = isHidden ? 'rgba(0, 0, 0, 0.1)' : 'transparent'; - }); - } -} - -// 评论数量功能初始化 -function initializeCommentCount() { - const commentCountEl = document.getElementById('comment-count'); - if (!commentCountEl) return; - - commentCountEl.textContent = '0'; - - window.addEventListener('message', function(event) { - if (event.origin !== 'https://giscus.app') return; - - const giscusData = event.data; - if (giscusData.giscus?.discussion) { - const discussion = giscusData.giscus.discussion; - const totalComments = (discussion.totalCommentCount || 0) + (discussion.totalReplyCount || 0); - commentCountEl.textContent = totalComments.toString(); - } - }); -} - -// 点赞功能初始化 -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) - }; - - if (!elements.count || !elements.btn || !elements.container) return; - - function updateTooltip() { - elements.btn.setAttribute('title', - elements.container.classList.contains('liked') - ? elements.btn.getAttribute('data-liked-title') - : '为这篇文章献上心脏' - ); - } - - function setLikedState() { - elements.icon?.classList.add('liked-heart'); - elements.icon?.classList.add('animate-heart-beat'); - elements.count?.classList.add('liked-count'); - elements.btn.disabled = true; - elements.container.classList.add('liked'); - updateTooltip(); - } - - 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(e) { - console.log(e); - elements.count.innerText = "❌"; - } - } - - window.sendLike = async function(pageId) { - if (localStorage.getItem("liked_" + pageId)) return; - - if (window.location.hostname !== 'localhost' && typeof umami !== 'undefined') { - umami.track('👍 Hit Like Button'); - } - - 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(e) { - console.log(e); - alert("点赞失败,请稍后再试"); - } - }; - - fetchLikes(); -} - -// 在 DOM 加载完成后初始化所有功能 -document.addEventListener('DOMContentLoaded', initializeFeatures); -</script> |
