summaryrefslogtreecommitdiff
path: root/static/js/main.js
diff options
context:
space:
mode:
Diffstat (limited to 'static/js/main.js')
-rw-r--r--static/js/main.js75
1 files changed, 11 insertions, 64 deletions
diff --git a/static/js/main.js b/static/js/main.js
index 18316e0..b4bcc4f 100644
--- a/static/js/main.js
+++ b/static/js/main.js
@@ -1,75 +1,22 @@
/*
- * Utils
+ * Minimal JS for Mobile Menu and Table of Contents Toggle
*/
-// Throttle Helper
-const throttle = (callback, limit) => {
- let timeoutHandler = null;
- return () => {
- if (timeoutHandler === null) {
- timeoutHandler = setTimeout(() => {
- callback();
- timeoutHandler = null;
- }, limit);
- }
- };
-};
-
-// addEventListener Helper
-const listen = (selector, eventType, callback) => {
- const element = document.querySelector(selector);
- if (element) {
- element.addEventListener(eventType, callback);
- }
-};
-
-// Auto Hide Header
-const header = document.getElementById('site-header');
-let lastScrollPosition = window.scrollY;
-
-const autoHideHeader = () => {
- const currentScrollPosition = window.scrollY;
-
- header.classList.toggle('slideInUp', currentScrollPosition <= lastScrollPosition);
- header.classList.toggle('slideOutDown', currentScrollPosition > lastScrollPosition);
-
- lastScrollPosition = currentScrollPosition;
-};
-
-// Mobile Menu Toggle
-let mobileMenuVisible = false;
-const mobileMenu = document.getElementById('mobile-menu');
-
-const toggleMobileMenu = () => {
- const animationName = mobileMenuVisible ? 'bounceOutRight' : 'bounceInRight';
- mobileMenu.style.animationName = animationName;
- mobileMenu.style.display = mobileMenuVisible ? 'none' : 'block';
- mobileMenuVisible = !mobileMenuVisible;
-};
-
-// Featured Image Toggle
-const toggleImg = () => {
- document.querySelector('.bg-img').classList.toggle('show-bg-img');
-};
-
// Table of Contents Toggle
const toggleToc = () => {
document.getElementById('toc').classList.toggle('show-toc');
};
-// Event Listeners
-const setupEventListeners = () => {
- if (header) {
- const throttledAutoHideHeader = throttle(autoHideHeader, 250);
-
- listen('#menu-btn', 'click', toggleMobileMenu);
- listen('#toc-btn', 'click', toggleToc);
- listen('#img-btn', 'click', toggleImg);
- listen('.bg-img', 'click', toggleImg);
-
- window.addEventListener('scroll', throttledAutoHideHeader);
+// Mobile Menu Toggle
+let mobileMenuVisible = false;
+const toggleMobileMenu = () => {
+ const mobileMenu = document.getElementById('mobile-menu');
+ if (mobileMenu) {
+ mobileMenu.style.display = mobileMenuVisible ? 'none' : 'block';
+ mobileMenuVisible = !mobileMenuVisible;
}
};
-// Execute setup function when DOM is fully loaded
-document.addEventListener('DOMContentLoaded', setupEventListeners);
+// Event Listeners
+document.querySelector('#toc-btn')?.addEventListener('click', toggleToc);
+document.querySelector('#menu-btn')?.addEventListener('click', toggleMobileMenu);