MediaWiki:Common.js

来自RMzas＆SMS_Knowledge_Base_Wiki
FME-514（讨论 | 贡献）2026年10月22日 (四) 01:57:25的版本 （增加BA光标与点击特效开关与生命周期管理）
跳转到导航 跳转到搜索

注意：在保存之后，您可能需要清除浏览器缓存才能看到所作出的变更的影响。

  • Firefox或Safari：按住Shift的同时单击刷新，或按Ctrl-F5或Ctrl-R（Mac为⌘-R）
  • Google Chrome：按Ctrl-Shift-R（Mac为⌘-Shift-R）
  • Internet Explorer：按住Ctrl的同时单击刷新，或按Ctrl-F5
  • Opera：前往菜单 → 设置（Mac为Opera → Preferences），然后隐私和安全 → 清除浏览数据 → 缓存的图片和文件。
/* 这里的任何JavaScript将为所有用户在每次页面载入时加载。 */

/* 阅读主题：仅在当前浏览器保存，未选择时跟随系统。 */
(function () {
  'use strict';

  var root = document.documentElement;
  var storageKey = 'rmzas-wiki-theme';
  var systemTheme = window.matchMedia ? window.matchMedia('(prefers-color-scheme: dark)') : null;
  var selector;
  var mode = 'auto';

  // 防止脚本重复执行时添加多个控件或事件监听。
  if (root.hasAttribute('data-rmzas-theme')) return;

  function normalize(value) {
    return value === 'light' || value === 'dark' ? value : 'auto';
  }

  function applyTheme() {
    var dark = mode === 'dark' || (mode === 'auto' && systemTheme && systemTheme.matches);
    root.setAttribute('data-rmzas-theme', mode);
    root.classList.toggle('rmzas-theme-dark', !!dark);
    if (selector) selector.value = mode;
  }

  try {
    mode = normalize(window.localStorage.getItem(storageKey));
  } catch (error) {
    // 存储不可用时仍允许切换，当前页面内保留选择。
  }
  // 不等待 DOM 就绪，尽早应用配色；Common.js 本身仍是异步加载的。
  applyTheme();

  if (systemTheme) {
    if (systemTheme.addEventListener) {
      systemTheme.addEventListener('change', applyTheme);
    } else if (systemTheme.addListener) {
      systemTheme.addListener(applyTheme);
    }
  }

  window.addEventListener('storage', function (event) {
    if (event.key === storageKey || event.key === null) {
      mode = normalize(event.newValue);
      applyTheme();
    }
  });

  function addThemeControl() {
    if (document.getElementById('rmzas-theme-select')) return;

    // Vector / MonoBook 的个人工具栏；Timeless 使用用户链接区域。
    var menu = document.querySelector('#p-personal ul, #p-personal .mw-portlet-body ul, #p-personal .body ul, #p-personal-inner ul');
    var control = document.createElement(menu ? 'li' : 'div');
    control.id = 'pt-rmzas-theme';
    control.className = 'rmzas-theme-control';
    if (!menu) control.classList.add('rmzas-theme-control-floating');

    var label = document.createElement('label');
    label.htmlFor = 'rmzas-theme-select';
    label.textContent = '主题';
    selector = document.createElement('select');
    selector.id = 'rmzas-theme-select';
    selector.title = '选择阅读主题（此浏览器会记住你的选择）';

    [['auto', '跟随系统'], ['light', '浅色'], ['dark', '深色']].forEach(function (item) {
      var option = document.createElement('option');
      option.value = item[0];
      option.textContent = item[1];
      selector.appendChild(option);
    });
    selector.value = mode;
    selector.addEventListener('change', function () {
      mode = normalize(selector.value);
      applyTheme();
      try {
        window.localStorage.setItem(storageKey, mode);
      } catch (error) {
        // 隐私设置禁用存储时不影响配色或原有站点脚本。
      }
    });

    control.appendChild(label);
    control.appendChild(selector);
    if (menu) {
      menu.insertBefore(control, menu.firstChild);
    } else {
      document.body.appendChild(control);
    }
  }

  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', addThemeControl);
  } else {
    addThemeControl();
  }
})();

