MediaWiki:Gadget-ViewerMode.js:修订间差异
外观
LocalAdmin(留言 | 贡献) Fix portlet ID for Vector 2022 |
LocalAdmin(留言 | 贡献) 直接注入DOM,修复Vector 2022兼容性,补全我的博客图标 |
||
| 第1行: | 第1行: | ||
/** | /** | ||
* ViewerMode gadget — | * ViewerMode gadget — lets editors preview the site as a regular visitor. | ||
* Also fixes the missing icon on the "我的博客" menu item. | |||
*/ | */ | ||
( function () { | ( function () { | ||
'use strict'; | 'use strict'; | ||
if ( | // Only run for logged-in users | ||
if ( mw.user.isAnon() ) { | |||
return; | return; | ||
} | } | ||
| 第13行: | 第14行: | ||
var active = localStorage.getItem( STORAGE_KEY ) === '1'; | var active = localStorage.getItem( STORAGE_KEY ) === '1'; | ||
// Apply class immediately to prevent flash of edit elements | // Apply class immediately on load to prevent flash of edit elements | ||
if ( active ) { | if ( active ) { | ||
document.documentElement.classList.add( 'viewer-mode' ); | document.documentElement.classList.add( 'viewer-mode' ); | ||
} | } | ||
| 第30行: | 第22行: | ||
active = !active; | active = !active; | ||
localStorage.setItem( STORAGE_KEY, active ? '1' : '0' ); | localStorage.setItem( STORAGE_KEY, active ? '1' : '0' ); | ||
document.documentElement.classList.toggle( 'viewer-mode', active ); | |||
updateButton(); | |||
} | } | ||
function updateButton() { | function updateButton() { | ||
var | var label = document.querySelector( '#pt-viewer-mode .viewer-mode-label' ); | ||
if ( ! | if ( !label ) { return; } | ||
label.textContent = active ? '编辑者模式' : '读者模式'; | |||
var icon = document.querySelector( '#pt-viewer-mode .vector-icon' ); | |||
if ( icon ) { | |||
icon.className = active | |||
? 'vector-icon mw-ui-icon-userContributions mw-ui-icon-wikimedia-userContributions' | |||
: 'vector-icon mw-ui-icon-eye mw-ui-icon-wikimedia-eye'; | |||
} | } | ||
} | } | ||
$( function () { | |||
// | // --- Fix missing icon on 我的博客 --- | ||
var | var blogLink = document.querySelector( '#pt-simpleblog_myblog a' ); | ||
if ( blogLink && !blogLink.querySelector( '.vector-icon' ) ) { | |||
var blogIcon = document.createElement( 'span' ); | |||
blogIcon.className = 'vector-icon mw-ui-icon-article mw-ui-icon-wikimedia-article'; | |||
blogLink.insertBefore( blogIcon, blogLink.firstChild ); | |||
blogLink.insertBefore( document.createTextNode( '\u00a0' ), blogIcon.nextSibling ); | |||
} | |||
// --- Add viewer-mode toggle to personal menu --- | |||
var menuList = document.querySelector( '#p-personal .vector-menu-content-list' ); | |||
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' ); | |||
li.id = 'pt-viewer-mode'; | |||
li.className = 'mw-list-item'; | |||
var a = document.createElement( 'a' ); | |||
a.href = '#'; | |||
a.title = active ? '切换回编辑者模式' : '切换到读者模式,预览访客视图'; | |||
var iconSpan = document.createElement( 'span' ); | |||
iconSpan.className = active | |||
? 'vector-icon mw-ui-icon-userContributions mw-ui-icon-wikimedia-userContributions' | |||
: 'vector-icon mw-ui-icon-eye mw-ui-icon-wikimedia-eye'; | |||
var textSpan = document.createElement( 'span' ); | |||
} | textSpan.className = 'viewer-mode-label'; | ||
textSpan.textContent = active ? '编辑者模式' : '读者模式'; | |||
a.appendChild( iconSpan ); | |||
a.appendChild( document.createTextNode( '\u00a0' ) ); | |||
a.appendChild( textSpan ); | |||
a.addEventListener( 'click', function ( e ) { | |||
e.preventDefault(); | |||
toggle(); | |||
} ); | |||
li.appendChild( a ); | |||
// 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 ); | |||
} | } | ||
} ); | } ); | ||
}() ); | }() ); | ||
2026年3月12日 (四) 10:08的版本
/**
* ViewerMode gadget — lets editors preview the site as a regular visitor.
* Also fixes the missing icon on the "我的博客" menu item.
*/
( function () {
'use strict';
// Only run for logged-in users
if ( mw.user.isAnon() ) {
return;
}
var STORAGE_KEY = 'mw-viewer-mode';
var active = localStorage.getItem( STORAGE_KEY ) === '1';
// Apply class immediately on load to prevent flash of edit elements
if ( active ) {
document.documentElement.classList.add( 'viewer-mode' );
}
function toggle() {
active = !active;
localStorage.setItem( STORAGE_KEY, active ? '1' : '0' );
document.documentElement.classList.toggle( 'viewer-mode', active );
updateButton();
}
function updateButton() {
var label = document.querySelector( '#pt-viewer-mode .viewer-mode-label' );
if ( !label ) { return; }
label.textContent = active ? '编辑者模式' : '读者模式';
var icon = document.querySelector( '#pt-viewer-mode .vector-icon' );
if ( icon ) {
icon.className = active
? 'vector-icon mw-ui-icon-userContributions mw-ui-icon-wikimedia-userContributions'
: 'vector-icon mw-ui-icon-eye mw-ui-icon-wikimedia-eye';
}
}
$( function () {
// --- Fix missing icon on 我的博客 ---
var blogLink = document.querySelector( '#pt-simpleblog_myblog a' );
if ( blogLink && !blogLink.querySelector( '.vector-icon' ) ) {
var blogIcon = document.createElement( 'span' );
blogIcon.className = 'vector-icon mw-ui-icon-article mw-ui-icon-wikimedia-article';
blogLink.insertBefore( blogIcon, blogLink.firstChild );
blogLink.insertBefore( document.createTextNode( '\u00a0' ), blogIcon.nextSibling );
}
// --- Add viewer-mode toggle to personal menu ---
var menuList = document.querySelector( '#p-personal .vector-menu-content-list' );
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' );
li.id = 'pt-viewer-mode';
li.className = 'mw-list-item';
var a = document.createElement( 'a' );
a.href = '#';
a.title = active ? '切换回编辑者模式' : '切换到读者模式,预览访客视图';
var iconSpan = document.createElement( 'span' );
iconSpan.className = active
? 'vector-icon mw-ui-icon-userContributions mw-ui-icon-wikimedia-userContributions'
: 'vector-icon mw-ui-icon-eye mw-ui-icon-wikimedia-eye';
var textSpan = document.createElement( 'span' );
textSpan.className = 'viewer-mode-label';
textSpan.textContent = active ? '编辑者模式' : '读者模式';
a.appendChild( iconSpan );
a.appendChild( document.createTextNode( '\u00a0' ) );
a.appendChild( textSpan );
a.addEventListener( 'click', function ( e ) {
e.preventDefault();
toggle();
} );
li.appendChild( a );
// 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 );
}
} );
}() );