アクション・チェーンのビジュアル作成
ここでは、アクション・チェーン・エディタのデザイン・モードを使用して、組込みアクションをタスクを実行するシーケンスに組み立てます。 各アクションは特定の関数を実行し、後続のアクションの入力として機能する結果を返します。
アクション・チェーンを視覚的に作成するには:
- プリファレンスおよびトリガー方法に応じて、アクション・チェーンの作成を開始する場所に移動します:
- 「アクション・チェーン」タブ:
アクション・チェーンの作成に直接進み、後でイベント・リスナー、コンポーネント・イベントまたは変数イベントに割り当てる場合は、application、フローまたはページ・レベルの関連する「アクション・チェーン」タブに移動します。 「アクション・チェーン」タブで、「+アクション・チェーン」ボタンをクリックします。 かわりにタブにアクション・チェーンが表示された場合は、アクション・チェーン・エディタのアクション・チェーンリンクをクリックして、作成されたアクション・チェーンのリストおよび新しいアクション・チェーンを作成するためのボタンをクリックします:
図jsac-action-chains-link-editor.jpgの説明
- 「イベント・リスナー」タブ:
ライフサイクル、アプリケーション、フローまたはページ・イベント(
vbBeforeEnter, vbEnter, vbAfterNavigate
...)によって新しいアクション・チェーンを開始するには、「イベント・リスナー」タブを選択し、「+イベント・リスナー」をクリックします。 イベント・リスナーの作成ウィザードで、イベントを選択し、「次」をクリックします。 ウィザードの「アクション・チェーンの選択」ステップで、適切なレベル(ページ、フローまたはapplication)でアクション・チェーンの作成オプションを選択し、「終了」をクリックします。 詳細は、「ライフサイクル・イベントからのアクション・チェーンの開始」を参照してください。
「
図jsac-create-action-chain-wizard.jpgの説明」
- Custom Event:
別のアクション・チェーンの火災イベント・アクションによってトリガーされるカスタム・イベントによって新しいアクション・チェーンを開始するには、「火災イベント・アクションの追加」を参照してください。
- コンポーネント:
新しいアクション・チェーンをコンポーネント・イベントによって開始するには、ページ・デザイナのキャンバスでコンポーネントを選択し、プロパティ・ペインで「イベント」タブを使用して、コンポーネントの新しいイベント、イベント・リスナーおよびアクション・チェーンを作成します。 詳細は、「コンポーネントからのアクション・チェーンの起動」および「カスタム・イベントを起動してアクション・チェーンを開始」を参照してください。
- 変数:
変数の値が変更されたときにアクション・チェーンを開始するには、関連する「変数」タブをapplication、フローまたはページ・レベルで開き、変数を選択します。 「プロパティ」ペインで、「イベント」タブを選択し、「+イベント・リスナー」をクリックします。 新しい
onValueChanged
イベントが変数に対して自動的に作成され、既存のアクション・チェーンを選択するか、新しいアクション・チェーンを作成するためのウィンドウが表示されます。 詳細は、「変数が変更された場合のアクション・チェーンの開始」を参照してください。
イベントおよびイベント・リスナーの詳細は、「イベント・リスナーおよびイベント・リスナーの操作」を参照してください。
- 「アクション・チェーン」タブ:
- IDフィールドにアクション・チェーンの名前を入力し、必要に応じて説明を入力します。 新しいアクション・チェーンがアクション・チェーン・エディタで開きます:
- 新しいアクション・チェーンに入力パラメータが必要な場合:
- プロパティ・ペインのパラメータ・プロパティの「追加」リンクを使用して、入力パラメータを定義します。
- 入力パラメータ値をアクション・チェーンに渡します:
- 別のアクション・チェーンでアクション・チェーンを開始する場合、入力パラメータは、コールを介して新しいアクション・チェーンに渡されます。
-
新しいアクション・チェーンをイベント・リスナーによって起動する場合は、関連するイベント・リスナータブ(アプリケーション、フローまたはページ・レベル)を開き、イベント・リスナーを選択して、プロパティ・ペインの入力パラメータプロパティの割り当てリンクを使用します:
図jsac-select-event-listener.jpgの説明 - アクション・チェーンをコンポーネントによって開始する場合は、ページ・デザイナのキャンバスでコンポーネントを選択し、プロパティ・ペインで「イベント」タブを選択します。 「入力パラメータ」プロパティには、「割り当て」リンクを使用します。
- アクション・チェーンが変数によって開始される場合は、関連する「変数」タブ(アプリケーション、フローまたはページ・レベル)を開き、プロパティ・ペインで「イベント」タブを選択します。 「入力パラメータ」プロパティには、「割り当て」リンクを使用します。
- アクション・チェーンがペイロードを返す必要がある場合は、キャンバスをクリックして「プロパティ」ペインでアクション・チェーンを表示します。 戻り型の場合は、タイプを選択するか、作成リンクをクリックして戻り型を作成します:
この例に示すように、戻りアクションの変数が選択されている場合、アクション・チェーンによって返される結果は、ローカルノードの変数ピッカーで使用できます :
図jsac-action-chain-results-assigner.jpgの説明これで、アクション・チェーンを構成するアクションを追加する準備ができました。
- 必要なアクションがアクション・パレットで使用できない場合は、「コード」アクションを追加して独自のコード・ブロックを追加するか、将来必要になると思われる場合はカスタム・アクションを作成します。 カスタム・アクションの作成方法の詳細は、「カスタム・アクション」を参照してください。
- アクション・パレットから、アクションをダブルクリックするか、キャンバスにドラッグ・アンド・ドロップします。 新しいアクションがチェーンに追加され、デフォルトで選択されます。 「プロパティ」ペインには、アクションに指定できるプロパティが表示され、キャンバスのアクションのカードには指定された値が表示されます。 たとえば、プロパティ・ペインでプロパティが設定されたCall Restアクションを次に示します:
- アクション・パレットから次のアクションをダブルクリックまたはドラッグ・アンド・ドロップして、その後のアクションの下部にドロップします。 プロパティ・ペインまたはコードを使用してアクションを構成します。 別のアクションの前にアクションを追加するには、そのアクションが先行するアクションの上端にドロップします。
前述のとおり、Structureペインにはアクションのコンパクト・ビューが表示され、アクションをすばやく検索して選択するためのフィルタが提供されます。
- アクション・チェーンのローカル・ファンクションを作成する場合は、モジュール性を確保するために、キャンバス上にアクションをドラッグしたときに表示されるファンクションの作成領域にファンクションの最初のアクションをドロップします:
ローカル関数が作成されると、キャンバス上に独自の領域が表示され、プロパティ・ペインにそのプロパティが表示され、構造ペインにそのアクションが表示されます。 また、ローカル関数がローカル関数カテゴリのアクション・パレットに追加され、コールをすばやく追加できます。
「
図jsac-create-chain-create-function-ui.pngの説明」
- アクション・チェーンが完了するまで、アクションの追加および構成を続行します。 アクション・チェーンは、変更を加えると自動的に保存されます。
チェーンからアクションを削除する必要がある場合は、キャンバスでアクションを右クリックし、「削除」を選択するか、キーボードの「削除」を押します。 プロパティ・ペインで、そのオプション・メニューを使用してアクションを削除することもできます:
図jsac-delete-action-canvas.jpgの説明
アクション・チェーンの使用状況の詳細(それを使用するページなど)を表示するには、キャンバスの空白をクリックしてアクション・チェーンを選択し、プロパティ・ペインの使用状況の下を確認します。 使用方法をクリックすると、そこに移動します。 次に示すように、アクション・チェーンをコールするイベントに関連付けられたイベント・リスナーもリストされます:
図jsac-action-chain-usage.jpgの説明
アクション・チェーンの作成方法の例
この例では、2つの数値を加算または減算して結果を表示するアクション・チェーンを作成して、この加算および減算インタフェースを実装します:
図jsac-adder-subtractor-interface.jpgの説明
このインタフェースには次のものがあります:
- 4つのテキスト・コンポーネント:
- 加算または減算する数値の入力に2つ(数値1、数値2)
- プラス記号またはマイナス記号(演算子)を入力する1つ
- 結果を表示する1つ(アンサー)
- 操作を実行し結果を表示するアクション・チェーンをトリガーする1つのボタン(=)
4つのテキスト・コンポーネントのそれぞれがページ変数にバインドされます:
図jsac-four-components-bound-var.jpgの説明
ここでは、2つの数値を加算または減算して結果を表示するアクション・チェーンを作成します:
- 等しいボタンをクリックしてアクション・チェーンをトリガーするため、ページ・デザイナのキャンバスで等しいボタンを選択し、プロパティ・ペインのイベントタブを選択します:
- 前述のように、「+イベント・リスナー」、On 'ojAction'の順にクリックして、ボタンをクリックしてトリガーされるイベントを作成します。
新しいアクション・チェーンがアクション・チェーン・エディタで開きます。
- プロパティ・ペインを使用して、アクション・チェーンのIDフィールドにAdder_Subtractorと入力し、オプションで説明を入力します。
- 3つの入力パラメータ(数値に2つ、演算子に1つ)が必要であるため、プロパティ・ペインのパラメータ・プロパティの横にある追加リンクを使用して追加する必要があります:
このアクション・チェーンでは何も返されないため、戻り型を定義する必要はありません。
- 次に、入力パラメータの値を指定する必要があります。 「イベント・リスナー」タブを開き、等ボタンのイベント・リスナーを選択します。 プロパティ・ペインで、入力パラメータプロパティの割り当てリンクをクリックします:
- マッパーで、数値および演算子のテキスト・コンポーネントにバインドされたページ変数をアクション・チェーンの入力パラメータにマップします:
このアクション・チェーンを実装するには、演算子フィールドに入力できる各エントリを処理する必要があります: プラス、マイナスおよび無効なエントリ。 - まず、アクション・パレットからキャンバスに「条件」アクションをドラッグ・アンド・ドロップします。
- キャンバスで
If
条件を選択し、プロパティ・ペインで「条件」フィールドにoperator_ip === '+'と入力して、ユーザーがプラス記号を入力したかどうかを確認します。このケースに対処するには、作成する単純なアクション・チェーンに2つの数値の合計を返すコールを追加します。
- 「コール・アクション・チェーン」アクションをアクション・パレットから
If
条件にドラッグ・アンド・ドロップします。 - 2つの数字を追加するアクション・チェーンを作成するには、プロパティ・ペインで、アクション・チェーンIDプロパティ(前述)の「作成」リンクをクリックします。 ダイアログ・ボックスで、IDフィールドにAdd_Numbersと入力し、オプションで説明を入力します。 「作成」ボタンをクリックします。
アクション・チェーンが作成され、アクション・チェーンIDプロパティに設定されました。
- 次に、アクション・チェーンIDプロパティの「アクション・チェーンに移動」リンクをクリックして、Add_Numbersアクション・チェーンを実装する必要があります。
これで、アクション・チェーン・エディタにAdd_Numbersアクション・チェーンがロードされます。
- Add_Numbersアクション・チェーンを実装するには:
- プロパティ・ペインで、パラメータ・プロパティの追加リンクをクリックし、追加する番号の入力パラメータを2つ追加:
num1
およびnum2
。 - アクション・チェーンは数値を返す必要があるため、「戻り型」に「数値」を選択して戻り型を定義します。
- 「戻る」アクションをアクション・パレットからキャンバスにドラッグ・アンド・ドロップします。 プロパティ・ペインで、「ペイロード」プロパティに{{ num1 + num2 }}と入力して、2つの入力パラメータの合計を返します。 二重の中カッコを使用して式を折り返すと、文字列ではなくリテラル式であることが示されます:
- プロパティ・ペインで、パラメータ・プロパティの追加リンクをクリックし、追加する番号の入力パラメータを2つ追加:
- エディタの左上にある「アクション・チェーン」リンクをクリックし、アクション・チェーンを選択して、Adder_Subtractorアクション・チェーンに戻ります。
エディタにAdder_Subtractorアクション・チェーンがロードされました。
- Adder_Subtractorアクション・チェーンに入力パラメータとして渡された2つの数値を、Add_Numbersアクション・チェーンに渡す必要があります。 キャンバスでコール・アクション・チェーン・アクションを選択し、プロパティ・ペインでパラメータプロパティの番号入力パラメータを選択します:
ここで、Add_Numbersアクション・チェーンからの結果を、アンサーを表示するテキスト・コンポーネントにバインドされているページ変数に割り当てる必要があります。
- 「変数の割当て」アクションをキャンバスの「コール・アクション・チェーン」アクションの下端にドラッグ・アンド・ドロップします。 変数プロパティのプロパティ・ペインで、アンサーを表示するテキスト・コンポーネントにバインドされているページ変数を選択し、値プロパティでAdd_Numbersアクション・チェーンから結果を選択します:
次に、ユーザーが演算子にマイナス記号を入力したときにケースを処理するには、
Else If
条件が必要です。 - コール・アクション・チェーンアクションを
If
条件の下部のブランチの作成領域にドラッグ・アンド・ドロップします: - プロパティ・ペインの「条件」フィールドにoperator_ip === '-'と入力して、
Else
条件をElse If
に変更します。 - プラス記号のケースの処理方法に関する前述の手順に従って、この
Else If
条件を完了します。完了した
Else If
条件は次のとおりです:
図jsac-completed-else-if.jpgの説明 - 最後に、ユーザーが演算子にプラス記号またはマイナス記号を入力しない場合に、ケースを処理する必要があります。 「起動の通知」アクションをアクション・パレットから
Else
条件にドラッグ・アンド・ドロップします。 プロパティ・ペインで、「サマリー」プロパティにInvalid operatorと入力し、「メッセージ」プロパティに次のように入力します:The operator must be "+" or "-".
オラクルのアクション・チェーンは完了しました。
- この時点で、新しいアクション・チェーンをテストするためのユニット・テストを作成することをお薦めします。 その方法の詳細は、「テスト・アクション・チェーン」を参照してください。
define([
'vb/action/actionChain',
'vb/action/actions'
], (
ActionChain,
Actions
) => {
'use strict';
class Adder_Subtractor extends ActionChain {
/**
* Take 2 numbers, perform mathematic operation and display the result.
* @param {Object} context
* @param {Object} params
* @param {number} params.num1_ip
* @param {number} params.num2_ip
* @param {string} params.operator_ip
*/
async run(context, { num1_ip = '0', num2_ip = '0', operator_ip }) {
const { $page, $flow, $application, $functions } = context;
if (operator_ip === '+') {
const callChainResult_AddNumbers = await Actions.callChain(context, {
chain: 'Add_Numbers',
params: {
num1: num1_ip,
num2: num2_ip,
},
}, { id: 'callAddChain' });
$variables.Answer = callChainResult_AddNumbers;
} else if (operator_ip === '-') {
const callChainResult_SubNumbers = await Actions.callChain(context, {
chain: 'Sub_Numbers',
params: {
num1: num1_ip,
num2: num2_ip,
},
});
$variables.Answer = callChainResult_SubNumbers;
}
else {
await Actions.fireNotificationEvent(context, {
summary: 'Invalid operator',
message: 'The operator must be "+" "-".',
});
}
}
}
return Adder_Subtractor;
});