APIを使用したカスタム・セクション・レイアウトの開発

レンダリングAPIおよび編集APIが含まれるセクション・レイアウトAPIを使用してOracle Content Managementでカスタム・セクション・レイアウトを開発できます。

検討すべきスタータ・ファイルについては、「セクション・レイアウトの作成」を参照してください。セクション・レイアウトのスタータ・ファイルには、セクション/レイアウト・ファイルの構造に関する詳細とともにコメントが含まれます。

レンダリングAPI

render.jsモジュールからロードするレンダリングAPIは、サイト・ビルダ内および実行時に使用されます。

レンダリングAPI 説明入力パラメータ戻り結果

レンダリングAPI	説明	入力パラメータ	戻り結果
(コンストラクタ)	セクション・レイアウトのレンダリング・モジュールを初期化します。	次のプロパティが含まれるJavaScriptオブジェクト: sectionlayoutData (オブジェクト): ページ・モデル内にあるセクション・レイアウト・データ。 componentId (文字列): セクション・レイアウトの`componentId`値 (通常はGUID)。 renderMode (文字列、オプション): レンダリング操作のレンダリング・モード。 customSettingsData (オブジェクト): `sectionLayoutData`にある`customSettingsData`のコピー。	セクション・レイアウトのレンダリングAPIは初期化されます。
レンダリング	セクション・レイアウトに適したDOM要素をページに発行します(子コンポーネント用のコンテナDIVを含む)。	container (要素) : セクション・レイアウトのマークアップのレンダリング先にする必要があるDOM要素。	このメソッドが返された後、子コンポーネントがレンダリングされます。 `div[id]`子要素を見つけることにより、子コンポーネントを特定できます
addComponent	子コンポーネントをセクション・レイアウトに動的に追加するためにコンテンツ・リスト・コンポーネントとともに使用します。この機能はオプションです。	container (要素) : 新しいコンポーネントのレンダリング先にする必要があるDOM要素。 componentId (文字列): セクション・レイアウトに追加する新しいコンポーネントのID。	このメタデータが返された後、IDが`componentId`入力と一致する要素がレンダリングされます。

(コンストラクタ)

セクション・レイアウトのレンダリング・モジュールを初期化します。

次のプロパティが含まれるJavaScriptオブジェクト:

sectionlayoutData (オブジェクト): ページ・モデル内にあるセクション・レイアウト・データ。
componentId (文字列): セクション・レイアウトのcomponentId値 (通常はGUID)。
renderMode (文字列、オプション): レンダリング操作のレンダリング・モード。
customSettingsData (オブジェクト): sectionLayoutDataにあるcustomSettingsDataのコピー。

セクション・レイアウトのレンダリングAPIは初期化されます。

レンダリング

セクション・レイアウトに適したDOM要素をページに発行します(子コンポーネント用のコンテナDIVを含む)。

container (要素) : セクション・レイアウトのマークアップのレンダリング先にする必要があるDOM要素。

このメソッドが返された後、子コンポーネントがレンダリングされます。

div[id]子要素を見つけることにより、子コンポーネントを特定できます

addComponent

子コンポーネントをセクション・レイアウトに動的に追加するためにコンテンツ・リスト・コンポーネントとともに使用します。

この機能はオプションです。

container (要素) : 新しいコンポーネントのレンダリング先にする必要があるDOM要素。

componentId (文字列): セクション・レイアウトに追加する新しいコンポーネントのID。

このメタデータが返された後、IDがcomponentId入力と一致する要素がレンダリングされます。

編集API

セクション・レイアウトに関連付けられたappinfo.jsonファイルでhasEditHandlersプロパティがtrueに設定されている場合、edit.jsモジュールがロードされます。

編集APIはサイト・ビルダーで使用されます。

コンストラクタを除くこのモジュール内のすべての関数はオプションです。

