diff options
| author | Eltrac <hi@guhub.cn> | 2025-10-13 09:34:25 +0800 |
|---|---|---|
| committer | Eltrac <hi@guhub.cn> | 2025-10-13 09:34:25 +0800 |
| commit | 9b33cfcc8fd8cc52d09c599efd06108b1e35d0d7 (patch) | |
| tree | 1e2153619859955608bd4d4e7441aad512d5ad02 /layouts/_partials/scripts/action-menu-js.html | |
| parent | 459b3fb1230c664f3ee0e6e27a54eb4fb22e2da6 (diff) | |
refactor: move all action menu js to individual modules
Diffstat (limited to 'layouts/_partials/scripts/action-menu-js.html')
| -rw-r--r-- | layouts/_partials/scripts/action-menu-js.html | 170 |
1 files changed, 0 insertions, 170 deletions
diff --git a/layouts/_partials/scripts/action-menu-js.html b/layouts/_partials/scripts/action-menu-js.html deleted file mode 100644 index dca99369..00000000 --- a/layouts/_partials/scripts/action-menu-js.html +++ /dev/null @@ -1,170 +0,0 @@ -{{ $pageId := . }} -<script defer> -/** - * ================= - * Initialize all Action Menu features - * - comment count - * - like - * ================= - */ - -/** - * ================= - * Fetch and set Comment Count - * ================= - */ - -function initializeCommentCount() { - const commentCountEl = document.getElementById('comment-count'); - if (!commentCountEl) return; - - const observer = new MutationObserver(() => { - // check if giscus is loaded - const giscusIframe = document.querySelector('iframe.giscus-frame'); - if (!giscusIframe) return; - - giscusIframe.addEventListener('load', () => { - // receive message from giscus iframe - 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); - // set comment count - commentCountEl.textContent = totalComments.toString(); - // if no discussion found, set to 0 - } else commentCountEl.textContent = '0'; - }); - }); - - observer.disconnect(); - }); - observer.observe(document.body, { childList: true, subtree: true }); -} - -/** - * ================= - * Initialize like functionality - * ================= - */ - -function initializeLikes(pageId) { - if (window.location.host !== 'www.geedea.pro') return; - - 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 setLikedState() { - // update classes - 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'); - // update tooltip - elements.btn.setAttribute('title', - elements.container.classList.contains('liked') - ? elements.btn.getAttribute('data-liked-title') - : '为这篇文章献上心脏' - ); - } - - 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(); - updateOrganFarm(data.likes); - } - } catch(e) { - console.log(e); - elements.count.innerText = "❌"; - } - } - - window.sendLike = async function(pageId) { - if (localStorage.getItem("liked_" + pageId)) return; - - 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; - updateOrganFarm(data.likes); - setLikedState(); - } catch(e) { - console.log(e); - alert("点赞失败,请稍后再试"); - } - }; - - function updateOrganFarm(count) { - const organFarm = document.getElementById("organ-farm"); - const organCount = count || parseInt(elements.count.innerText); - const organImages = [ - "https://image.guhub.cn/picgo2025/oragn-3.png", - "https://image.guhub.cn/picgo2025/organ-1.png", - "https://image.guhub.cn/picgo2025/organ-2.png" - ]; - - if (!organFarm) return; - if (organFarm.classList.contains("hidden")) { - organFarm.classList.remove("hidden"); - organFarm.classList.add("animate-slide-in-down"); - } - - organFarm.innerHTML = ""; - for (let i = 0; i < organCount; i++) { - const img = document.createElement("img"); - img.className = "transition hover:scale-150 dark:invert"; - - const sizeRange = [6, 10]; - const size = Math.floor(Math.random() * (sizeRange[1] - sizeRange[0] + 1)) + sizeRange[0]; - img.classList.add(`w-${size}`, `h-${size}`); - - img.src = organImages[Math.floor(Math.random() * organImages.length)]; - // randomly offset and rotate - img.classList.add("rotate-" + Math.floor(Math.random() * 5)); - img.classList.add("translate-x-" + Math.floor(Math.random() * 5)); - img.classList.add("translate-y-" + Math.floor(Math.random() * 5)); - img.classList.add("opacity" + (100 - Math.floor(Math.random() * 3)*10)); - - organFarm.appendChild(img); - } - } - - // fetch likes when action menu is visible - const observer = new IntersectionObserver((entries, obs) => { - if (entries[0].isIntersecting) { - fetchLikes(); - obs.disconnect(); - } - }); - observer.observe(document.getElementById("action-menu")); -} - -/** - * ================= - * Load features after DOMContentLoaded - * ================= - */ - -function initializeFeatures() { - const pageId = "{{ $pageId }}"; - if (!pageId) return; - - initializeLikes(pageId); - initializeCommentCount(); -} - -document.addEventListener('DOMContentLoaded', initializeFeatures); -</script> |