/* BA光标与点击特效：支持开启/关闭/跟随系统，仅在当前浏览器保存。 */
(function () {
  'use strict';

  var root = document.documentElement;
  var storageKey = 'rmzas-wiki-fx';
  var scriptUrl = 'http://rmzas.site/wp-content/themes/twentyfifteen/js/ba-click-fx/ba-click-fx.js';
  var motionQuery = window.matchMedia ? window.matchMedia('(prefers-reduced-motion: reduce)') : null;
  var fxInstance = null;
  var BAClickFXClass = null;
  var isImporting = false;
  var selector;
  var mode = 'auto'; // 'auto' | 'on' | 'off'

  if (root.hasAttribute('data-rmzas-fx')) return;

  function normalize(value) {
    return value === 'on' || value === 'off' ? value : 'auto';
  }

  function shouldEnable() {
    if (mode === 'on') return true;
    if (mode === 'off') return false;
    // auto 模式下跟随系统偏好（减弱动态效果时关闭）
    return !(motionQuery && motionQuery.matches);
  }

  function mount(Cls) {
    if (!shouldEnable() || fxInstance) return;
    try {
      fxInstance = new Cls({
        target: '#myCanvas',
        trailAlways: true,
        trailEnabled: true
      });
      window.__rmzasBAClickFX = fxInstance;
    } catch (error) {
      console.error('[BAClickFX] 初始化失败:', error);
    }
  }

  function applyFx() {
    var enabled = shouldEnable();
    root.setAttribute('data-rmzas-fx', mode);
    root.classList.toggle('rmzas-fx-disabled', !enabled);
    if (selector) selector.value = mode;

    if (!enabled) {
      if (fxInstance) {
        try {
          if (typeof fxInstance.destroy === 'function') {
            fxInstance.destroy();
          }
        } catch (error) {
          console.warn('[BAClickFX] 销毁失败:', error);
        }
        fxInstance = null;
        window.__rmzasBAClickFX = null;
      }
      return;
    }

    if (fxInstance) return;

    if (BAClickFXClass) {
      mount(BAClickFXClass);
    } else if (window.BAClickFX) {
      BAClickFXClass = window.BAClickFX;
      mount(BAClickFXClass);
    } else {
      if (isImporting) return;
      isImporting = true;
      try {
        import(scriptUrl)
          .then(function (module) {
            isImporting = false;
            BAClickFXClass = module.BAClickFX || module.default;
            window.BAClickFX = BAClickFXClass;
            mount(BAClickFXClass);
          })
          .catch(function (error) {
            isImporting = false;
            console.error('[BAClickFX] 加载失败:', error);
          });
      } catch (error) {
        isImporting = false;
        console.error('[BAClickFX] 动态 import 不可用:', error);
      }
    }
  }

  try {
    mode = normalize(window.localStorage.getItem(storageKey));
  } catch (error) {
    // 存储不可用时当前页面内保留选择。
  }

  // 暴露全局接口，方便外部脚本注册或检测状态
  window.__rmzasGetFxState = shouldEnable;
  window.__rmzasRegisterBAClickFX = function (instance) {
    fxInstance = instance;
    window.__rmzasBAClickFX = instance;
    if (!shouldEnable()) {
      applyFx();
    }
  };

  applyFx();

  if (motionQuery) {
    if (motionQuery.addEventListener) {
      motionQuery.addEventListener('change', applyFx);
    } else if (motionQuery.addListener) {
      motionQuery.addListener(applyFx);
    }
  }

  window.addEventListener('storage', function (event) {
    if (event.key === storageKey || event.key === null) {
      mode = normalize(event.newValue);
      applyFx();
    }
  });

  function addFxControl() {
    if (document.getElementById('rmzas-fx-select')) return;

    var menu = document.querySelector('#p-personal ul, #p-personal .mw-portlet-body ul, #p-personal .body ul, #p-personal-inner ul');
    var control = document.createElement(menu ? 'li' : 'div');
    control.id = 'pt-rmzas-fx';
    control.className = 'rmzas-fx-control';
    if (!menu) control.classList.add('rmzas-fx-control-floating');

    var label = document.createElement('label');
    label.htmlFor = 'rmzas-fx-select';
    label.textContent = '特效';
    selector = document.createElement('select');
    selector.id = 'rmzas-fx-select';
    selector.title = '选择是否开启BA光标与点击特效（此浏览器会记住你的选择）';

    [['auto', '跟随系统'], ['on', '开启'], ['off', '关闭']].forEach(function (item) {
      var option = document.createElement('option');
      option.value = item[0];
      option.textContent = item[1];
      selector.appendChild(option);
    });
    selector.value = mode;
    selector.addEventListener('change', function () {
      mode = normalize(selector.value);
      applyFx();
      try {
        window.localStorage.setItem(storageKey, mode);
      } catch (error) {}
    });

    control.appendChild(label);
    control.appendChild(selector);

    var themeControl = document.getElementById('pt-rmzas-theme');
    if (themeControl && themeControl.nextSibling) {
      themeControl.parentNode.insertBefore(control, themeControl.nextSibling);
    } else if (themeControl && themeControl.parentNode) {
      themeControl.parentNode.appendChild(control);
    } else if (menu) {
      menu.appendChild(control);
    } else {
      document.body.appendChild(control);
    }
  }

  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', addFxControl);
  } else {
    addFxControl();
  }
})();

