API-aanroepen

Introductie

De Blocs developer API biedt een reeks routines en protocollen die kunnen worden gebruikt om te communiceren met een custom Brics gebruikersinterface, HTML-uitvoer en diverse andere aspecten van het Blocs ontwerpomgeving.

Oproepen worden gedaan via een aangepaste BricJavascript-functies, functies kunnen in elk JS-formaat worden geschreven, jQuery 2, jQuery 3 enz.

Alle API-aanroepen worden verwerkt met behulp van de WebKit-berichtafhandelaar en moet een enkele set gegevens doorgeven in de vorm van een JSON-woordenboek of een string. Een gegevenswaarde voor API-aanroepen moet binnen de Bericht plaatsen haakjes.

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

UI-oproepen

Wanneer een custom Bric is geselecteerd, vult de zijbalk automatisch de UI-waarden op basis van de Custom Brics huidige waarden. Wanneer er interactie is met een zijbalk UI-item, wordt de status van dat item automatisch bijgewerkt, maar met de volgende API-aanroepen kunt u andere UI-items en hun waarden voor dat aangepaste item manipuleren Bric​ Het aanvinken van een selectievakje kan bijvoorbeeld resulteren in het toevoegen van een ander menu-item aan een vervolgkeuzemenu, het uitschakelen van het selectievakje kan het extra item uit de vervolgkeuzelijst verwijderen.

Gebruikersinterface API-aanroepen vereisen een JSON-woordenboek dat het kenmerk en de waarde van het doel UI-item specificeert.

setUIVal - Stel de waarde in voor een zijbalk UI-item. Alle waarden moeten worden doorgegeven als strings, inclusief gehele getallen en bools.

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

Checkbox Voorbeeld:
window.webkit.messageHandlers.setUIVal.postMessage('{"attr":"checkbox-data","value":"1","sync":"false"}');

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

Voorbeeld uitlijncontrole:
window.webkit.messageHandlers.setUIVal.postMessage('{"attr":"align-data","value":"2","sync":"false"}');

setUIState - Stel de status (ingeschakeld / uitgeschakeld) van een zijbalk UI-item in.

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

setUIBewerkbaar - Stel in of de inhoud van een UI-item kan worden bewerkt.

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

setUIVerborgen - Stel in of een UI-item verborgen is.

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

popUIMenu - Vul een vervolgkeuzemenu-item met opties.

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

Projectoproepen

Er zijn momenten waarop u extra bronnen moet toevoegen aan een project dat uw aangepaste Bric​ Met de volgende API-aanroepen kunt u extra projectresources toevoegen.

projectResource - Voeg extra custom toe Bric middelen voor een project. Eenmaal toegevoegd, worden deze weergegeven in de projectbijlagen onder projectinstellingen. JS-, CSS-, PHP- en HTML-bestanden worden momenteel ondersteund, evenals mappen. Bijgevoegde JS-bestanden worden in de export / js-directory geplaatst, CSS-bestanden worden in de export / css-directory geplaatst en PHP-bestanden worden in de export / include-directory geplaatst. Binnen een paginacode worden de CSS-bronnen vóór de afsluitende head-tag geplaatst en worden JS-bronnen vóór de afsluitende body-tag geplaatst. Alle aanvullende bronnen waarnaar wordt verwezen door uw gewoonte Bric, moet worden opgenomen in uw gebruik Brics bronnen directory.

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

Opmerking voor beginners

De projectResource api-aanroep mag alleen worden gebruikt om extra bestanden aan een project toe te voegen. Al uw Brics essentiële code (vereist om de Bric functie na export), moet in de Brics inclusief directory.

Pagina-oproepen

Er zijn momenten dat u extra bronnen moet toevoegen aan een pagina die uw aangepaste Bric​ Met de volgende API-aanroepen kunt u extra paginabronnen toevoegen en een achtervoegsel voor het exporteren van pagina's beheren.

hulpbron - Voeg extra custom toe Bric bronnen naar een pagina. Eenmaal toegevoegd, worden deze weergegeven in de paginabijlagen onder pagina-instellingen. JS-, CSS- en PHP-bestanden worden momenteel ondersteund. Bijgevoegde JS-bestanden worden in de export / js-directory geplaatst, CSS-bestanden worden in de export / css-directory geplaatst en PHP-bestanden worden in de export / include-directory geplaatst. Alle bronnen waarnaar wordt verwezen door uw gewoonte Bric, moet worden opgenomen in uw gebruik Brics bronnen directory.

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

pagina Achtervoegsel - Stel het huidige pagina-achtervoegsel in, bijv. HTML, PHP.

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

Sjabloonoproepen

