跳转到内容
打开/关闭菜单
  • 451 条目
  • 806 文件
  • 22 用户
  • 9167 编辑
Blockland Wiki
打开/关闭外观设置菜单
打开/关闭个人菜单
未登录
未登录用户的IP地址会在进行任意编辑后公开展示。

MediaWiki:Common.js:修订间差异

MediaWiki界面页面
ETTW​(留言 | 贡献)
无编辑摘要
ETTW​(留言 | 贡献)
无编辑摘要
第160行: 第160行:
/**
/**
  * Section19. 通知面板动画控制
  * Section19. 通知面板动画控制
  * 左下角缩放 + 淡入 + 修复加载阻塞
  * 左下角缩放 + 淡入(修复阻塞版)
  */
  */
(function() {
(function() {
     'use strict';
     'use strict';
      
      
     // 注入样式
     // 注入样式 - 只在动画未完成时隐藏
     var style = document.createElement('style');
     var style = document.createElement('style');
     style.textContent = `
     style.textContent = `
         .mw-echo-ui-notificationBadgeButtonPopupWidget-popup .oo-ui-popupWidget-popup {  
        /* 初始状态:隐藏但不影响布局 */
         .mw-echo-ui-notificationBadgeButtonPopupWidget-popup:not(.popup-show):not(.popup-ready) .oo-ui-popupWidget-popup {
            opacity: 0 !important;
            transform: scale(0.9) !important;
            transform-origin: bottom left !important;
        }
       
        /* 准备状态:显示但等待动画 */
        .mw-echo-ui-notificationBadgeButtonPopupWidget-popup.popup-ready .oo-ui-popupWidget-popup {
             opacity: 0 !important;  
             opacity: 0 !important;  
             transform: scale(0.9) !important;
             transform: scale(0.9) !important;
第174行: 第182行:
             transition: opacity 0.35s cubic-bezier(0.16, 1, 0.3, 1),  
             transition: opacity 0.35s cubic-bezier(0.16, 1, 0.3, 1),  
                         transform 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
                         transform 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
         }  
         }
       
        /* 显示状态:触发动画 */
         .mw-echo-ui-notificationBadgeButtonPopupWidget-popup.popup-show .oo-ui-popupWidget-popup {  
         .mw-echo-ui-notificationBadgeButtonPopupWidget-popup.popup-show .oo-ui-popupWidget-popup {  
             opacity: 1 !important;  
             opacity: 1 !important;  
第183行: 第193行:
      
      
     var lastState = false;
     var lastState = false;
    var animating = false;
      
      
     setInterval(function() {
     setInterval(function() {
第189行: 第198行:
         if (!popup) {
         if (!popup) {
             lastState = false;
             lastState = false;
            animating = false;
             return;
             return;
         }
         }
          
          
         var style = window.getComputedStyle(popup);
         var computedStyle = window.getComputedStyle(popup);
         var isVisible = style.display !== 'none' && style.visibility !== 'hidden';
         var isVisible = computedStyle.display !== 'none' && computedStyle.visibility !== 'hidden';
          
          
         if (isVisible && !lastState && !popup.classList.contains('popup-show')) {
         if (isVisible && !lastState) {
             lastState = true;
             lastState = true;
              
              
             // 关键修复:立即显示,不等待内容加载
             var innerPopup = popup.querySelector('.oo-ui-popupWidget-popup');
             if (animating) return;
             if (!innerPopup) return;
            animating = true;
              
              
             var innerPopup = popup.querySelector('.oo-ui-popupWidget-popup');
             // 立即添加 ready,让内容可见可交互
            if (!innerPopup) {
            popup.classList.add('popup-ready');
                animating = false;
                return;
            }
              
              
             // 初始化光效
             // 初始化光效
第214行: 第218行:
             }
             }
              
              
             // 不禁用鼠标,允许立即交互
             // 短暂延迟后触发动画(让浏览器先渲染内容)
             innerPopup.offsetHeight; // 强制重绘
             setTimeout(function() {
                popup.classList.add('popup-show');
            }, 16); // 一帧的时间
              
              
            // 立即触发动画
            requestAnimationFrame(function() {
                popup.classList.add('popup-show');
                setTimeout(function() {
                    animating = false;
                }, 350);
            });
         } else if (!isVisible && lastState) {
         } else if (!isVisible && lastState) {
             lastState = false;
             lastState = false;
             popup.classList.remove('popup-show');
             popup.classList.remove('popup-show', 'popup-ready');
            animating = false;
         }
         }
     }, 50);
     }, 50);
})();
})();

