Wikidata:Wie man Wikidata-Touren erstellt/Javascript

This page is a translated version of the page Wikidata:How to create Wikidata Tours/Javascript and the translation is 100% complete.

JavaScript-Seite erstellen

Für alle Touren ist eine JavaScript-Datei erforderlich, die eine Reihe von Optionen für die Konfiguration der Tour enthält. Um eine JavaScript-Datei zum Testen bereitzustellen, sind Interface Admin-Rechte erforderlich. Daher müssen Sie diese Liste der Interface Admins verwenden, um jemanden zu finden, der Ihnen bei diesem Schritt hilft. Der Rest der Anweisungen auf dieser Seite ist für den Interface-Administrator gedacht, der zur Hilfe herangezogen wird.

Hinweis: Wenn Sie über Grundkenntnisse in JavaScript und CSS verfügen, können Sie die JavaScript-Datei selbst erstellen, indem Sie die Schritte auf dieser Seite befolgen. Sie benötigen zwar immer noch die Hilfe eines Schnittstellenadministrators, um die Datei im Nächster Schritt tatsächlich zum Testen bereitzustellen, aber dies spart ihm etwas Zeit, da er von Ihrer vorgeschlagenen JavaScript-Datei ausgehen kann.

Dateiname und Speicherort

In diesem Stadium des Prozesses sollte die JavaScript-Datei in Ihrem eigenen Benutzerbereich erstellt werden, z. B. Benutzer:YOUR_USERNAME/tours/wbmycooltour.js. Um die Tour jedoch tatsächlich auszuführen (entweder auf test.wikidata.org oder auf main wikidata.org), müssen Sie die JavaScript-Datei im MediaWiki-Namensraum unter Verwendung der folgenden Namenskonvention ablegen: MediaWiki:Guidedtour-tour-tour name.js.

Der [Tourname] wird auch als eine der Konfigurationsoptionen in der JavaScript-Datei angegeben. Dieser muss mit dem Dateinamen der zu ladenden Tour übereinstimmen. Verwenden Sie zum Beispiel den Dateinamen MediaWiki:Guidedtour-tour-wbcoordinates.js für eine Tour mit dem Namen "wbcoordinates". Sie sollten die JavaScript-Datei erst dann an diesem Ort auf wikidata.org bereitstellen, wenn die Tour auf test.wikidata.org vollständig getestet und verfeinert wurde, wie im Rest dieser Anleitung erläutert.

Zusammenfassend lässt sich sagen, dass sich die Datei an den folgenden Stellen befinden sollte, während Sie die einzelnen Schritte der Tour durchlaufen:

Benutzer-Namensraum
(Current step)
MediaWiki namespace test.wikidata.org
(Prüfschritt)
MediaWiki namespace www.wikidata.org
(Veröffentlichungsschritt)

Struktur

Angenommen, Sie würden eine Tour mit dem Namen "My Cool Tour" erstellen, dann bräuchten Sie Folgendes:

  1. Eine Wikiseite, auf die der Tourtext verlinkt wird, z. B. Wikidata:Tours/My_Cool_Tour
  2. Eine JavaScript-Datei, die unter MediaWiki:Guided-tour-wbMyCoolTour platziert werden muss
  3. Ein neuer Wikidata-Eintrag, der nur von dieser Tour verwendet wird.

Die JavaScript-Datei für "My Cool Tour" würde mit den in der Beispielvorlage unten gezeigten Details vervollständigt werden. Da es sich hier nur um eine fiktive Tour handelt, gibt es die Wiki-Seite und die JavaScript-Datei nicht, aber Sie können sich die Dateien der Referenztour ansehen, um ein reales Beispiel zu sehen:

Erweitern Sie das nachstehende Beispiel für eine Vorlage, die Sie als Ausgangspunkt kopieren und einfügen können.

JavaScript-Datei-Vorlage
/*
 * @see [[Wikidata:Tours/My_cool_tour]]
 * 
 * @author Your_Username_Goes_Here
 */