// 显示最近更新的页面列表（带时间）
setTimeout(function() {
  //console.log('开始加载最近更新页面列表');
  
  var sidebar = document.getElementById('mw-panel');
  if (!sidebar) {
    console.log('未找到侧边栏');
    return;
  }
  
  var items = sidebar.getElementsByTagName('li');
  var targetItem = null;
  for (var i = 0; i < items.length; i++) {
    if (items[i].textContent.indexOf('最近更新') !== -1) {
      targetItem = items[i];
      break;
    }
  }
  
  if (!targetItem) {
    console.log('未找到目标容器');
    return;
  }
  
  targetItem.textContent = '';
  targetItem.innerHTML = '最近更新：<br>加载中...';
  
  // API请求添加timestamp参数，获取更新时间
  var apiUrl = mw.util.wikiScript('api') + '?';
  apiUrl += 'action=query';
  apiUrl += '&list=recentchanges';
  apiUrl += '&rcprop=title|timestamp'; // 同时获取标题和时间戳
  apiUrl += '&rclimit=10';
  apiUrl += '&rcdaylimit=30';
  apiUrl += '&format=json';
  
  fetch(apiUrl)
    .then(function(response) {
      if (!response.ok) throw new Error('API请求失败：' + response.status);
      return response.json();
    })
    .then(function(data) {
      targetItem.innerHTML = '最近更新：<br>';
      
      if (!data.query || !data.query.recentchanges || data.query.recentchanges.length === 0) {
        targetItem.innerHTML += '暂无更新';
        return;
      }
      
      var seenTitles = new Set();
      var uniqueUpdates = [];
      for (var i = 0; i < data.query.recentchanges.length; i++) {
        var page = data.query.recentchanges[i];
        var title = page.title;
        if (!seenTitles.has(title)) {
          seenTitles.add(title);
          uniqueUpdates.push(page); // 包含title和timestamp
          if (uniqueUpdates.length >= 6) break;
        }
      }
      
      var list = document.createElement('ul');
      list.style.listStyle = 'none';
      list.style.paddingLeft = '10px';
      list.style.margin = '5px 0';
      
      uniqueUpdates.forEach(function(page) {
        // 处理时间戳：转换为本地时间（年-月-日 时:分）
        var date = new Date(page.timestamp);
        var timeStr = date.toLocaleString('zh-CN', {
          month: '2-digit',    // 月份（2位）
          day: '2-digit',      // 日期（2位）
          hour: '2-digit',     // 小时（2位）
          minute: '2-digit',   // 分钟（2位）
          second: '2-digit',   // 新增：显示秒（2位）
          hour12: false        // 强制24小时制（避免上午/下午）
        }).replace(',', '');   // 移除可能的逗号分隔符
        
        var listItem = document.createElement('li');
        listItem.style.margin = '3px 0'; // 每条间距
        
        var link = document.createElement('a');
        link.href = mw.util.getUrl(page.title);
        link.textContent = page.title;
        
        // 时间显示（灰色小字）
        var timeSpan = document.createElement('span');
        timeSpan.textContent = ' (' + timeStr + ')';
        timeSpan.className = 'rmzas-recent-time';
        timeSpan.style.fontSize = '0.8em'; // 小字
        timeSpan.style.marginLeft = '5px';
        
        listItem.appendChild(link);
        listItem.appendChild(timeSpan);
        list.appendChild(listItem);
      });
      
      targetItem.appendChild(list);
    })
    .catch(function(error) {
      console.error('加载失败：', error);
      targetItem.innerHTML = '最近更新：<br>加载失败';
    });
  
}, 1000);
取自“http://rmzas.site/wiki/index.php?title=MediaWiki:Common.js&oldid=1696”