2026年2月22日 (日) 19:26的版本

/* 这里的任何JavaScript将为所有用户在每次页面加载时加载。 */

// 侧边栏广告
$(function() {
    if ($('#p-navigation').length) {
        var adHtml = '<div id="sidebar-ad"></div>';
        $('#p-navigation').after(adHtml);
        $.get(mw.util.wikiScript('api'), {
            action: 'parse',
            text: '{{CitizenAd}}',
            format: 'json'
        }, function(data) {
            $('#sidebar-ad').html(data.parse.text['*']);
        });
    }
});

/**
 * Blockland Wiki Liquid Glass Lighting System
 */
(function() {
    'use strict';
    
    var isPerformanceMode = function() {
        return document.documentElement.classList.contains('citizen-feature-performance-mode-clientpref-1');
    };

    var GLASS_SELECTORS = '#mw-panel-toc, #citizen-sidebar-lastmod, .citizen-menu__card, .citizen-toc-card, .citizen-command-palette, .infobox, table.ambox, .mwe-popups-container, .oo-ui-popupWidget-popup';

    var lastMouseX = 0;
    var lastMouseY = 0;

    var syncLight = function(e) {
        if (isPerformanceMode()) return;

        lastMouseX = e.clientX;
        lastMouseY = e.clientY;

        var elements = document.querySelectorAll(GLASS_SELECTORS);
        elements.forEach(function(el) {
            var rect = el.getBoundingClientRect();
            
            if (rect.width > 0 && rect.top < window.innerHeight && rect.bottom > 0) {
                var x = ((e.clientX - rect.left) / rect.width) * 100;
                var y = ((e.clientY - rect.top) / rect.height) * 100;
                
                el.style.setProperty('--mouse-x', x.toFixed(2) + '%');
                el.style.setProperty('--mouse-y', y.toFixed(2) + '%');
            }
        });
    };

    var initPopupLight = function(container) {
        if (isPerformanceMode()) return;
        
        var rect = container.getBoundingClientRect();
        if (rect.width > 0) {
            var x = ((lastMouseX - rect.left) / rect.width) * 100;
            var y = ((lastMouseY - rect.top) / rect.height) * 100;
            container.style.setProperty('--mouse-x', x.toFixed(2) + '%');
            container.style.setProperty('--mouse-y', y.toFixed(2) + '%');
        }
    };

    setInterval(function() {
        if (isPerformanceMode()) return; 
        var p = document.querySelector('.citizen-command-palette');
        if (p && !p.classList.contains('glass-show')) {
            p.classList.add('glass-show');
        }
    }, 100);

    var ticking = false;
    document.addEventListener('mousemove', function(e) {
        if (isPerformanceMode()) return;
        if (!ticking) {
            window.requestAnimationFrame(function() {
                syncLight(e);
                ticking = false;
            });
            ticking = true;
        }
    }, { passive: true });

    var modeObserver = new MutationObserver(function() {
        if (isPerformanceMode()) {
            document.querySelectorAll(GLASS_SELECTORS).forEach(function(el) {
                el.style.removeProperty('--mouse-x');
                el.style.removeProperty('--mouse-y');
            });
        }
    });
    modeObserver.observe(document.documentElement, { attributes: true, attributeFilter: ['class'] });

    window._liquidGlassInitPopup = initPopupLight;
})();
/**
 * Section25. Wiki 弹出预览菜单动画控制
 * 向下滑入 + 淡入(加慢版本)
 */