( function( $, mw, gt, wb ) {

	$.ajax( {
		async: false,
		url: mw.util.wikiScript() + '?title=MediaWiki:Guidedtour-lib.js&action=raw&ctype=text/javascript',
		dataType: 'script'
    } );
    
    /**
     * Name of your tour, always starts with 'wb' by convention
     */
    var tourName = 'wbmycooltour',

    /**
     * Wikidata item that will be loaded for the tour
     */
    tourEntityId = 'Q123...',

    /**
     * Initial data to add to the tour item, such as labels, descriptions and statements in standard wikibase syntax
     */
    newData = { };

	gt.init( tourName, tourEntityId, newData, {

		/**
		 * The Wiki page from where the tour texts should be loaded.
		 */
		pageName: 'Wikidata:Tours/My_cool_tour',

		/**
		 * The steps of the tour.
		 */
		steps: [ {
            // 1. Welcome to My Cool Tour
		}, {
            // 2. Some background info
		}, {
            // 3. Add a statement
            attachTo: '.wikibase-statementgrouplistview > .wikibase-addtoolbar-container .wikibase-toolbar-button-add',
			actionBtn2: '.wikibase-statementgrouplistview > .wikibase-addtoolbar-container .wikibase-toolbar-button-add a',
		}, {
            // 4. Select a property
			position: 'top',
            attachTo: '.wb-edit',
		}, {
            // 5. Input a value
			position: 'top',
			attachTo: '.wb-new .valueview-value'
		}, {
			// 6. Add a reference
			position: 'top',
			attachTo: '.wb-new .wikibase-statementview-references .wikibase-toolbar-button-add',
			actionBtn2: '.wb-new .wikibase-statementview-references .wikibase-toolbar-button-add a'
		}, {
			// 7. Select reference property
			position: 'top',
			attachTo: '.wb-reference-new .ui-suggester-input'			
		}, {
			// 8. Input reference value
			position: 'top',			
			attachTo: '.wb-reference-new .valueview-value',
		}, {
			// 9. Publish
			position: 'top',
			attachTo: '.wb-new .wikibase-toolbar-button-save',
			actionBtn2: '.wb-new .wikibase-toolbar-button-save a',			
		}, {
            // 10. Congratulations!
            
            // The function below should be included on the last slide
            // It makes the final "OK" click redirect back to the tours home page
            // Note: This is a temporary hack, it will not be needed in the near future
			onShow: function() {
				// Todo: should be the default action for clicking the "end tour" button on any Wikidata 
				$('.guidedtour-end-button').off('click').on('click', function() {
					window.location = window.location.origin + '/wiki/Wikidata:tours';
				})
			}
		} ]
	} );
} )( jQuery, mediaWiki, mediaWiki.guidedTour, wikibase );

tourName

Dies ist der Name, der zur Identifizierung der Tour verwendet wird. Er wird in der URL verwendet, wenn die Tour gestartet wird. Der Name muss:

  1. Eindeutig sein, sodass keine zwei Touren denselben Namen haben können.
  2. Verwenden Sie nur Kleinbuchstaben, keine Leerzeichen, Bindestriche oder andere Sonderzeichen.
  3. Passen Sie den Namen am Ende des JavaScript-Dateinamens an (z. B. "wbmycooltour" in der Datei MediaWiki:Guidedtour-tour-wbmycooltour.js).
  4. Beginnen Sie mit "wb", wie es auch bei anderen Touren üblich ist (z.B. "wbqualifiers" oder "wbuniqueidentifiers").
  5. Möglichst kurz gehalten werden (z. B. "wbstatements" oder "wbofficialwebsite").

tourEntityId

Geben Sie die Q-Nummer des im vorherigen Schritt erstellten Tour-Elements ein. Dies ist der spezielle Wikidata-Eintrag, der geladen wird, wenn die Tour läuft. Das Element, das Sie hier eingeben, wird erst verwendet, wenn Sie die endgültige Tour im Schritt Veröffentlichen ausführen, aber es ist gut, es in diesem Stadium zu speichern.

Wichtig: Der Tour-Eintrag wird jedes Mal komplett gelöscht, wenn ein Benutzer die Tour macht, daher solltest du niemals einen 'normalen' Wikidata-Eintrag für deine Tour verwenden!

newData

newData ist ein JavaScript-Objekt, das alle Daten enthält, die Sie bei der Initialisierung zum Tourbestandteil hinzufügen möchten, z. B. Beschriftungen, Beschreibungen und Anweisungen.

Da das Tour-Element bei jedem Start der Tour durch den Benutzer gelöscht wird, bedeutet das Belassen der Startdaten als leeres Objekt { }, dass die Tour immer mit einem völlig leeren Element beginnt.

Verwendung vorhandener Artikeldaten

Das Format für die Bereitstellung von Startdaten entspricht der Standard-Wikibase-Syntax für die Beschreibung von Artikeln, so dass Sie problemlos aus jedem vorhandenen Artikel exportieren können. Die beiden wichtigsten Ansätze sind:

Normalerweise werden nur die Ausgangsdaten herausgefiltert, die für die Durchführung der Tour erforderlich sind, und die Szene wird so gestaltet, dass es sich anfühlt, als würde man einen echten Artikel bearbeiten. Es wird jedoch dringend empfohlen, die Beschriftung in allen verfügbaren Sprachen beizubehalten, um die Übersetzung der Tour zu erleichtern (weitere Informationen unten).

