API-Aufrufe

Einleitung

Das Blocs Die Entwickler-API bietet eine Reihe von Routinen und Protokollen, mit denen Sie mit einem benutzerdefinierten Benutzer interagieren können Brics Benutzeroberfläche, HTML-Ausgabe und verschiedene andere Aspekte der Blocs Designumgebung.

Anrufe werden über eine benutzerdefinierte getätigt BricJavascript-Funktionen, Funktionen können in jedem JS-Format, jQuery 2, jQuery 3 usw. geschrieben werden.

Alle API-Aufrufe werden mit dem verarbeitet WebKit-Nachrichtenhandler und sollte einen einzelnen Datensatz in Form eines JSON-Wörterbuchs oder einer Zeichenfolge übergeben. Ein API-Aufrufdatenwert sollte innerhalb des platziert werden POST-Meldung Klammern.

Beispiel:
window.webkit.messageHandlers.API_CALL.postMessage("VALUE");

UI-Anrufe

Wenn ein Brauch Bric Wenn diese Option ausgewählt ist, werden in der Seitenleiste die UI-Werte basierend auf dem Benutzerdefiniert automatisch ausgefüllt Brics aktuelle Werte. Wenn mit einem UI-Element in der Seitenleiste interagiert wird, wird der Status dieses Elements automatisch aktualisiert. Mit den folgenden API-Aufrufen können Sie jedoch andere UI-Elemente und deren Werte für diesen Benutzer bearbeiten Bric. Wenn Sie beispielsweise ein Kontrollkästchen aktivieren, kann dies dazu führen, dass einem Dropdown-Menü ein weiteres Menüelement hinzugefügt wird. Wenn Sie dieses Kontrollkästchen deaktivieren, wird das zusätzliche Element möglicherweise aus dem Dropdown-Menü entfernt.

API-Aufrufe der Benutzeroberfläche erfordern ein JSON-Wörterbuch, das das Attribut und den Wert des Ziel-UI-Elements angibt.

setUIVal - Legen Sie den Wert für ein Seitenleisten-UI-Element fest. Alle Werte sollten als Zeichenfolgen übergeben werden, einschließlich Ganzzahlen und Bools.

Dropdown-Beispiel:
window.webkit.messageHandlers.setUIVal.postMessage('{"attr":"dropdown-data","value":"1","sync":"false"}');

Kontrollkästchen Beispiel:
window.webkit.messageHandlers.setUIVal.postMessage('{"attr":"checkbox-data","value":"1","sync":"false"}');

Eingabefeld Beispiel:
window.webkit.messageHandlers.setUIVal.postMessage('{"attr":"field-data","value":"Hello World","sync":"false"}');

Beispiel für die Aligment-Kontrolle:
window.webkit.messageHandlers.setUIVal.postMessage('{"attr":"align-data","value":"2","sync":"false"}');

setUIState - Legen Sie den Status (aktiviert / deaktiviert) eines UI-Elements in der Seitenleiste fest.

Beispiel:
window.webkit.messageHandlers.setUIState.postMessage('{"attr":"my-name-data","enable":"false"}');

setUIBearbeitbar - Legen Sie fest, ob der Inhalt eines UI-Elements bearbeitet werden kann.

Beispiel: window.webkit.messageHandlers.setUIEditable.postMessage('{"attr":"my-name-data","editable":"true"}');

setUIHidden - Legen Sie fest, ob ein UI-Element ausgeblendet ist.

Beispiel: window.webkit.messageHandlers.setUIHidden.postMessage('{"attr":"my-name-data","hidden":"true"}');

popUIMenu - Füllen Sie einen Dropdown-Menüpunkt mit Optionen.

Beispiel:
window.webkit.messageHandlers.popUIMenu.postMessage('{"attr":"dropdown-data","items":"item 1,item 2,*seperator*,item 3", "value":"0"}');

Projektaufrufe

Es gibt Zeiten, in denen Sie einem Projekt, das Ihre benutzerdefinierten Elemente enthält, zusätzliche Ressourcen hinzufügen müssen Bric. Mit den folgenden API-Aufrufen können Sie zusätzliche Projektressourcen hinzufügen.

