Einrichtung

Erstellen Sie ein Widget, indem Sie ein Options-Objekt an die Create-Funktion übergeben:

var widget = DigitaService.Widget.Create(options);

Optionen einrichten

Erforderlich

Option	Typ	Beschreibung
options.element	string - HTMLElement	Das Widget wird in dieses HTMLElement eingefügt. Sie können direkten Zugriff auf ein bestehendes HTMLElement übergeben oder die String-ID für dieses Element angeben. Wenn Sie diese Eigenschaft nicht bereitstellen, wird versucht, eine "digitaservice-widget"-ID auf der Seite zu finden.
options.engine	string	Die absolute URL zu der Anwendung, die in das Widget geladen wird.

Optional

Option	Typ	Standardwert	Beschreibung
options.height	string	auto	Das Widget hat eine Standardhöhe von null, bevor es geladen wurde. Sie können dies mit einem Platzhalterwert überschreiben, um ein Springen der Seite zu vermeiden, je nachdem, wo das Widget auf der übergeordneten Seite verwendet wird. Der Wert ist in Pixel wie "600px". Wenn options.fixed = true verwendet wird, wird der Höhenwert auf den angegebenen Wert festgelegt, was Scrollleisten einführt.
options.autoscroll	boolean	true	Abhängig von der Länge des Widget-Inhalts und der Anzeige des Benutzers kann es erforderlich sein, dass die Seite, die das Widget enthält, durchgescrollt werden muss. Das Standardverhalten, wenn ein Benutzer das Widget verwendet, besteht darin, die Seite mit dem Widget zum Beginn des Widgets zu scrollen, um die Benutzerfreundlichkeit zu unterstützen. Um dies zu deaktivieren, setzen Sie autoscroll auf false. Diese Eigenschaft ist false, wenn options.fixed true ist.
options.sharingurl	string	Die Hosting-URL, die das Widget enthält	Bei der Nutzung von Social Sharing ist dies die URL, die Personen in sozialen Medien teilen werden, um sie zu Ihrer Kampagne zu bringen. Wenn sharing eine leere Zeichenfolge ist, wird die Hosting-Seite (die das Widget enthält) als URL verwendet.
options.fixed	boolean	false	Normalerweise ändert das Widget automatisch seine Größe, um den Inhalt der Engine zu passen und Scrollleisten zu vermeiden. Wenn dies auf true gesetzt ist, bleibt die Widget-Höhe fest und ändert sich nicht. Bei Verwendung dieser Option sollte der options.height Wert auf einen anderen Wert als "auto" eingestellt werden. Wenn die Engine-Höhe größer ist als der Höhenwert, werden Scrollleisten zum Navigieren verwendet.
options.width	string	„100%“	Die Breite des Widgets. Kann mit einer CSS-Messung wie „%“ oder „px“ beispielsweise eingestellt werden.

Laden

Sobald ein Widget eingerichtet ist, müssen Sie es laden. Sie können das Widget jederzeit laden.

Hinweis: Stellen Sie sicher, dass Sie vor dem Laden alle unten angegebenen Rückmeldungen eingerichtet haben, damit Sie alle Ereignisse erfassen können.

```widget.load();```# Event-Callbacks

onReady

Sobald widget.load() aufgerufen wurde, wird das Widget geladen und initialisiert. Wenn das Widget diesen Prozess abgeschlossen hat, wird der optionale onReady-Callback aufgerufen.

widget.onReady = function (event) {
   // geladen und einsatzbereit
   console.log(event.type); // “ready”
   console.log(event.data); // {}
};

onError

Nach dem Aufruf von widget.load() wird das Widget geladen und initialisiert. Tödliche Fehler, die danach auftreten, lösen den optionalen onError-Callback aus.

widget.onError = function (event) {
   throw new Error(event.message);
};

onComplete

Sobald das spiel abgeschlossen ist und der benutzer den letzten Bildschirm betrachtet. Es stellt auch ein Datenobjekt bereit, das beschreibt, was im spiel passiert ist.