Etiketten und Beschreibungen in Ihren Startup-Daten

  • Fügen Sie den Startdaten Ihres Objekts immer eine Beschriftung hinzu (es sei denn, es geht bei der Tour darum, die Beschriftung hinzuzufügen). Die Beschriftung liefert wichtigen Kontext für neue Benutzer.
  • Sie sollten das Etikett in allen verfügbaren Sprachen einfügen. Wie oben erläutert, werden die Startdaten in der Regel von einem bereits existierenden populären Artikel kopiert, sodass die Beschriftung in einer großen Anzahl verschiedener Sprachen verfügbar ist. Wenn Sie diese Daten jetzt hinzufügen, bedeutet das, dass die Beschriftungen wahrscheinlich bereits verfügbar sind, wenn die Tour in verschiedene Sprachen übersetzt wird. Weitere Informationen finden Sie auf der Übersetzungsseite.
  • Sie sollten immer eine Beschreibung in der Form "Test item for TOUR NAME tour only" hinzufügen (ersetzen Sie TOUR NAME durch den Namen der Tour). Da Tour-Artikel ganz normale Wikidata-Artikel sind, können sie im Suchfeld auftauchen. Das Hinzufügen dieser Beschreibung stellt sicher, dass jeder weiß, dass der Artikel nicht der echte Artikel für dieses Thema ist – z. B. der Tourartikel Earth (Test item for References tours only) im Gegensatz zum "echten" Artikel Earth (third planet from the Sun in the Solar System).
  • Wenn Sie sowohl Beschriftungen als auch Beschreibungen in das newData-Objekt einfügen, müssen Sie sicherstellen, dass die Kombination aus Beschriftung und Beschreibung auf Wikidata eindeutig ist. Wenn dies nicht der Fall ist, wird die Tour nicht geladen! Dies liegt daran, dass die anfängliche Bearbeitung, um Startdaten hinzuzufügen, abgelehnt wird. Dies kann erreicht werden, indem Sie den vorherigen Punkt zum Hinzufügen einer Beschreibung befolgen.

Schrittweise Konfiguration

Jeder Schritt in der Tour hat ein JavaScript-Objekt, das seine Funktionalität beschreibt. Diese werden dem Array steps in den Initialisierungsoptionen hinzugefügt, wobei ein Objekt für jeden Schritt in der Tour verwendet wird. Für jeden Schritt, der einfach in der Mitte der Seite schweben soll und keine spezielle Aktion auszuführen hat, können Sie einfach ein leeres Objekt verwenden.

Sie sollten damit beginnen, für jeden Schritt ein leeres Objekt hinzuzufügen, mit einem Kommentar über jedem Schritt, um den Titel des Schrittes und alle besonderen Anweisungen anzugeben (kopieren Sie dies von der entsprechenden Tour-Wiki-Seite). So behalten Sie den Überblick, was zu tun ist, während Sie sich durch die Einstellungen für jeden Schritt arbeiten.

Für jeden Schritt sind folgende Optionen verfügbar:

Eigenschaft Erlaubte Werte Beschreibung
Position
  • topLeft
  • top
  • topRight
  • rightTop
  • right
  • rightBottom
  • bottomRight
  • bottom
  • bottomLeft
  • leftBottom
  • left
  • leftTop
Bestimmt die Position des Popups relativ zu dem Element, an das es angehängt wird.

Wenn kein attachTo gesetzt wurde, wird diese Einstellung ignoriert.


default: bottom

attachTo
  • jeder gültige JQuery-Selektor
Selektor für das Element, an das das Popup angehängt werden soll.

Wenn Sie dies leer lassen, wird das Popup in der Mitte der Seite schweben.

actionBtn2
  • jeder gültige Abfrage-Selektor
Selektor für eine Klickaktion, die ausgeführt werden muss, damit der Schritt fortgesetzt werden kann. Die Eingabe eines Wertes für diese Aktion hat zwei wichtige Funktionen:
  1. Der Schritt kann "automatisch abgeschlossen" werden, wenn der Benutzer auf den Pfeil "weiter" klickt, ohne den Schritt selbst abzuschließen.
  2. Wenn der Benutzer die Aktion selbst abschließt, wird die Tour automatisch zur nächsten Folie fortgesetzt.

Einige wichtige Punkte zu diesem Objekt:

  • Die Funktion unterstützt derzeit nur einfache Klick-Aktionen wie "Anweisung hinzufügen", "Qualifier hinzufügen", "Referenz hinzufügen" usw. Für Schritte, bei denen die abzuschließende Aktion komplexer ist (z. B. "P21-Eigenschaft suchen und auswählen"), sollten Sie diese Eigenschaft vorerst leer lassen und den Benutzer den Schritt abschließen und die Tour manuell fortsetzen lassen
  • Im Allgemeinen müssen Sie das innerste <a>-Element auswählen, damit die Klick-Aktion funktioniert. Um zum Beispiel auf die Schaltfläche "Veröffentlichen" zu klicken, sollten Sie .wb-new .wikibase-toolbar-button-save a statt nur .wb-new .wikibase-toolbar-button-save eingeben.
  • Der Name sollte eigentlich "actionBtn" und nicht "actionBtn2" lauten, aber die aktuelle Version verwendet diese Änderung als vorübergehende Lösung für eine Reihe von Fehlern. Sehr bald wird der Name wieder korrekt sein. Alle Live-Touren werden aktualisiert, wenn dies geschieht, ebenso wie die Dokumentation auf dieser Seite.