1. ホーム
  2. 開発者
  3. API呼び出し

API呼び出し

概要

  Blocs 開発者APIは、カスタムとの対話に使用できる一連のルーチンとプロトコルを提供します Brics ユーザーインターフェイス、HTML出力、およびその他のさまざまな側面 Blocs 設計環境。

通話はカスタム経由で行われます BricのJavascript関数、関数は任意のJS形式、jQuery 2、jQuery3などで記述できます。

すべてのAPI呼び出しは、 WebKitメッセージハンドラー また、JSONディクショナリまたは文字列の形式で単一のデータセットを渡す必要があります。 API呼び出しのデータ値は、 投稿メッセージ ブラケット。

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

UI呼び出し

カスタムの場合 Bric を選択すると、サイドバーはカスタムに基づいてUI値を自動的に入力します Brics 現在の値。 サイドバーUIアイテムが操作されると、そのアイテムの状態は自動的に更新されますが、次のAPI呼び出しを使用すると、他のUIアイテムとそのカスタムの値を操作できます。 Bric。 たとえば、チェックボックスをオンにすると、ドロップダウンメニューに別のメニュー項目が追加され、チェックを外すと、ドロップダウンから追加の項目が削除される可能性があります。

ユーザーインターフェイスAPI呼び出しには、ターゲットUIアイテムの属性と値を指定するJSONディクショナリが必要です。

setUIVal –サイドバーUIアイテムの値を設定します。 整数やブールを含むすべての値は、文字列として渡す必要があります。

ドロップダウンの例:
window.webkit.messageHandlers.setUIVal.postMessage('{"attr":"dropdown-data","value":"1","sync":"false"}');

チェックボックスの例:
window.webkit.messageHandlers.setUIVal.postMessage('{"attr":"checkbox-data","value":"1","sync":"false"}');

入力フィールドの例:
window.webkit.messageHandlers.setUIVal.postMessage('{"attr":"field-data","value":"Hello World","sync":"false"}');

アライメント制御の例:
window.webkit.messageHandlers.setUIVal.postMessage('{"attr":"align-data","value":"2","sync":"false"}');

setuistate –サイドバーUIアイテムの状態(有効/無効)を設定します。

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

setUI編集可能 –UIアイテムのコンテンツを編集できるかどうかを設定します。

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

setUI非表示 –UIアイテムを非表示にするかどうかを設定します。

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

ポップUIメニュー –ドロップダウンメニュー項目にオプションを入力します。

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

プロジェクトコール

カスタムを含むプロジェクトにリソースを追加する必要がある場合があります Bric。 次のAPI呼び出しを使用すると、プロジェクトリソースを追加できます。

プロジェクトリソース –カスタムを追加 Bric プロジェクトへのリソース。 追加すると、これらはプロジェクト設定の下のプロジェクト添付ファイルに表示されます。 現在、JS、CSS、PHP、HTMLファイル、およびディレクトリがサポートされています。 添付されたJSファイルはエクスポート/ jsディレクトリに配置され、CSSファイルはエクスポート/ cssディレクトリに配置され、PHPファイルはエクスポート/ includesディレクトリに配置されます。 ページコード内では、CSSリソースは終了headタグの前に配置され、JSリソースは終了bodyタグの前に配置されます。 カスタムによって参照されるすべての追加リソース Bric、カスタムに含める必要があります Brics リソースディレクトリ。

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

初心者向けメモ

  プロジェクトリソース api呼び出しは、プロジェクトにファイルを追加するためにのみ使用する必要があります。 あなたのすべて Brics 必須コード(作成するために必要) Bric エクスポート後の機能)、に配置する必要があります Brics ディレクトリが含まれています.

ページ呼び出し

カスタムを含むページにリソースを追加する必要がある場合があります Bric。 次のAPI呼び出しを使用すると、ページリソースを追加したり、ページエクスポートサフィックスを制御したりできます。

