Files
blog/themes/Ying/assets/js/modules/floating-tools.js
T
2026-01-31 19:24:22 +08:00

107 lines
3.6 KiB
JavaScript

window.initFloatingTools = function() {
// 1. Back to Top
var backToTopButton = document.getElementById('back-to-top');
if (backToTopButton) {
var ticking = false;
function update() {
var btn = document.getElementById('back-to-top');
if (!btn) return;
if (window.scrollY > 300) {
if (!btn.classList.contains('show')) {
btn.classList.add('show');
}
} else {
if (btn.classList.contains('show')) {
btn.classList.remove('show');
}
}
ticking = false;
}
// Global Scroll Handler
if (!window.backToTopScrollHandler) {
window.backToTopScrollHandler = function() {
if (!ticking) {
window.requestAnimationFrame(update);
ticking = true;
}
};
window.addEventListener('scroll', window.backToTopScrollHandler, { passive: true });
}
// Re-bind click event
var newBtn = backToTopButton.cloneNode(true);
backToTopButton.parentNode.replaceChild(newBtn, backToTopButton);
backToTopButton = newBtn;
backToTopButton.addEventListener('click', function(e) {
e.preventDefault();
window.scrollTo({
top: 0,
behavior: 'smooth'
});
});
}
// 2. Theme Toggle
var themeToggle = document.getElementById('theme-toggle');
if (themeToggle) {
var newToggle = themeToggle.cloneNode(true);
themeToggle.parentNode.replaceChild(newToggle, themeToggle);
themeToggle = newToggle;
// Update icon based on current theme
var updateIcon = function() {
var currentTheme = document.documentElement.getAttribute('data-theme');
var icon = themeToggle.querySelector('i');
if (icon) {
if (currentTheme === 'dark') {
icon.className = 'ri-moon-line';
} else {
icon.className = 'ri-sun-line';
}
}
};
updateIcon();
themeToggle.addEventListener('click', function() {
var currentTheme = document.documentElement.getAttribute('data-theme');
var newTheme = currentTheme === 'dark' ? 'light' : 'dark';
document.documentElement.setAttribute('data-theme', newTheme);
localStorage.setItem('theme', newTheme);
updateIcon();
// Trigger Artalk theme update
if (window.artalk) {
window.artalk.setDarkMode(newTheme === 'dark');
}
});
}
// 3. To Comments
var toComments = document.getElementById('to-comments');
if (toComments) {
var newToComments = toComments.cloneNode(true);
toComments.parentNode.replaceChild(newToComments, toComments);
toComments = newToComments;
toComments.addEventListener('click', function(e) {
e.preventDefault();
var comments = document.getElementById('Comments');
if (comments) {
comments.scrollIntoView({ behavior: 'smooth' });
} else {
var artalkEl = document.querySelector('.artalk');
if (artalkEl) {
artalkEl.scrollIntoView({ behavior: 'smooth' });
} else {
window.scrollTo({ top: document.body.scrollHeight, behavior: 'smooth' });
}
}
});
}
};