Hinweis: Wenn Sie darauf reagieren möchten, sollten Sie in Betracht ziehen, innerhalb des Callbacks einen timeout zu setzen, damit der benutzer Zeit hat, den Bildschirm Beenden zu lesen, da es sofort beim Erreichen des letzten Bildschirms passiert. Sie können auch onClose verwenden.

widget.onComplete = function (event) {
   console.log(event.type); // “complete”
   console.log(event.data); // {}
   console.log("Benutzerpunktzahl war" + event.data.gameMetrics.score);
};

onResize

Tritt auf, wenn die Engine die Größe geändert hat und gibt die Höhe als Pixelwert an.

widget.onResize = function (event) {
   console.log(event.type); // “resize”
   console.log(event.data); // {}
   console.log("Anwendungshöhe:" + event.data.height);
};

onClose

Die anwendung kann mit einem speziellen schließen-knopf konfiguriert werden, mit dem der benutzer die erfahrung explizit beenden kann. Wenn dieser knopf konfiguriert ist und der benutzer damit interagiert, wird das schließen-Ereignis gesendet. Dies ist ein guter Zeitpunkt, um das Widget von Ihrer Seite zu entfernen und den Widget-Lebenszyklus zu beenden.

widget.onClose = function () {
   DigitaService.Widget.Destroy();
};

onFirstInteraction

Wenn der benutzer zum ersten Mal mit der geladenen anwendung interagiert (berühren/klicken).

widget.onFirstInteraction = function () {
   console.log("Benutzer hat zum ersten Mal mit der Anwendung interagiert");
};

onRouteChange

Tritt auf, wenn die Anwendung im Widget die Route geändert hat (Navigieren zwischen Bildschirmen). Das Ereignis kann je nach Kontext ein Datenobjekt enthalten oder auch nicht.

widget.onRouteChange = function (event) {
   console.log(event.type) // “routechange”
   console.log(event.data) // {} oder undefined
   console.log("Benutzer hat zum ersten Mal mit der Anwendung interagiert");
};

onScrollToTop

Tritt auf, wenn die Anwendung versucht, bis zum Seitenanfang zurückzuscrollen. Kann auf der übergeordneten Seite verwendet werden, um sicherzustellen, dass das Scrollen nicht ausgelöst wird (CORS) oder angepasst werden muss. Das Ereignis enthält kein datenobjekt.

widget.onScrollToTop = function () {
   console.log("Zum Anfang scrollen");
};

Kennzahlen

Hier ist eine Liste der wichtigsten Kennzahlen, die je nach Art des Spiels verwendet werden können:

Schlüssel	Beschreibung
data.gameMetrics.CurrentAttempt	Die Anzahl der Versuche, die der Benutzer nach Abschluss des Spiels benötigt hat.
data.gameMetrics.prizeID	Die ID des Preises.
data.gameMetrics.prizeImage	Das Bild des Preises.
data.gameMetrics.prizeName	Der Name des Preises.
data.gameMetrics.prizeRef	Die Referenz des Preises.
data.gameMetrics.totalPossibleAttempts	Die Gesamtanzahl der möglichen Versuche.
data.gameMetrics.userWon	true/false je nach Status des Benutzers.
data.gameMetrics.score	Die Gesamtpunktzahl, mit der der Benutzer das Spiel beendet.

Anmeldedaten

Schlüssel	Beschreibung
data.credentials.isPreviewMode	Überprüfen, ob das Spiel im Vorschau-Modus ist.
data.credentials.projectID	Die App-ID der aktuell gespielten App.
data.credentials.projectLanguage	Die Sprache des Projekts im Widget (en, fr).
data.credentials.projectName	Der Name der App.
data.credentials.projectType	Der Typ der App (Quiz, Memory usw.).
data.credentials.publisherID	Die ID des Herausgebers.
data.credentials.sessionID	Die Sitzungs-ID des aktuellen Spielers.

Aktualisiert am: 22/02/2025