ProjektRessource - Fügen Sie zusätzliche benutzerdefinierte hinzu Bric Ressourcen für ein Projekt. Nach dem Hinzufügen werden diese in den Projektanhängen unter Projekteinstellungen angezeigt. Derzeit werden JS-, CSS-, PHP- und HTML-Dateien sowie Verzeichnisse unterstützt. Angehängte JS-Dateien werden im Verzeichnis export / js abgelegt, CSS-Dateien werden im Verzeichnis export / css abgelegt und PHP-Dateien werden im Verzeichnis export / includes abgelegt. Innerhalb eines Seitencodes werden die CSS-Ressourcen vor dem schließenden Head-Tag und die JS-Ressourcen vor dem schließenden Body-Tag platziert. Alle zusätzlichen Ressourcen, auf die von Ihrem Benutzer verwiesen wird Bric, sollte in Ihrem Brauch enthalten sein Brics Ressourcenverzeichnis.

Beispiel:
window.webkit.messageHandlers.projectResource.postMessage('{"action":"add","name":"my-brics-assets-folder"}');

Seitenaufrufe

Es gibt Zeiten, in denen Sie einer Seite, die Ihre benutzerdefinierten Elemente enthält, zusätzliche Ressourcen hinzufügen müssen Bric. Mit den folgenden API-Aufrufen können Sie zusätzliche Seitenressourcen hinzufügen und ein Seitenexport-Suffix steuern.

Ressourcen - Fügen Sie zusätzliche benutzerdefinierte hinzu Bric Ressourcen zu einer Seite. Nach dem Hinzufügen werden diese in den Seitenanhängen unter den Seiteneinstellungen angezeigt. JS-, CSS- und PHP-Dateien werden derzeit unterstützt. Angehängte JS-Dateien werden im Verzeichnis export / js abgelegt, CSS-Dateien werden im Verzeichnis export / css abgelegt und PHP-Dateien werden im Verzeichnis export / includes abgelegt. Alle Ressourcen, auf die von Ihrem Benutzer verwiesen wird Bric, sollte in Ihrem Brauch enthalten sein Brics Ressourcenverzeichnis.

Beispiel:
window.webkit.messageHandlers.resource.postMessage('{"action":"add","name":"my-custom-resource.js"}');

SeitenSuffix - Stellen Sie das aktuelle Seitensuffix ein, z. B. HTML, PHP.

Beispiel:
window.webkit.messageHandlers.pageSuffix.postMessage("php");

Vorlagenaufrufe

Es kann vorkommen, dass Sie benutzerdefinierte Werte in zusätzliche Dateien aufnehmen müssen, die in der exportierten Site enthalten sind. Mit dem folgenden API-Aufruf können Sie dies tun.

speichernBenutzerdefiniertBricTemplateVal - Speichern Sie einen benutzerdefinierten Wert, der in einem benutzerdefinierten Wert enthalten sein wird Bric Vorlagendatei. Vorlagendateien können CSS, JS, JSON und PHP sein und sollten der benutzerdefinierten Datei hinzugefügt werden Bric Inhalt in einem Verzeichnis mit dem Namen Vorlagen.

Beispiel:
window.webkit.messageHandlers.storeCustomBricTemplateVal.postMessage('{"attr":"my-attr","value":"Hello World","template":"custom-bric-js.js","force-newfile":"no"}');

Schlüsselwerte:
Das speichernBenutzerdefiniertBricTemplateVal Der API-Aufruf sollte die folgenden Schlüsselwerte enthalten:

attr - Der Attributwert wird verwendet, um die Bereiche zu identifizieren, die beim Export in der Vorlagendatei ersetzt werden. Wenn dieses Attribut in einer Vorlagendatei verwendet wird, sollte es in% eg% my-attr% eingeschlossen werden.
Wert - Der Wert, der das Attribut in der Vorlagendatei ersetzt.
Vorlage - Der Name der Vorlagendatei. Diese Datei sollte sich in einem Verzeichnis mit dem Namen befinden Vorlagen in deinem Brics Inhalt.
Force-Newfile - Wenn zwei Brics Wenn unterschiedliche Werte in dieselbe Vorlagendatei geschrieben werden und diese auf YES gesetzt ist, wird eine weitere Vorlagendatei erstellt, z.bric-js-1.js.