Het kan voorkomen dat u door de gebruiker gedefinieerde waarden moet opnemen in extra bestanden die bij de geëxporteerde site worden geleverd. Met de volgende API-aanroep kunt u dit doen.

winkelCustomBricSjabloonVal - Sla een door de gebruiker gedefinieerde waarde op die wordt opgenomen in een custom Bric sjabloonbestand. Sjabloonbestanden kunnen CSS, JS, JSON en PHP zijn en moeten worden toegevoegd aan het aangepaste Bric inhoud in een map met de naam templates.

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

Belangrijkste waarden:
De winkelCustomBricSjabloonVal API-aanroep moet de volgende sleutelwaarden bevatten:

attr - De attribuutwaarde wordt gebruikt om de gebieden te identificeren die bij het exporteren in het sjabloonbestand zullen worden vervangen. Als dit attribuut wordt gebruikt in een sjabloonbestand, moet het worden ingepakt in% eg% my-attr%.
waarde - De waarde die het attribuut in het sjabloonbestand zal vervangen.
sjabloon - De naam van het sjabloonbestand. Dit bestand moet zich in een map met de naam templates in jouw Brics inhoud.
forceer nieuw bestand - Als er twee Brics met verschillende waarden naar hetzelfde sjabloonbestand schrijven en dit is ingesteld op JA, er wordt een ander sjabloonbestand gemaakt, bijv.bric-js-1.js.

Korte codes
Het is ook de moeite waard om dat op te merken korte codes kan ook worden gebruikt in sjabloonbestanden.

DOM-wijzigingen

Eigen Brics worden gemanipuleerd buiten de hoofdontwerpomgeving, geeft deze methode ontwikkelaars de volledige vrijheid om de gewoonte te manipuleren Brics 'DOM' (Document Object Model) op welke manier dan ook, met elk type JS-gebaseerde taal. Nadat een functie wijzigingen heeft aangebracht in de custom Brics DOM, moet het de sync protocol om de DOM-wijzigingen te synchroniseren met de custom Bric gelegen aan de main Blocs ontwerp canvas.

sync - Nadat DOM-manipulatie heeft plaatsgevonden, synchroniseert de synchronisatie-API-aanroep de wijzigingen naar het main Blocs ontwerp canvas. Er is geen voorbewerking of weergave tijdens de synchronisatie; het gebeurt allemaal onmiddellijk. Het is ook belangrijk om te bedenken dat de sync protocol zal ook een ongedaan maken-status creëren in het huidige document, dus gebruik deze aanroep alleen als er wijzigingen zijn aangebracht, anders worden onnodige ongedaan-statussen gecreëerd.

Tip voor beginners

Het synchronisatieprotocol wordt doorgaans gebruikt nadat een gebruiker interactie heeft gehad met een gewoonte Bric waardoor er een verandering in de HTML optreedt. Vermijd het gebruik van dit gesprek in de init(bricVersion,framework) functioneren, tenzij u een specifieke taak uitvoert, zoals het bijwerken van de HTML van een aangepast bestand Bric ter ondersteuning van een nieuw geïntroduceerde functie.

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

Feedback-oproepen

Er zijn momenten waarop het belangrijk is om informatie terug te sturen naar de gebruiker op basis van de wijzigingen die ze aanbrengen in een gewoonte Bric​ De volgende oproepen bieden verschillende manieren om dat te doen.

notificatie - Laat een in-app-melding zien die dat niet doet block volledige UI-toegang. Elk type melding moet zijn eigen ID-waarde hebben, want zodra een meldings-ID door de gebruiker wordt afgewezen, wordt deze niet opnieuw weergegeven als deze wordt aangeroepen.

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

Het is ook mogelijk om een melding resetten met behulp van het reset-attribuut kan het ID-attribuut worden gebruikt om een ​​enkele ID of een reeks notificatie-ID's in te dienen.

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

te waarschuwen - Plaats een alert (blocks apps volledige gebruikersinterface totdat ze worden gesloten).

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

terugbellenAlert - Plaats een alert (blocks apps volledige gebruikersinterface totdat ze worden verwijderd) waarvoor de gebruiker een keuze moet maken. De gebruikerskeuze wordt teruggegeven aan de functie als een BOOL-waarde.

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

Open url - Open een URL in de webbrowser van de gebruiker.

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

Misc

Diverse oproepen die worden gebruikt voor het ontwikkelen.

debug - Plaats een foutopsporingsbericht dat wordt weergegeven in het ontwikkelaarsconsole venster.

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

Bijgewerkt op 16 november 2023

Was dit artikel behulpzaam?

Gerelateerde artikelen