(function() {
    'use strict';
    
    // 注入样式(transition + transform)
    var style = document.createElement('style');
    style.textContent = `
        .mwe-popups .mwe-popups-container { 
            opacity: 0 !important; 
            transform: translateY(-12px) !important;
            transition: opacity 0.35s cubic-bezier(0.16, 1, 0.3, 1), 
                        transform 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
        } 
        .mwe-popups.popup-show .mwe-popups-container { 
            opacity: 1 !important; 
            transform: translateY(0) !important;
        }
        
        /* 如果弹窗在下方(flipped-y),从下往上滑 */
        .mwe-popups.flipped-y .mwe-popups-container {
            transform: translateY(12px) !important;
        }
        .mwe-popups.flipped-y.popup-show .mwe-popups-container {
            transform: translateY(0) !important;
        }
    `;
    document.head.appendChild(style);
    
    var seen = new WeakSet();
    
    new MutationObserver(function(muts) {
        muts.forEach(function(m) {
            m.addedNodes.forEach(function(node) {
                if (node.classList && node.classList.contains('mwe-popups') && !seen.has(node)) {
                    seen.add(node);
                    
                    var container = node.querySelector('.mwe-popups-container');
                    if (!container) return;
                    
                    // 初始化光效
                    if (window._liquidGlassInitPopup) {
                        window._liquidGlassInitPopup(container);
                    }
                    
                    node.style.pointerEvents = 'none';
                    container.offsetHeight; // 强制重绘
                    
                    requestAnimationFrame(function() {
                        requestAnimationFrame(function() {
                            node.classList.add('popup-show');
                            setTimeout(function() {
                                node.style.pointerEvents = '';
                            }, 350);
                        });
                    });
                }
            });
        });
    }).observe(document.body, { childList: true, subtree: true });
})();
/**
 * Section19. 通知面板动画控制
 * 左下角缩放 + 淡入(修复阻塞版)
 */
(function() {
    'use strict';
    
    // 注入样式 - 只在动画未完成时隐藏
    var style = document.createElement('style');
    style.textContent = `
        /* 初始状态:隐藏但不影响布局 */
        .mw-echo-ui-notificationBadgeButtonPopupWidget-popup:not(.popup-show):not(.popup-ready) .oo-ui-popupWidget-popup { 
            opacity: 0 !important; 
            transform: scale(0.9) !important;
            transform-origin: bottom left !important;
        }
        
        /* 准备状态:显示但等待动画 */
        .mw-echo-ui-notificationBadgeButtonPopupWidget-popup.popup-ready .oo-ui-popupWidget-popup {
            opacity: 0 !important; 
            transform: scale(0.9) !important;
            transform-origin: bottom left !important;
            transition: opacity 0.35s cubic-bezier(0.16, 1, 0.3, 1), 
                        transform 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
        }
        
        /* 显示状态:触发动画 */
        .mw-echo-ui-notificationBadgeButtonPopupWidget-popup.popup-show .oo-ui-popupWidget-popup { 
            opacity: 1 !important; 
            transform: scale(1) !important;
        }
    `;
    document.head.appendChild(style);
    
    var lastState = false;
    
    setInterval(function() {
        var popup = document.querySelector('.mw-echo-ui-notificationBadgeButtonPopupWidget-popup');
        if (!popup) {
            lastState = false;
            return;
        }
        
        var computedStyle = window.getComputedStyle(popup);
        var isVisible = computedStyle.display !== 'none' && computedStyle.visibility !== 'hidden';
        
        if (isVisible && !lastState) {
            lastState = true;
            
            var innerPopup = popup.querySelector('.oo-ui-popupWidget-popup');
            if (!innerPopup) return;
            
            // 立即添加 ready,让内容可见可交互
            popup.classList.add('popup-ready');
            
            // 初始化光效
            if (window._liquidGlassInitPopup) {
                window._liquidGlassInitPopup(innerPopup);
            }
            
            // 短暂延迟后触发动画(让浏览器先渲染内容)
            setTimeout(function() {
                popup.classList.add('popup-show');
            }, 16); // 一帧的时间
            
        } else if (!isVisible && lastState) {
            lastState = false;
            popup.classList.remove('popup-show', 'popup-ready');
        }
    }, 50);
})();