リソースを追加する。 –カスタムを追加 Bric ページへのリソース。 追加すると、これらはページ設定の下のページ添付ファイルに表示されます。 JS、CSS、PHPファイルは現在サポートされています。 添付されたJSファイルはエクスポート/ jsディレクトリに配置され、CSSファイルはエクスポート/ cssディレクトリに配置され、PHPファイルはエクスポート/ includesディレクトリに配置されます。 カスタムによって参照されるすべてのリソース Bric、カスタムに含める必要があります Brics リソースディレクトリ。

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

ページサフィックス –現在のページサフィックスを設定します(例:HTML、PHP)。

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

テンプレート呼び出し

エクスポートされたサイトに含まれる追加のファイル内にユーザー定義の値を含める必要がある場合があります。 次のAPI呼び出しでは、これを行うことができます。

storeカスタムBricテンプレート値 –カスタムに含まれるユーザー定義値を保存します Bric テンプレートファイル。 テンプレートファイルはCSS、JS、JSON、PHPであり、カスタムに追加する必要があります Bric 名前の付いたディレクトリの内容 テンプレート.

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

キー値:
  storeカスタムBricテンプレート値 API呼び出しには、次のキー値を含める必要があります。

ATTR –属性値は、エクスポート時にテンプレートファイルで置き換えられる領域を識別するために使用されます。 この属性をテンプレートファイル内で使用する場合は、%でラップする必要があります(例:%my-attr%)。
–テンプレートファイルの属性を置き換える値。
template –テンプレートファイル名。 このファイルは、という名前のディレクトリに配置する必要があります テンプレート あなたの中で Brics 内容。
強制新規ファイル –XNUMXつの場合 Brics 異なる値を使用して同じテンプレートファイルに書き込み、これをYESに設定すると、別のテンプレートファイルが作成されます(例:custom-bric-js-1.js。

ショートコード
それも注目に値する ショートコード テンプレートファイルでも使用できます。

DOMの変更

カスタム Brics メインの設計環境の外で操作される場合、このメソッドは開発者にカスタムを操作する完全な自由を与えます Brics 「DOM」(ドキュメントオブジェクトモデル)、あらゆるタイプのJSベースの言語。 関数がカスタムに変更を加えた後 Brics DOM、それを呼び出す必要があります sync DOMの変更をカスタムに同期するためのプロトコル Bric メインにあります Blocs デザインキャンバス。

sync – DOM操作が行われた後、syncAPI呼び出しは変更をメインに同期します Blocs デザインキャンバス。 同期中に前処理やレンダリングはなく、すべてが瞬時に行われます。 次のことを考慮することも重要です。 sync このプロトコルは、現在のドキュメントに元に戻す状態も作成するため、変更が行われた場合にのみこの呼び出しを使用します。それ以外の場合は、不要な元に戻す状態が作成されます。

初心者向けのヒント

同期プロトコルは通常、ユーザーがカスタム プロトコルと対話した後に使用されます。 Bric HTML に変更が生じます。 この呼び出しを次の場所で使用することは避けてください。 init(bricVersion,framework) カスタムの HTML の更新などの特定のタスクを実行する場合を除き、関数は使用されません。 Bric 新しく導入された機能をサポートするため。

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

フィードバックコール

ユーザーがカスタムに加えた変更に基づいて、ユーザーに情報をフィードバックすることが重要な場合があります。 Bric。 次の呼び出しは、それを行うためのさまざまな方法を提供します。

通知 –表示されないアプリ内通知を表示する block完全なUIアクセス。 通知IDがユーザーによって却下されると、呼び出されても再度表示されないため、各タイプの通知には独自のID値が必要です。

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

することも可能です 通知をリセットする リセット属性を使用すると、ID属性を使用して単一のIDまたは通知IDの配列を送信できます。

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

アラート –アラートを投稿する(blocksアプリは却下されるまで完全なUI)。

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

コールバックアラート –アラートを投稿する(blocksアプリは却下されるまで完全なUI)であり、ユーザーが選択する必要があります。 ユーザーの選択は、BOOL値として関数に返されます。

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

オープンURL –ユーザーのWebブラウザーでURLを開きます。

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

その他

開発に使用されるその他の呼び出し。

debug –に表示されるデバッグメッセージを投稿します 開発者コンソールウィンドウ.

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

16年2023月XNUMX日に更新

この記事は役に立ちましたか?

関連記事