MediaWiki:Common.js: Unterschied zwischen den Versionen
Erscheinungsbild
Keine Bearbeitungszusammenfassung |
Keine Bearbeitungszusammenfassung |
||
| Zeile 1: | Zeile 1: | ||
mw.loader.using( | // Header so früh wie möglich einfügen – nur jQuery voraussetzen | ||
mw.loader.using('jquery').done(function () { | |||
// Warten, bis <body> existiert (aber NICHT auf komplettes DOM) | |||
var interval = setInterval(function () { | |||
var $body = $('body'); | var $body = $('body'); | ||
if (!$body.length) { | |||
return; | |||
} | |||
clearInterval(interval); | |||
/*********************** | /*********************** | ||
* Eigenen Header einfügen | * Eigenen Header einfügen (sofort sichtbar) | ||
***********************/ | ***********************/ | ||
var headerHtml = '' + | var headerHtml = '' + | ||
| Zeile 22: | Zeile 28: | ||
/*********************** | /*********************** | ||
* 1) Suche | * 1) Suche-Icon (keine Abhängigkeit vom Sticky-Header) | ||
***********************/ | ***********************/ | ||
// Icon | // Wir bauen IMMER unser eigenes Icon, damit der Header sofort da ist | ||
var $searchLink = $('<button>', { | |||
type: 'button', | |||
class: 'pixo-header-icon', | |||
title: 'Suche' | |||
}).text('🔍'); | |||
// Fokus auf Standard-Suchfeld, sobald es existiert | |||
$searchLink.on('click', function () { | |||
$('#searchInput, #mw-searchInput').first().trigger('focus'); | var $input = $('#searchInput, #mw-searchInput').first(); | ||
}); | if ($input.length) { | ||
$input.trigger('focus'); | |||
} else { | |||
// Falls noch nicht da: später fokussieren | |||
setTimeout(function () { | |||
$('#searchInput, #mw-searchInput').first().trigger('focus'); | |||
}, 200); | |||
} | |||
}); | |||
$left.append($searchLink); | |||
/*********************** | /*********************** | ||
* 2) Logo + Titel in die Mitte | * 2) Logo + Titel in die Mitte | ||
* (wartet nur auf .mw-logo, blockiert aber nicht den Header) | |||
***********************/ | ***********************/ | ||
var $logoLink = $('.mw-logo').first(); | function attachLogo() { | ||
var $logoLink = $('.mw-logo').first(); | |||
if ($logoLink.length) { | |||
} | $logoLink.appendTo($center).css({ margin: 0 }); | ||
// | return true; | ||
var | } | ||
return false; | |||
} | |||
// 1. Versuch sofort | |||
if (!attachLogo()) { | |||
// 2. Versuche noch kurz nachzuladen | |||
var logoTries = 0; | |||
var logoInterval = setInterval(function () { | |||
logoTries++; | |||
if (attachLogo() || logoTries > 20) { // max ~2s | |||
clearInterval(logoInterval); | |||
} | |||
}, 100); | |||
} | } | ||
| Zeile 65: | Zeile 80: | ||
* 3) Benutzerbereich rechts | * 3) Benutzerbereich rechts | ||
***********************/ | ***********************/ | ||
var userName = mw.config.get('wgUserName'); // null, wenn nicht angemeldet | mw.loader.using('mediawiki.user').then(function () { | ||
var userName = mw.config.get('wgUserName'); // null, wenn nicht angemeldet | |||
if (userName) { | |||
// Angemeldeter User: vorhandene Menüs verwenden, sobald sie existieren | |||
function attachUserMenus() { | |||
var done = true; | |||
var $userPage = $('#p-vector-user-menu-userpage').first(); | |||
if ($userPage.length && !$userPage.parent().is($right)) { | |||
$userPage.appendTo($right).addClass('pixo-header-icon'); | |||
} else if (!$userPage.length) { | |||
done = false; | |||
} | |||
var $userMenu = $('#vector-user-links-dropdown').first(); | |||
if ($userMenu.length && !$userMenu.parent().is($right)) { | |||
$userMenu.appendTo($right).addClass('pixo-header-icon'); | |||
} else if (!$userMenu.length) { | |||
done = false; | |||
} | |||
return done; | |||
} | |||
// Sofort versuchen, dann noch kurz pollen | |||
if (!attachUserMenus()) { | |||
var tries = 0; | |||
var userInterval = setInterval(function () { | |||
tries++; | |||
if (attachUserMenus() || tries > 20) { | |||
clearInterval(userInterval); | |||
} | |||
}, 100); | |||
} | |||
} else { | |||
// Kein Login: Registrieren + Login Icons (sofort) | |||
var $register = $('<a>', { | |||
href: mw.util.getUrl('Special:CreateAccount'), | |||
class: 'pixo-header-icon', | |||
title: 'Benutzer registrieren' | |||
}).text('✚'); | |||
var $login = $('<a>', { | |||
href: mw.util.getUrl('Special:UserLogin'), | |||
class: 'pixo-header-icon', | |||
title: 'Benutzeranmeldung' | |||
}).text('⮞'); | |||
$right.append($register, $login); | |||
} | } | ||
}); | }); | ||
}, 10); | |||
}); | }); | ||
Version vom 5. März 2026, 04:38 Uhr
// Header so früh wie möglich einfügen – nur jQuery voraussetzen
mw.loader.using('jquery').done(function () {
// Warten, bis <body> existiert (aber NICHT auf komplettes DOM)
var interval = setInterval(function () {
var $body = $('body');
if (!$body.length) {
return;
}
clearInterval(interval);
/***********************
* Eigenen Header einfügen (sofort sichtbar)
***********************/
var headerHtml = '' +
'<div id="pixo-custom-header">' +
'<div id="pixo-custom-header-inner">' +
'<div id="pixo-custom-header-left"></div>' +
'<div id="pixo-custom-header-center"></div>' +
'<div id="pixo-custom-header-right"></div>' +
'</div>' +
'</div>';
$body.prepend(headerHtml);
var $left = $('#pixo-custom-header-left');
var $center = $('#pixo-custom-header-center');
var $right = $('#pixo-custom-header-right');
/***********************
* 1) Suche-Icon (keine Abhängigkeit vom Sticky-Header)
***********************/
// Wir bauen IMMER unser eigenes Icon, damit der Header sofort da ist
var $searchLink = $('<button>', {
type: 'button',
class: 'pixo-header-icon',
title: 'Suche'
}).text('🔍');
// Fokus auf Standard-Suchfeld, sobald es existiert
$searchLink.on('click', function () {
var $input = $('#searchInput, #mw-searchInput').first();
if ($input.length) {
$input.trigger('focus');
} else {
// Falls noch nicht da: später fokussieren
setTimeout(function () {
$('#searchInput, #mw-searchInput').first().trigger('focus');
}, 200);
}
});
$left.append($searchLink);
/***********************
* 2) Logo + Titel in die Mitte
* (wartet nur auf .mw-logo, blockiert aber nicht den Header)
***********************/
function attachLogo() {
var $logoLink = $('.mw-logo').first();
if ($logoLink.length) {
$logoLink.appendTo($center).css({ margin: 0 });
return true;
}
return false;
}
// 1. Versuch sofort
if (!attachLogo()) {
// 2. Versuche noch kurz nachzuladen
var logoTries = 0;
var logoInterval = setInterval(function () {
logoTries++;
if (attachLogo() || logoTries > 20) { // max ~2s
clearInterval(logoInterval);
}
}, 100);
}
/***********************
* 3) Benutzerbereich rechts
***********************/
mw.loader.using('mediawiki.user').then(function () {
var userName = mw.config.get('wgUserName'); // null, wenn nicht angemeldet
if (userName) {
// Angemeldeter User: vorhandene Menüs verwenden, sobald sie existieren
function attachUserMenus() {
var done = true;
var $userPage = $('#p-vector-user-menu-userpage').first();
if ($userPage.length && !$userPage.parent().is($right)) {
$userPage.appendTo($right).addClass('pixo-header-icon');
} else if (!$userPage.length) {
done = false;
}
var $userMenu = $('#vector-user-links-dropdown').first();
if ($userMenu.length && !$userMenu.parent().is($right)) {
$userMenu.appendTo($right).addClass('pixo-header-icon');
} else if (!$userMenu.length) {
done = false;
}
return done;
}
// Sofort versuchen, dann noch kurz pollen
if (!attachUserMenus()) {
var tries = 0;
var userInterval = setInterval(function () {
tries++;
if (attachUserMenus() || tries > 20) {
clearInterval(userInterval);
}
}, 100);
}
} else {
// Kein Login: Registrieren + Login Icons (sofort)
var $register = $('<a>', {
href: mw.util.getUrl('Special:CreateAccount'),
class: 'pixo-header-icon',
title: 'Benutzer registrieren'
}).text('✚');
var $login = $('<a>', {
href: mw.util.getUrl('Special:UserLogin'),
class: 'pixo-header-icon',
title: 'Benutzeranmeldung'
}).text('⮞');
$right.append($register, $login);
}
});
}, 10);
});