MediaWiki:Gadget-RightToolbar.js：修订间差异

以互动方式浏览历史

←上一编辑下一编辑→

删除的内容添加的内容

行内

@@ 第1行： / 第1行： @@
 /* ================================================================
-   MediaWiki Gadget: Custom Tools Bar（多语言时间显示版）
+   MediaWiki Gadget: Custom Tools Bar with Localized Clock
    功能：
    - 回到顶部 / 回到底部按钮
-   - 实时时钟（显示浏览器时区 + UTC）
+   - 本地化日期和时间显示（浏览器时区 + UTC）
-   - 根据用户语言切换日期时间格式
    - 深色模式自动适配
    - 动态显示按钮 + 平滑动画
+   作者：你自己
    ================================================================= */
-mw.loader.using(['mediawiki.util', 'mediawiki.user'], function () {
+mw.loader.using(['mediawiki.util', 'mediawiki.language'], function () {
-    function updateClock(userLang) {
+    function updateClock() {
-        var now = new Date();
+        // 浏览器本地时间
+        var local = new Date();
+        // UTC 时间，从浏览器系统获取即可
+        var utc = new Date(local.getTime() + local.getTimezoneOffset() * 60000);
-        // 使用 Intl.DateTimeFormat 根据用户语言格式化
+        // MediaWiki 提供的语言设置
-        var localFormatter = new Intl.DateTimeFormat(userLang, {
+        var userLang = mw.config.get('wgUserLanguage') || 'en';
-            year: 'numeric', month: '2-digit', day: '2-digit',
+        // 本地化格式化函数
+        // dateStyle/timeStyle 采用 Intl.DateTimeFormat 可选参数，也可以用短/长格式
+        var localString = new Intl.DateTimeFormat(userLang, {
+            year: 'numeric', month: 'long', day: 'numeric',
             hour: '2-digit', minute: '2-digit', second: '2-digit',
-            hour12: false, timeZoneName: 'short'
+            hour12: false
-        });
+        }).format(local);
-        var localStr = localFormatter.format(now);
+        var utcString = new Intl.DateTimeFormat(userLang, {
-        // UTC 格式
+            year: 'numeric', month: 'long', day: 'numeric',
-        var utcFormatter = new Intl.DateTimeFormat('en-US', {
-            year: 'numeric', month: '2-digit', day: '2-digit',
             hour: '2-digit', minute: '2-digit', second: '2-digit',
-            hour12: false, timeZone: 'UTC', timeZoneName: 'short'
+            hour12: false, timeZone: 'UTC'
-        });
+        }).format(utc);
-        var utcStr = utcFormatter.format(now);
-        $('#current-local').text(localStr);
+        $('#current-local-time').text(localString);
-        $('#current-utc').text(utcStr);
+        $('#current-utc-time').text(utcString);
     }
     $(function () {
         var isMobile = window.innerWidth <= 768;
-        /* ---------- 获取用户语言 ---------- */
-        var userLang = mw.config.get('wgUserLanguage') || 'en';
         /* ---------- 深色模式检测 ---------- */
@@ 第81行： / 第82行： @@
         }
-        /* ---------- 回到顶部 / 底部按钮 ---------- */
+        /* ---------- 按钮 ---------- */
         var $topButton = createButton('mw-scroll-top', '▲', '回到顶部', function () {
             $('html, body').animate({ scrollTop: 0 }, { duration: 500, easing: 'swing' });
         });
         var $bottomButton = createButton('mw-scroll-bottom', '▼', '回到底部', function () {
             $('html, body').animate({ scrollTop: $(document).height() }, { duration: 500, easing: 'swing' });
         });
-        /* ---------- 时钟区域（桌面端） ---------- */
+        /* ---------- 时钟（桌面端） ---------- */
         if (!isMobile) {
             var $clockDiv = $('<div id="current-clock"></div>').css({
@@ 第103行： / 第105行： @@
                 backdropFilter: 'blur(4px)'
             }).append(
-                $('<div id="current-local">加载中...</div>'),
+                $('<div id="current-local-time">加载中...</div>'),
-                $('<div id="current-utc">加载中...</div>')
+                $('<div id="current-utc-time">加载中...</div>')
             );
             $container.append($clockDiv);
@@ 第112行： / 第114行： @@
         $container.append($topButton, $bottomButton);
-        /* ---------- 初次进入的动画效果 ---------- */
+        /* ---------- 初次进入动画 ---------- */
         $container.animate({ opacity: 1, transform: 'translateY(0)' }, 600);
         /* ---------- 时钟定时更新 ---------- */
         if (!isMobile) {
-            updateClock(userLang);
+            updateClock();
-            setInterval(function () { updateClock(userLang); }, 1000);
+            setInterval(updateClock, 1000);
         }
         /* ---------- 滚动动态控制按钮显示 ---------- */
-        $topButton.hide();
+        $topButton.hide(); // 初始隐藏
         $(window).on('scroll', function () {
             var scrollTop = $(this).scrollTop();