Benutzerdefiniertes Skript

This page is still under construction. Diese Seite befindet sich noch im Aufbau.

Das Element „Benutzerdefiniertes Skript“ ermöglicht es Ihnen, benutzerdefinierten JavaScript-Code zu Ihrem Ablauf hinzuzufügen. Sie können Attribute an das Skript und zurück an den Ablauf übergeben, indem Sie die Funktionen getVariable() und setVariable() verwenden.

Wie Sie Variablen aus Ihrem Flow an Ihr Skript übergeben

Rufen Sie dazu die Funktion getVariable('nameOfYourAttribute') auf.

Mit dieser Funktion können Sie Attribute aus dem Ablauf an das Element „Benutzerdefiniertes Skript“ übergeben. Mit dieser Funktion können Sie auf Daten zugreifen, die Sie in vorherigen Elementen Ihres Ablaufs erfasst haben, z. B. Texteingaben, Schaltflächenauswahl oder Bewertungen. Wenn Sie ein Attribut in Ihrem Ablauf haben und es an das Element „Custom Script“ übergeben möchten, können Sie dies tun, indem Sie die Funktion „getVariable()“ in Ihrem Skript aufrufen. Sobald Sie die Daten im Element „Custom Script“ haben, können Sie sie mit JavaScript bearbeiten oder andere Vorgänge ausführen.

// getVariable expects one parameter as a string: the name of your Attribute.

getVariable('nameOfYourAttribute')

 

// so if you want to get the value of the Attribute "favoriteWine" you would call:

getVariable('favoriteWine')

Wie Sie Variablen von Ihrem Skript an Ihren Flow übergeben

Rufen Sie dazu die Funktion setVariable('variableName', value) auf.

Mit dieser Funktion können Sie Attribute vom benutzerdefinierten Skriptelement zurück an den Ablauf übergeben. Sie können diese Funktion verwenden, um Daten, die Sie im benutzerdefinierten Skriptelement generiert oder bearbeitet haben, zurückzusenden, um sie in anderen Elementen in Ihrem Ablauf zu verwenden. Sie können diese Funktion beispielsweise verwenden, um ein Attribut mit den Ergebnissen einer Berechnung zur späteren Verwendung zu aktualisieren.

// setVariable expects two parameters.

// 1) the name of the attribute and 2) the value that you want to save in there:

setVariable('variableName', value)

// so if you want to save the value of updatedName inside your script

// to the Attribute "avatarName" you could call the function like this::

setVariable('avatarName', updatedName)

Beispiele für den Anfang

Hier sind einige Beispiele, die Ihnen helfen sollen, die Verwendung des Elements „Benutzerdefiniertes Skript“ zu verstehen.

1) Bauen Sie eine einfache Theke

Nehmen wir an, wir möchten einen einfachen Zähler in Plural erstellen. Das folgende Tutorial basiert auf diesem Ablauf hier:

Plural "Counter" Flow.

1) Initialisieren Sie das Zähler-Attribut.

Zu Beginn des Ablaufs initialisieren wir den Zähler mit dem Wert 0. Verwenden Sie ein set-Attribut-Element, erstellen Sie ein neues Attribut „counter“ und weisen Sie ihm den Wert 0 zu.

2) Erstellen Sie ein Menü zum Hoch-/Runterzählen

Als Nächstes erstellen wir ein Menü mit drei Schaltflächen. Eine Schaltfläche zum Hochzählen, eine zum Herunterzählen und eine zum Anzeigen des aktuellen Zählerwerts.

3) Fügen Sie zwei „Custom Script“-Elemente hinzu

Als Nächstes fügen wir die beiden Skriptelemente zum Hoch-/Runterzählen hinzu. Ein Hinweis am Rande: Natürlich gibt es viele Möglichkeiten, diesen Zähler zu erstellen, dies ist nur eine davon.

Fügen Sie Ihrem Ablauf ein „Custom Script“-Element hinzu. Klicken Sie darauf, um die Seitenleiste zu öffnen. Klicken Sie auf „Skripteditor öffnen“, um den Vollbild-Skripteditor zu öffnen. Ihr Skripteditor sollte nun wie folgt aussehen:

Sie können diesen Code direkt hier in den Editor kopieren:

let currentCounter = getVariable('counter') // get the current counter value

let newCounter = parseInt(currentCounter) + 1; // parse the counter into an Integer and count up

Dann sollte Ihr Skript-Editor so aussehen:

Erklärung, was gerade getan wurde:

Zunächst wollen wir mit let currentCounter = getVariable('counter') den aktuellen Zählerwert aus dem Attribut in unserem Ablauf abrufen. Dazu speichern wir den Wert des Attributs in unserer „currentCounter“-Variablen im Skript-Editor.

Zweitens erstellen wir mit let newCounter = parseInt(currentCounter) + 1; eine zweite Variable im Skript mit dem Namen „newCounter“. Dieser Variablen weisen wir den Wert der oben genannten Variablen „currentCounter“ zu und addieren 1 dazu. Hinweis: Um sicherzustellen, dass „counter“ tatsächlich eine Zahl ist, analysieren wir sie als Integer.

Zuletzt weisen wir mit setVariable('counter', newCounter) den Wert unserer Variablen „newCounter“ im Skript dem Attribut „counter“ in unserem Ablauf zu.

Um den Countdown zu zählen, können Sie den Schritten im obigen GIF folgen. Der schnellere Weg ist, das „Custom Script“-Element, das wir gerade erstellt haben, zu duplizieren und in Zeile 2 das + in ein - zu ändern.

4) Fügen Sie eine Folie „Etwas ist schiefgelaufen“ hinzu

Fügen Sie ein Media Designer-Element hinzu, das den Fall behandelt, dass in Ihrem Skript ein Fehler aufgetreten ist. Verbinden Sie die entsprechenden Ausgänge mit dem Eingang dieser Medienfolie.

5) Testen Sie Ihren Flow

Wenn alles gut gegangen ist, sollten Sie jetzt einen Datenfluss haben, der in der Lage ist, den Zähler hoch- oder runterzuzählen. Wenn Sie Hilfe beim Zusammenschalten der Boxen benötigen, sehen Sie sich das Bild am Anfang dieses Beispiels an.