1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
|
{{ $pageId := . }}
<script defer>
// 初始化所有功能
function initializeFeatures() {
const pageId = "{{ $pageId }}";
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');
const giscusIframe = document.querySelector('iframe.giscus-frame');
if (!commentCountEl || !giscusIframe) return;
commentCountEl.textContent = '0';
giscusIframe.addEventListener('load', () => {
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', () => {
if ('requestIdleCallback' in window) {
requestIdleCallback(initializeFeatures);
} else {
setTimeout(initializeFeatures, 300);
}
});
</script>
|