編集API	説明	入力パラメータ	戻り結果
(コンストラクタ)	セクション・レイアウトの編集モジュールを初期化します。	次のプロパティが含まれるJavaScriptオブジェクト: componentId (文字列): セクション・レイアウトの`componentId`値 (通常はGUID)。	セクション・レイアウトの編集APIは初期化されます。
getCapabilities	セクション・レイアウトの編集機能を説明するオブジェクトを返します。	セクション・レイアウトの編集機能を説明するJavaScriptオブジェクト。入力時に、デフォルトの機能が関数に提供されます。この関数は、必要に応じて機能オブジェクトを変更できます。機能オブジェクトには、次の機能が含まれます: title (文字列): ユーザーに表示するセクション・レイアウトのタイトル。 settingsTitle (文字列): 設定パネル・ダイアログに表示するタイトル。 hasSettings (ブール): セクション・レイアウトが「設定」パネルをサポートするかどうかを示します。 allowMove (ブール): セクション・レイアウトで子アイテムを移動できるかどうかを示します。 allowDelete (ブール): セクション・レイアウトで子アイテムを削除できるかどうかを示します。 isHidden (ブール): セクション・レイアウトがユーザー・オプションに対応して現在非表示であるかどうかを示します。 dropTarget (ブール): セクション・レイアウトがドラッグ・アンド・ドロップ操作のターゲットであるかどうかを示します。 customMenuOptions (配列): 「セクション・レイアウト」コンテキスト・メニューに追加するカスタム・メニュー・オプション。各メニュー・オプション・オブジェクトには、次のプロパティがあります: label (文字列): メニュー・アイテムの表示テキスト。 action (関数): メニュー・アイテムがクリックされたときに呼び出される関数。 disabled (ブール): メニュー・アイテムを無効状態で表示する必要があることを示します。 icon (文字列): メニュー・アイテムのラベルの横に表示するURL。(このプロパティは将来的な使用に備えて確保されています。) checkmark (ブール): メニュー・アイテムのラベルの横にチェックマークを表示する必要があることを示します。 subMenuItems (配列): サブメニューに表示するメニュー・オプション。	(オブジェクト): セクション・レイアウトの機能。
getCaptionContent	UI要素に表示されるセクション・レイアウトの表示名を返します。	なし。	(文字列): セクション・レイアウトの表示名。
filterCapabilities	メニューがユーザーに表示される前にセクション・レイアウトで機能オブジェクトを変更できるようにします。このAPIを使用してメニュー・オプションを調整または削除できます。(getCapabilitiesも参照してください。)	セクション・レイアウトの編集機能を説明するJavaScriptオブジェクト。入力時に、デフォルトの機能が関数に提供されます。	(オブジェクト)セクション・レイアウトの機能。
onDragOver	ドラッグ・アンド・ドロップ操作中にコールされ、ドラッグしたアイテムをセクション・レイアウトにドロップできるかどうかを示します。	eventObject (イベント・オブジェクト): ドラッグ・イベントに関する情報を保持するイベント・オブジェクト。 dataTransfer (DataTransferオブジェクト): セクション・レイアウトにドラッグされるアイテムに関する情報を保持する`DataTransfer`オブジェクト。	(ブール)ドラッグされたアイテムがセクション・レイアウトで受け入れることができるかどうかを示す値。セクション・レイアウトがドラッグされたアイテムを受け入れることができる場合はtrueを返し、そうでない場合はfalseを返します。
onDrop	ドラッグ・アンド・ドロップ操作のドロップ処理中にコールされ、ドラッグしたアイテムをセクション・レイアウト内に配置する必要があるかどうかを示します。	eventObject (イベント・オブジェクト): ドロップ・イベントに関する情報を保持するイベント・オブジェクト。 dataTransfer (DataTransferオブジェクト): セクション・レイアウトにドロップされるアイテムに関する情報を保持するDataTransferオブジェクト。	(ブール)ドロップ操作がセクション・レイアウトによって処理されたかどうかを示す値。 trueが返される場合、デフォルトのロジックはバイパスされます。
onAddComponent	ドラッグ・アンド・ドロップ操作によってセクション・レイアウトにアイテムが追加されたことをセクション・レイアウトに通知します。	eventObject (イベント・オブジェクト): ドラッグ・イベントに関する情報を保持するイベント・オブジェクト。 dataTransfer (DataTransferオブジェクト): セクション・レイアウトにドロップされるアイテムに関する情報を保持するDataTransferオブジェクト。 componentId (文字列): 新しく追加されたアイテムの`componentId`値。	セクション・レイアウト通知。
onMoveComponent	ドラッグ・アンド・ドロップ操作によってセクション・レイアウトのアイテムが移動されたことをセクション・レイアウトに通知します。	eventObject (イベント・オブジェクト): ドラッグ・イベントに関する情報を保持するイベント・オブジェクト。 dataTransfer (DataTransferオブジェクト): セクション・レイアウトにドロップされるアイテムに関する情報を保持するDataTransferオブジェクト。 componentId (文字列): 移動されたアイテムの`componentId`値。	セクション・レイアウト通知。
getSettingsData	「設定」パネルが表示される前にセクション・レイアウトで設定データを変更することを許可します。	settingsData (オブジェクト): セクション・レイアウト用として計算されたデフォルトの設定データ	(オブジェクト)セクション・レイアウトの設定データ。
updateSettings	「設定」パネルがクローズされた後にセクション・レイアウトで設定データを変更することを許可します。このAPIは、設定がページ・モデルに格納される直前にコールされます。	parameters (オブジェクト): 「設定」パネルから返されるRAWパラメータ・オブジェクト。 sectionLayoutData (オブジェクト): 格納されるセクション・レイアウト・データ。デフォルトのデータは、`parameters (オブジェクト)`から生成され、このパラメータの関数に渡されます。	(オブジェクト)ページ・モデル内に格納するセクション・レイアウト・データ。
dispose	編集モジュールがメモリーを解放し、イベントをデタッチし、編集ハンドラに関連付けられたリソースを割当解除することを許可します。このAPIがコールされるのは、元に戻す/やり直す操作の場合のように、セクション・レイアウトを完全に再描画する必要がある場合です。	なし。	セクション・レイアウトの再描画は有効です。