UI/Config/GlobalHtml
グローバル構成エレメントを使用する必要があります。
Contributorインタフェースでグローバル・プロパティ、ツールバーおよびメニュー・バーをカスタマイズする方法は、次の項を参照してください。
グローバル構成プロパティは、コンテンツ管理サイト全体にContributorインタフェースの表示条件を設定するために使用します。
この項には次のトピックが含まれます:
クライアント側のフレームワークにより、サーバー側のコントローラ・エレメントUI/Config/GlobalHtml
からその主要な構成設定が取得されます。このプレゼンテーション・エレメントは、起動時にクライアント側アプリケーションで実行される、JavaScriptコードを提供します。JavaScriptコードはJavaScript関数を定義し、その名前がクライアント側アプリケーションによってリクエスト・パラメータとして指定されます。
<%@ taglib prefix="cs" uri="futuretense_cs/ftcs1_0.tld"%> <cs:ftcs> webcenter.sites['${param.namespace}'] = function (config) { config.maxTabCount = 50; config.defaultView = …; … merge } </cs:ftcs>
config
オブジェクトには、クライアント側アプリケーションが期待するプロパティを設定することにより、関数本体で自由に操作できます。
また、次に説明するように、クライアント側アプリケーションはサーバー側から追加の構成プロパティを取得できるため、複数の場所にグローバル・プロパティを重複させることなく、複数のソースから設定をマージできます。
表72-1は、システム定義の構成プロパティについて説明し、どのプロパティが変更可能であるかを示しています。
表72-1 UI/Config/GlobalHtml
の構成プロパティ
プロパティ名 | 説明 | 値および例 |
---|---|---|
|
同時に開いたままにできるタブの最大数。タブとは、開かれたアセットのタブのことです。 |
例:
|
|
ユーザーがWebモードで作業する場合に、デフォルトのブラウザ・コンテキスト(右クリック)メニューを有効にする必要があるかどうかを示します。 |
例:
|
|
Webモードを有効にする必要があるかどうかを示します。このプロパティを デフォルトでは、このプロパティは、 |
例:
|
|
日付ベースのプレビューを有効にする必要があるかどうかを示します。 デフォルトでは、このプロパティは、 |
例:
|
|
プレビューが許可されるかどうかを示します。 デフォルトでは、このプロパティは、「サイトの編集」フォームの「プレビュー方法」属性の値をとります(Adminインタフェースからアクセス可能: 「管理」タブを選択して「サイト」を開き、「SampleSite」をダブルクリックして「編集」を選択します)。 |
例:
|
|
アセットを使用するための優先ビューを定義します(アセットがデフォルトでは、フォーム・モードまたはWebモードのどちらで表示されるかなど)。 注意: アセットはデフォルト・テンプレートに関連付けられている場合にのみ、Webモードで開かれます。 |
予想される値は次のいずれかです。
config.defaultView = { "default": "form", "AVIArticle": "web", "Page/AVISection": "web" } |
|
ビューのタイプごとに、使用可能なツールバー・アクションのリストを定義します。 |
「ツールバーのカスタマイズ」を参照してください。 |
|
特定のツールバー・ボタンの動作の定義に使用します。 |
「カスタム・アクションを使用したツールバーのカスタマイズ」を参照してください。 |
|
メニュー・バーで使用可能なアクションのリストを定義します。 |
「メニュー・バーのカスタマイズ」を参照してください。 |
|
ドキュメントの使用可能な実装を登録します。 |
このプロパティの値は変更しないでください。 サポートされる値は |
|
ビューの実装を登録します。 |
このプロパティの値は変更しないでください。 |
|
コントローラの実装、および各コントローラでサポートされるアクションのセットを登録します。 |
このプロパティの値は変更しないでください。 |
|
現在ログインしているユーザーのロールのリストが含まれます。 |
このプロパティの値は変更しないでください。 |
|
Contributorインタフェースから編集可能なアセット・タイプのリストが含まれます。 |
このプロパティの値は変更しないでください。 |
|
Contributorインタフェースから検索可能なアセット・タイプのリストが含まれます。 |
このプロパティの値は変更しないでください。 |
|
バイナリ・ファイルをアップロードする際のセキュリティ保護に使用します。 |
このプロパティの値は変更しないでください。 |
|
バイナリ・ファイルをアップロードする際のセキュリティ保護に使用します。 |
このプロパティの値は変更しないでください。 |
|
コンテキスト・メニューで使用可能なアクションのリストを定義します。 |
「コンテキスト・メニューのカスタマイズ」を参照してください。 |
UI/Config/GlobalHtml
に格納されているグローパル・プロパティを取得するほかに、Contributorアプリケーションは、UI/Config/SiteConfig
の追加設定およびUI/Config
に存在するエレメントを取得しようとします。要件によっては、UI/Config/GlobalHtml
に定義されているすべてのプロパティをレプリケートせずに、グローパル・プロパティまたはサイト固有のプロパティを設定できます。
この項には次のトピックが含まれます:
カスタム・グローバル・プロパティは、指定されたコンテンツ管理システム上のすべてのサイトで共有されます。推奨されるアプローチは、次のように定義されたカスタム構成エレメントを作成することです。
プレゼンテーション・エレメント名は、UI/Config/SiteConfigHtml
である必要があります。
エレメント・コードは、「構成プロパティについて」に示すパターンに従う必要があります。
たとえば、次のような操作を一時的に行う場合があります。
すべてのサイトのmaxTabCount
の値をオーバーライドします。
ページ・アセットのデフォルト・ビューをオーバーライドします。
また、foo
という追加のカスタム・プロパティを定義します。
そのためには、次のコードを含む、CustomElements/UI/Config/SiteConfigHtml
というエレメントを作成します。
<%@ taglib prefix="cs" uri="futuretense_cs/ftcs1_0.tld" %> <cs:ftcs> webcenter.sites['${param.namespace}'] = function (config) { // override existing properties config.maxTabCount = 60; config.defaultView.Page = "form"; // add custom properties config.foo = "bar"; } </cs:ftcs>
Contributorインタフェースは、コンテンツ管理サイトごとに異なる方法で構成する必要がある場合があります。UI/Config/SiteConfig
というコア・コントローラ・エレメントをオーバーライドすることをお薦めします。
UI/Config/SiteConfig
コア・エレメントをオーバーライドするには、次のようにエレメントを作成します。
CustomElements/siteName
/UI/Config/SiteConfigHtml
ここで、siteName
は、コンテンツ管理サイトの名前です(avisports
など)。
たとえば、avisportsデモ・サイトでは、PageおよびAVIArticleアセット・タイプに対してデフォルト・モードとしてWebモードが実行されます。これは、JSPエレメントCustomElements/avisports/UI/Config/SiteConfigHtml
を定義し、次の設定を提供することによって実行されます。
<%@ taglib prefix="cs" uri="futuretense_cs/ftcs1_0.tld" %> <%@ taglib prefix="ics" uri="futuretense_cs/ics.tld" %> <cs:ftcs> webcenter.sites['${param.namespace}'] = function (config) { // default view modes for avisports config.defaultView.Page = "web"; config.defaultView.AVIArticle = "web"; } </cs:ftcs>
構成エレメントのロード
グローバル構成エレメントは常に最初にロードされます。追加の構成エレメントは、アルファベット順にロードされます。たとえば、前述の例を使用すると、構成プロパティは次の順序でロードされます。
UI/Config/GlobalHtml
UI/Config/SiteConfigHtml
プロパティ値
ある場合、一部のプロパティの値はオブジェクトになります。つまり、次のようになります。
config.someProperty = { foo: "bar", x: 123 };
このプロパティを部分的にオーバーライドする場合、次の2つのタイプのコードの違いを見極める必要があります。
config.someProperty = { x: 3456 };
と
config.someProperty.x = 3456;
最初のコードでは、プロパティfoo
が未定義としてオーバーライドされますが、2番目のコードでは、foo
の元の値が保持されます。
ツールバーは、Webモードまたはフォーム・モードのアセット上で動作するアクションをリストするようにカスタマイズできます。ツールバーは、アセット・タイプおよびサブタイプごとに詳細にカスタマイズできます。
この項には次のトピックが含まれます:
グローバル構成エレメント(UI/Config/GlobalHtml
)は、各ビュー・タイプ(Webモード調査、Webモード編集、フォーム・モード編集、フォーム・モード調査など)について、ツールバーで表示されるアクションのリストを示します。これは、toolbars
プロパティで行えます。その値は、次の構文を持つオブジェクトです。
config.toolbars = { "viewAlias": [action_1, action_2, …], or: "viewAlias": { "view_mode_1": [action_1, action_2, …], "view_mode_2": [action_1, action_2, …] } … }
ここで:
viewAlias
は、このツールバーをどのビュー・タイプで使用する必要があるかを示します。別名は、config.views
セクションで定義されるビューの別名のいずれかに一致する必要があります。
action_i
はアクション名です。save
、approve
などの標準アクションの場合、アクション名は、指定されたアイコン、タイトル、代替テキストなどに自動的にマッピングされます。標準アクション、カスタム・アクション、またはカスタム・ボタンの外観のカスタマイズ方法の詳細は、「ツールバー・カスタマイズの例」を参照してください。
view_mode_i
は、ビューによってサポートされているモードのいずれかです(通常はedit
またはview
)。
この項には次のトピックが含まれます:
次の構成を使用して、すべてのアセット・タイプに対してWebモードで使用可能なツールバー・アクションが決定します。
config.toolbars = { ( …) "web": { "edit": ["form-mode", "inspect", "separator", "save", "preview", "approve", "delete", "separator", "changelayout", "separator", "checkincheckout", "refresh"], "view": ["form-mode", "edit", "separator", "preview", "approve", "delete", "separator", "checkincheckout", "refresh"] ( …) }
前述の構成により、アセットのビュー(「編集」および「調査」)に対応する2つのアクションのリスト(edit
およびview
)が定義されます。
注意:
標準アクションのセットを検索するには、controllers
プロパティの下にある次のプロパティで指定されているアクションのリストを参照してください。
fw.ui.document.AssetDocument
(アセットによってサポートされているすべてのアクション)
fw.ui.controller.InsiteController
(ビュー・コントローラによってサポートされているすべてのアクション)。
各ツールバー構成は、次の名前のプロパティを追加することによって、アセット・タイプおよびサブタイプ別にカスタマイズできます。
viewAlias/assetType
viewAlias/assetType/assetSubtype
たとえば、Webモードでページ・アセットの「ブックマーク」/「ブックマーク解除」ボタンを追加します。
カスタム構成エレメント(CustomElements/avisports/UI/Config/SiteConfigHtml
など)で、次のプロパティを追加します。
config.toolbars["web/Page/AVISection"] = { "edit": config.toolbars.web.edit, // reuse default for edit mode "view": ["form-mode", "edit", "separator", "preview", "approve", "delete", "bookmark", "unbookmark", "separator", "checkincheckout", "refresh"] }
Surfingページ・アセットを調査すると、図72-1に示すツールバーが表示されます。
注意:
次のことに注意してください。
view
モードのみをカスタマイズします。Page/AVISectionアセットがWebモードで編集されている場合、標準ツールバーが表示されます。
「ブックマーク」および「ブックマーク解除」ボタンは、両方ともアセットの現在の状態(すでにブックマークを付けているかどうか)に依存しているため、同時には表示されません。
カスタム・アクションを定義するには、次のように、config.toolbarButtons
プロパティに新しいエントリを追加します。
config.toolbarButtons.<customActionName> = { src: <path_to_icon>, onClick: <click_handler> }
たとえば、次のhelloWorld
カスタム・アクションを定義します。
config.toolbarButtons.helloWorld = { src: 'js/fw/images/ui/ui/toolbarButton/smartlist.png', onClick: function () { alert('Hello World!!'); } }
helloWorld
アクションは、次のように、ツールバー構成から参照できます(前の項の例を再使用します)。
config.toolbars["web/Page/AVISection"] = { "view": ["form-mode", "edit", "separator", "preview", "approve", "bookmark", "unbookmark", "separator", "checkincheckout", "separator", "helloWorld", "refresh"], "edit": config.toolbars.web.edit // reuse default web mode toolbar }
注意:
この例では、図72-2に示すように、セパレータ(垂直線)とカスタム・ボタンをツールバーの末尾に追加しています。
より複雑な例として、アセットのid
およびタイプを出力するCSElement
を作成し、クリックしたときにエレメントをコールするツールバー・オプションを作成する操作があります。例:
メニュー・バーは、特定のタイプまたはタイプ/サブタイプのアセット上で動作するメニューをサポートするようにカスタマイズできます。サブメニューには、アクション可能なアイテム、追加メニューまたはメニュー・セパレータを指定できます。
この項には次のトピックが含まれます:
メニュー・バーの構成は、config.menubar
プロパティによって定義されます。
config.menubar = { "key_i
": [ //menu_i
{ "id": "menu_id
", "label": "menu_label
", "children": [ //submenus
//- actionable menu item { label: 'menu_item_label
', action: 'action_name
' |click_handler
}, //- deferred pop-up menu { label: 'menu_item_label
', deferred: 'controller_element
', cache: true|false }, //- pop-up menu { label: 'menu_item_label
', children: [ // submenu_1 { label: 'menu_item_label
', action: 'action_name
' |click_handler
}' // submenu_2 { label: 'menu_item_label
', action: 'action_name
' |click_handler
}, … … … ] }, //- menu item separator {separator: true} //additional menu_i … … … ] }
ここで:
key_i
は次のいずれかです。
default
: デフォルトのメニュー・バーを定義します。
assetType
: タイプassetType
のすべてのアセットに対するカスタマイズされたメニュー・バーを定義します。
assetType/subtype
: タイプassetType
およびサブタイプsubtype
のすべてのアセットに対するカスタマイズされたメニュー・バーを定義します。
//menu_i
は、各トップ・メニューを示すセクションを開始します。
menu_id
は、メニューの識別子です。
menu_label
は、メニューの表示名です。
submenus
は、次のいずれかとなります。
アクション可能なメニュー・アイテム(メニュー・アイテムをクリックすると、アクションが生成される)。
label
は、メニュー・アイテムの表示名を指定します。
action
には、edit
およびinspect
などの、コントローラによってサポートされるアクションまたはカスタム・クリック・ハンドラを指定できます(「カスタム・アクションのメニュー・バーへの追加」のカスタマイズ例を参照)。
注意:
指定されたアクションが現在のドキュメント/ビューでサポートされていない場合、メニューでは無効になります(グレー表示されます)。
たとえば、save
アクションをトリガーするメニュー・アイテムは、次のように定義されます。
{ label: "Save", action: "save" }
遅延ポップアップ・メニュー(ポップアップ・メニューは、サーバー側でコントローラ・エレメントを実行することによって動的に決定される)。
label
は、メニュー・アイテムの表示名を指定します。
deferred
は、UI/Data/StartMenu/New
など、コントローラのエレメント名を指定します。
cache
は、コントローラ・エレメントの出力がキャッシュされる必要があるかどうかを示すブール値です。
たとえば、現在のサイト/ユーザーのすべての使用可能なスタート・メニュー・アイテムを読み取る「新規」ポップアップ・メニューは、次のように定義されます。
{ label: New, deferred: "UI/Data/StartMenu/New", cache: true }
ポップアップ・メニュー(子メニュー・アイテムが構成自体にハード・ワイヤリングされる)。
メニュー・アイテム・セパレータ(横線、メニュー・エントリをグループ化するために使用する)。
この例では、(カスタムonClickハンドラを実行するため)「カスタム・アクションを使用したツールバーのカスタマイズ」で定義したhelloWorld
カスタム・アクションをメニュー・バーに追加します。このアクションを追加するには、カスタム・アクションをトリガーする、Hello Worldという単一メニュー・アイテムを使用して、カスタム・メニューというメニュー・バーに新しいエントリを追加します。この手順は次のとおりです。
コンテキスト・メニューは右クリックで開き、右クリックされたオブジェクトを操作できるメニューが表示されます。コンテキスト・メニューで使用可能な特定のアイテムおよびオブジェクトが表示される順序は、カスタマイズできます。
コンテキスト・メニューを定義するには、config.contextMenus
プロパティを使用します。
config.contextMenus = { "default": ["action_1", "action_2", … "action_n"] "asset": ["action_1", "action_2", … "action_n"], "asset/assetType": ["action_1", "action_2", … "action_n"], }
値は、次のように定義されます。
default
: コンテキスト・メニューのデフォルトのリストを定義します。リストに表示される各メニュー・アイテムは、action
です。
asset
: すべてのアセットのコンテキスト・メニューのカスタマイズされたリストを定義します。リストに表示される各メニュー・アイテムは、action
です。
asset/assetType
: タイプassetType
のアセットのコンテキスト・メニュー・アイテムのカスタマイズされたリストを定義します。リストに表示される各メニュー・アイテムは、action
です。
アセット・タイプPageのコンテキスト・メニュー構成の例は次のとおりです。
"asset/Page":["edit", "copy", "preview", "delete", "bookmark", "tagasset"]