Styling

Ein Standard-Stylesheet kann in die Seite eingefügt werden, indem die Eigenschaft installCSS in der Widget-Konfiguration gesetzt oder die Methode installCSS auf der Widget-Instanz aufgerufen wird. Die Quelle des eingefügten Stylesheets in Form einer SASS-Datei ist zugänglich unter:

https://api.unifaun.com/rs-extapi/v1/delivery-checkouts-widget/unifaun-checkout.scss

Benutzerinteraktion

Es gibt zwei Arten der Benutzerinteraktion, die das Widget beeinflussen:

• Externe Änderungen
• Interne Änderungen

Externe Änderungen

Beim ersten Erstellen und jedes Mal, wenn der Benutzer Änderungen an einer der Eingabevariablen vornimmt, die an die /delivery-checkouts API gesendet werden, sollte folgende Abfolge von Aktionen erfolgen:

• Deaktivieren Sie das Widget mit einem Aufruf der disable Methode.
• Führen Sie eine AJAX-Anfrage an die /delivery-checkouts API durch. Das Backend des Webshops fungiert normalerweise als Proxy für diese Art von Aufruf, damit ein geheimer API-Schlüssel an die REST-API gesendet werden kann.
• Wenn eine Antwort eintrifft, rufen Sie die Methode updateList auf und aktivieren Sie anschließend das Widget mit einem Aufruf der enable Methode.

// Deaktivieren des Widgets, während die AJAX-Anfrage läuft.
widget.disable();
fetch(url).then(function(response) {
    return response.json();
}).then(function(data) {
    // Aktualisieren des Widgets mit neuen Daten.
    widget.updateList(data);
}).catch(function() {
    // Fehlerbehandlung
}).then(function() {
    // Widget immer aktivieren
    widget.enable();
});

Interne Änderungen

Immer wenn der Benutzer eine der Optionen im Delivery Checkout auswählt oder einen Wert aktualisiert, der mit der ausgewählten Option verbunden ist, wird die Funktion resultCallback in der Widget-Konfiguration aufgerufen. Die Callback-Funktion erhält ein einzelnes Argument in Form eines JavaScript-Objekts mit den folgenden Eigenschaften: