init

layouts/partials/custom/head-end.html

@@ -1,36 +1,97 @@
 <script>
-    document.addEventListener('DOMContentLoaded', function() {
-        // Select the specific UL for the desktop sidebar
-        // The class 'max-md:hx-hidden' contains a colon, which needs to be escaped with a backslash in CSS selectors.
-        const desktopSidebarUl = document.querySelector('ul.hx-flex.hx-flex-col.hx-gap-1.max-md\\:hx-hidden');
 
-        if (desktopSidebarUl) {
-            // Select all <a> tags that are direct children of <li> tags,
-            // where those <li> tags are direct children of the desktopSidebarUl.
-            // This targets only the anchors of the first-level list items.
-            const firstLevelAnchors = desktopSidebarUl.querySelectorAll(':scope > li > a');
+document.addEventListener('DOMContentLoaded', function() {
+
+    /**
+     * 为指定的侧边栏菜单应用点击阻止逻辑。
+     * @param {string} selector - 目标 <ul> 元素的 CSS 选择器。
+     * @param {string} menuType - 菜单类型（例如 'Desktop' 或 'Mobile'），用于日志记录。
+     */
+    function applyClickPrevention(selector, menuType) {
+        // 使用提供的选择器查找菜单UL元素
+        // 注意：CSS选择器中的冒号需要用反斜杠转义
+        const menuUl = document.querySelector(selector);
+
+        if (menuUl) {
+            // 选择该UL下所有第一级的<a>标签
+            const firstLevelAnchors = menuUl.querySelectorAll(':scope > li > a');
+            let preventedCount = 0;
 
             firstLevelAnchors.forEach(anchor => {
-                anchor.addEventListener('click', function(event) {
-                    // Prevent the default navigation action of the link
-                    event.preventDefault();
-                    console.log('Default navigation prevented for:', anchor.href);
-                    // You can add other actions here if needed,
-                    // for example, toggling a sub-menu, which might already be
-                    // handled by your existing CSS/JS for the 'open' class.
-                    // For demonstration, let's toggle a class on the parent LI
-                    // This part is optional and depends on how your menu expansion works
-                    const parentLi = anchor.closest('li');
-                    if (parentLi) {
-                        parentLi.classList.toggle('open'); // Example: toggle 'open' if it's not handled elsewhere
-                        console.log(parentLi.classList.contains('open') ? 'Opened' : 'Closed', 'submenu for:', anchor.textContent.trim());
-                    }
-                });
+                const parentLi = anchor.closest('li');
+                // 检查这个li内部是否包含一个子菜单（另一个ul）
+                const hasSubmenu = parentLi && parentLi.querySelector('ul');
+
+                // **仅当存在子菜单时**，才阻止链接的默认导航行为
+                if (hasSubmenu) {
+                    anchor.addEventListener('click', function(event) {
+                        // 阻止链接的默认导航行为
+                        event.preventDefault();
+                        console.log(`[${menuType}] Default navigation prevented for:`, anchor.href);
+
+                        // 切换父级li的 'open' 类以展开/折叠子菜单
+                        if (parentLi) {
+                            parentLi.classList.toggle('open');
+                            console.log(`[${menuType}] ${parentLi.classList.contains('open') ? 'Opened' : 'Closed'} submenu for:`, anchor.textContent.trim());
+                        }
+                    });
+                    preventedCount++;
+                }
             });
 
-            console.log(`Added click prevention to ${firstLevelAnchors.length} first-level <a> tags in the specified desktop UL.`);
+            console.log(`[${menuType}] Added click prevention to ${preventedCount} first-level <a> tags with submenus in '${selector}'.`);
         } else {
-            console.warn('The specified desktop UL (ul.hx-flex.hx-flex-col.hx-gap-1.max-md:hx-hidden) was not found.');
+            console.warn(`[${menuType}] The specified UL ('${selector}') was not found.`);
         }
+    }
+
+    // --- 主逻辑 ---
+
+    // 1. 定义桌面端菜单的选择器
+    const desktopMenuSelector = 'ul.hx-flex.hx-flex-col.hx-gap-1.max-md\\:hx-hidden';
+
+    // 2. 定义移动端菜单的选择器
+    // 通常，移动端菜单的类与桌面端相反（例如，在md及以上屏幕隐藏）
+    // !!! 请根据你的HTML结构检查并确认这个选择器是正确的 !!!
+    const mobileMenuSelector = 'ul.hx-flex.hx-flex-col.hx-gap-1.md\\:hx-hidden';
+
+    // 3. 分别为桌面和移动端菜单应用逻辑
+    applyClickPrevention(desktopMenuSelector, 'Desktop Menu');
+    applyClickPrevention(mobileMenuSelector, 'Mobile Menu');
+
+});
+
+/**
+ * @name localizeTimeTags
+ * @description 检测并转换页面上所有<time>标签的时间到用户本地时区。
+ *              它会读取<time>标签的 `datetime` 属性（应为UTC时间），
+ *              并将其内容更新为用户本地时区的时间字符串。
+ */
+function localizeTimeTags() {
+    // 1. 获取所有 <time> 元素
+    const timeElements = document.querySelectorAll('time');
+
+    // 2. 遍历每个元素
+    timeElements.forEach(timeEl => {
+        // 3. 获取 UTC 时间字符串
+        const utcDateTime = timeEl.getAttribute('datetime');
+        if (!utcDateTime) {
+            return; // 跳过没有 datetime 属性的标签
+        }
+
+        // 4. 创建 Date 对象
+        const dateObj = new Date(utcDateTime);
+        if (isNaN(dateObj.getTime())) {
+            return; // 跳过无效的日期
+        }
+
+        // 5. 转换为本地化字符串并更新内容
+        // toLocaleString() 会自动处理时区偏移
+        timeEl.textContent = dateObj.toLocaleString();
     });
+}
+
+// 确保在HTML文档加载完毕后运行此脚本
+document.addEventListener('DOMContentLoaded', localizeTimeTags);
+
 </script>