Funktionscodes
Es ist auch erwähnenswert, dass Funktionscodes kann auch in Vorlagendateien verwendet werden.

DOM-Änderungen

Maßgeschneidert Brics Wenn diese Methode außerhalb der Hauptentwurfsumgebung bearbeitet wird, können Entwickler die benutzerdefinierte Methode vollständig bearbeiten Brics 'DOM' (Document Object Model) in irgendeiner Weise mit jeder Art von JS-basierter Sprache. Nachdem eine Funktion Änderungen am Benutzerdefinierten vorgenommen hat Brics DOM, es muss das anrufen synchronisieren Protokoll, um die DOM-Änderungen mit dem benutzerdefinierten zu synchronisieren Bric befindet sich an der Hauptstraße Blocs Design Leinwand.

synchronisieren - Nachdem die DOM-Manipulation stattgefunden hat, synchronisiert der Synchronisierungs-API-Aufruf die Änderungen mit dem Main Blocs Design-Leinwand. Während der Synchronisierung erfolgt keine Vorverarbeitung oder Wiedergabe, alles geschieht sofort. Es ist auch wichtig zu bedenken, dass die synchronisieren Das Protokoll erstellt auch einen Rückgängig-Zustand im aktuellen Dokument. Verwenden Sie diesen Aufruf daher nur, wenn Änderungen vorgenommen wurden. Andernfalls werden unnötige Rückgängig-Zustände erstellt.

Beispiel:
window.webkit.messageHandlers.sync.postMessage("changes");

Feedback-Anrufe

Es gibt Zeiten, in denen es wichtig ist, Informationen basierend auf den Änderungen, die sie an einer benutzerdefinierten Person vornehmen, an den Benutzer zurückzugeben Bric. Die folgenden Aufrufe bieten verschiedene Möglichkeiten, dies zu tun.

Benachrichtigung - Zeigen Sie eine In-App-Benachrichtigung an, die dies nicht tut block vollständiger UI-Zugriff. Jeder Benachrichtigungstyp sollte einen eigenen ID-Wert haben. Sobald eine Benachrichtigungs-ID vom Benutzer verworfen wird, wird sie nicht mehr angezeigt, wenn sie aufgerufen wird.

Beispiel:
window.webkit.messageHandlers.notification.postMessage('{"message":"Hey, this is a notification.","id":"my-bric-notification"}');

Das ist auch möglich Benachrichtigung zurücksetzen Mit dem Reset-Attribut kann das ID-Attribut verwendet werden, um eine einzelne ID oder ein Array von Benachrichtigungs-IDs zu übermitteln.

Beispiel:
window.webkit.messageHandlers.notification.postMessage('{"reset":"true","id":"my-bric-notification-1,my-bric-notification-2"}');

alarmieren - Eine Warnung posten (blocks apps volle Benutzeroberfläche bis zur Entlassung).

Beispiel:
window.webkit.messageHandlers.alert.postMessage('This is a basic alert');

RückrufAlert - Eine Warnung posten (blocks apps volle Benutzeroberfläche bis zur Entlassung), bei der der Benutzer eine Auswahl treffen muss. Die Benutzerauswahl wird als BOOL-Wert an die Funktion zurückgegeben.

Beispiel:
window.webkit.messageHandlers.callbackAlert.postMessage('{"message":"Do you want to get a pizza?","function":"pizzaFunction"}');

Öffne URL - Öffnen Sie eine URL im Webbrowser des Benutzers.

Beispiel:
window.webkit.messageHandlers.openURL.postMessage('https://blocsapp.com/');

Verschiedenes

Verschiedene Anrufe, die für die Entwicklung verwendet werden.

debuggen - Veröffentlichen Sie eine Debug-Nachricht, die in der angezeigt wird Entwicklerkonsolenfenster.

Beispiel:
window.webkit.messageHandlers.debug.postMessage('Hello World!');