Wikipedia:Technik/Skin/Gadgets/editMenus/JS
editMenus mit JavaScript
Diese Seite erläutert fortgeschrittene Konfigurationsmöglichkeiten zu den Sonderzeichenleisten editMenus mittels der Programmiersprache JavaScript.
Sie sind angemeldeten und nicht angemeldeten Benutzern möglich. Zu den allgemeinen Rahmenbedingungen siehe Benutzer-Einstellungen und Benutzer-JS.
Übersicht
[Quelltext bearbeiten]Es können eigene Menüs programmiert werden und weitgehend in die projektweit angebotene Gestaltung eingegriffen werden.
- Grundsätzlich beruht das Gadget auf menuSwitcher@PerfektesChaos, und dessen Programmierer-Schnittstelle kann für alle individuellen Anpassungen genutzt werden.
- Nach der Standard-Konfiguration wird ein
mw.hook
miteditMenus.completed
ausgelöst, der als Parameter das Anwendungs-Objekt von menuSwitcher erhält.- Dieses enthält auch eine Komponente
.fire()
und dieser Funktion können eigene Menüs usw. als Konfigurationsobjekt übergeben werden. - Damit die eigene Konfiguration nicht von der projektweiten Spezifikation überschrieben wird, muss deren Fertigstellung zunächst abgewartet werden.
- Dieses enthält auch eine Komponente
- Wenn vor dem Start ein
mw.hook
miteditMenus.position
ausgelöst wird und diesem ein Positionierungs-Objekt mitgegeben wird, kann die Anordnung der Werkzeugleisten in der Seite beeinflusst werden.- Dazu sollte die automatische Aktivierung abgeschaltet werden, weil sonst die Positionierung bereits abgeschlossen sein kann.
- Alternativ kann mit üblichen Mitteln die Positionierung später wie die jedes anderen Elements geändert werden.
Rahmen-Beispiel
[Quelltext bearbeiten]Nachstehend ein Muster-Code, der für eigene Entwicklungen genutzt werden kann.
// <nowiki>
/* global mediaWiki: false */
( function ( mw ) {
"use strict";
function customize( app ) {
var options = { };
/* options.xyz = ... */
app.fire( options );
}
switch ( mw.config.get( "wgAction" ) ) {
case "edit":
case "submit":
case "parsermigration-edit":
// mw.hook( "editMenus.position" ).fire( /* pos */ );
mw.hook( "editMenus.completed" ).add( customize );
break;
} // switch wgAction
mw.loader.load( "ext.gadget.editMenus" );
}( mediaWiki ) );
// </nowiki>
- Die Konfiguration wirkt auf die Quelltextbearbeitung einer Seite.
- In der Funktion
customize()
können die Vereinbarungen programmiert werden, die nach der projektweiten Konfiguration ausgeführt werden sollen. - Das Objekt
options
ist dabei das Konfigurationsobjekt, das an das Anwendungsobjekt von menuSwitcher übergeben werden kann. app
ist das Anwendungsobjekt für menuSwitcher und enthält noch einige Verwaltungsinformationen.- Ggf. kann über
"editMenus.position"
auch noch ein alternativer Ort für die Platzierung von Menüblöcken spezifiziert werden. - Erst nachdem alle Konfigurationsinformationen beisammen sind, wird mit
mw.loader.load
das Gadget programmatisch gestartet; dann in allen dort vorgesehenen Situationen.
Es wird davon ausgegangen, dass die automatisierte Ausführung deaktiviert wurde, damit sie erst nach Vervollständigung der Konfiguration durch die eigenen Wünsche in eine HTML-Darstellung umgesetzt wird.
Beispiel: Eigenes Einzel-Menü, Vorlage einfügen
[Quelltext bearbeiten]Nachstehend:
- Definition eines eigenen Menüs unter dem Bezeichner
Meins
- Angebot zum Einfügen der {{Internetquelle}} mit ausgefülltem Abrufdatum; Platzierung um die markierte URL, Einschluss in
<ref>
. - Bei Quelltextbearbeitung einer Seite wird das Menü vor allen anderen in die Auswahl eingefügt. Die Reihenfolge zwischen den Fremdsprachen kann interaktiv angepasst werden.
// <nowiki>
/* global mediaWiki: false */
( function ( mw ) {
"use strict";
function customize( app ) {
var jetzt = new Date(),
date = jetzt.getFullYear() + "-" +
( jetzt.getMonth() < 9 ? "0" : "" ) +
( jetzt.getMonth() +1 ) + "-" +
( jetzt.getDate() < 10 ? "0" : "" ) +
jetzt.getDate(),
e = [ {start: "<ref>{{Internetquelle |url=",
suffix: " |titel= |autor= | hrsg= | werk= |datum=" +
" |archiv-url= |archiv-datum= |offline=" +
" |sprache= |format= |abruf=" + date +
"}}</ref>",
show: "{{Internetquelle}}"}
],
panel = { selector: "Meins",
support: "editMenus",
def: e },
options = { };
options.defs = { contentmodel: "wikitext",
system: "builtin",
create: [ panel ] };
app.fire( options );
}
switch ( mw.config.get( "wgAction" ) ) {
case "edit":
case "submit":
case "parsermigration-edit":
mw.hook( "editMenus.completed" ).add( customize );
break;
} // switch wgAction
mw.loader.load( "ext.gadget.editMenus" );
}( mediaWiki ) );
// </nowiki>
Wer das möchte, kann eine individuell sinnvolle Auswahl des projektweiten Standard-Menüs (Funktion first()
) nahtlos in sein persönliches Menü kopieren.
Beispiel: Tastaturkürzel
[Quelltext bearbeiten]Das nachstehende Beispiel fügt auf Shift+Leertaste im Bearbeitungsfeld ein geschütztes Leerzeichen
ein.
[data-id=41]
ist momentan die laufende Nummer für
in den vom Projekt definierten Angeboten – könnte sich eines Tages unangekündigt ändern.- Weitere Auswertungen anderer Tastaturkürzel könnten ebenfalls in
function fired()
erfolgen.
( function ( mw, $ ) {
"use strict";
var $nbsp;
function fired( event ) {
if ( event.shiftKey &&
event.key === " " ) {
event.preventDefault();
if ( ! $nbsp ) {
$nbsp = $( "[data-id=41]" );
}
$nbsp.trigger( "click" );
}
}
function furnish() {
$( "#wpTextbox1" ).on( "keydown", fired );
}
$( furnish );
}( window.mediaWiki, window.jQuery ) );