槌基百科

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

←上一编辑下一编辑→
直接注入DOM，修复Vector 2022兼容性，补全我的博客图标
Fix DOM injection: logout in separate portlet; fix My blog spacing
第1行： 第1行：
/**
/**
  * ViewerMode gadget — lets editors preview the site as a regular visitor.
  * ViewerMode gadget — lets editors preview the site as a regular visitor.
  * Also fixes the missing icon on the "我的博客" menu item.
  * Also fixes the missing icon on the "My blog" menu item.
  */
  */
( function () {
( function () {
     'use strict';
     'use strict';


    // Only run for logged-in users
     if ( mw.user.isAnon() ) {
     if ( mw.user.isAnon() ) {
         return;
         return;
第14行： 第13行：
     var active = localStorage.getItem( STORAGE_KEY ) === '1';
     var active = localStorage.getItem( STORAGE_KEY ) === '1';


     // Apply class immediately on load to prevent flash of edit elements
     // Apply immediately to prevent flash of edit elements on load
     if ( active ) {
     if ( active ) {
         document.documentElement.classList.add( 'viewer-mode' );
         document.documentElement.classList.add( 'viewer-mode' );
第28行： 第27行：
     function updateButton() {
     function updateButton() {
         var label = document.querySelector( '#pt-viewer-mode .viewer-mode-label' );
         var label = document.querySelector( '#pt-viewer-mode .viewer-mode-label' );
        var icon  = document.querySelector( '#pt-viewer-mode .vector-icon' );
         if ( !label ) { return; }
         if ( !label ) { return; }
         label.textContent = active ? '编辑者模式' : '读者模式';
         if ( active ) {
        var icon = document.querySelector( '#pt-viewer-mode .vector-icon' );
            label.textContent = 'Editor mode';
        if ( icon ) {
            if ( icon ) { icon.className = 'vector-icon mw-ui-icon-userContributions mw-ui-icon-wikimedia-userContributions'; }
            icon.className = active
        } else {
                ? 'vector-icon mw-ui-icon-userContributions mw-ui-icon-wikimedia-userContributions'
            label.textContent = 'Reader view';
                : 'vector-icon mw-ui-icon-eye mw-ui-icon-wikimedia-eye';
            if ( icon ) { icon.className = 'vector-icon mw-ui-icon-eye mw-ui-icon-wikimedia-eye'; }
         }
         }
     }
     }


     $( function () {
     $( function () {
         // --- Fix missing icon on 我的博客 ---
         // Fix missing icon on "My blog" — match the exact structure other items use
         var blogLink = document.querySelector( '#pt-simpleblog_myblog a' );
         var blogLink = document.querySelector( '#pt-simpleblog_myblog a' );
         if ( blogLink && !blogLink.querySelector( '.vector-icon' ) ) {
         if ( blogLink && !blogLink.querySelector( '.vector-icon' ) ) {
             var blogIcon = document.createElement( 'span' );
             var blogIcon = document.createElement( 'span' );
             blogIcon.className = 'vector-icon mw-ui-icon-article mw-ui-icon-wikimedia-article';
             blogIcon.className = 'vector-icon mw-ui-icon-article mw-ui-icon-wikimedia-article';
            // Insert icon + a plain space before the text span (same pattern as other items)
            blogLink.insertBefore( document.createTextNode( ' ' ), blogLink.firstChild );
             blogLink.insertBefore( blogIcon, blogLink.firstChild );
             blogLink.insertBefore( blogIcon, blogLink.firstChild );
            blogLink.insertBefore( document.createTextNode( '\u00a0' ), blogIcon.nextSibling );
         }
         }


         // --- Add viewer-mode toggle to personal menu ---
         // Add viewer-mode toggle to the end of p-personal list
        // (logout lives in its own separate portlet p-user-menu-logout)
         var menuList = document.querySelector( '#p-personal .vector-menu-content-list' );
         var menuList = document.querySelector( '#p-personal .vector-menu-content-list' );
         if ( !menuList ) { return; }
         if ( !menuList ) { return; }


        // Only show toggle if user has any edit controls on this page
        // (safe for all logged-in users; harmless if no edit controls exist)
         var li = document.createElement( 'li' );
         var li = document.createElement( 'li' );
         li.id = 'pt-viewer-mode';
         li.id = 'pt-viewer-mode';
第60行： 第60行：
         var a = document.createElement( 'a' );
         var a = document.createElement( 'a' );
         a.href = '#';
         a.href = '#';
        a.title = active ? '切换回编辑者模式' : '切换到读者模式，预览访客视图';


         var iconSpan = document.createElement( 'span' );
         var iconSpan = document.createElement( 'span' );
第69行： 第68行：
         var textSpan = document.createElement( 'span' );
         var textSpan = document.createElement( 'span' );
         textSpan.className = 'viewer-mode-label';
         textSpan.className = 'viewer-mode-label';
         textSpan.textContent = active ? '编辑者模式' : '读者模式';
         textSpan.textContent = active ? 'Editor mode' : 'Reader view';


         a.appendChild( iconSpan );
         a.appendChild( iconSpan );
         a.appendChild( document.createTextNode( '\u00a0' ) );
         a.appendChild( document.createTextNode( ' ' ) );
         a.appendChild( textSpan );
         a.appendChild( textSpan );
         a.addEventListener( 'click', function ( e ) {
         a.addEventListener( 'click', function ( e ) {
             e.preventDefault();
             e.preventDefault();
第81行： 第79行：


         li.appendChild( a );
         li.appendChild( a );
 
         menuList.appendChild( li );
         // Insert before the logout item, or append at end
        var logoutItem = document.getElementById( 'pt-logout' );
        if ( logoutItem ) {
            menuList.insertBefore( li, logoutItem );
        } else {
            menuList.appendChild( li );
        }
     } );
     } );
}() );
}() );
检索自“https://chuihub.com/index.php/MediaWiki:Gadget-ViewerMode.js”