コンテキストメニューのカスタマイズ
次のコンテキストメニューをカスタマイズできます。
-
file_options
コントローラ:- マップ ビュー:
ditamap_viewer_controller
- リポジトリーパネル:
repository_panel_controller
- お気に入りパネル:
collection_tree_controller
- ファイルプロパティ参照リンク:
file_references_links_controller
- リポジトリ検索パネル:
repository_search_controller
- 件名の設定パネル:
subject_scheme_tree_controller
- マップ ビュー:
-
folder_options
コントローラ:- リポジトリーパネル:
repository_panel_controller
- お気に入りパネル:
collection_tree_controller
- リポジトリーパネル:
-
collection_options
コントローラ:- お気に入りパネル:
collection_tree_controller
- お気に入りパネル:
-
map_view_options
コントローラ:- マップ ビュー:
ditamap_viewer_controller
- マップ ビュー:
-
baseline_panel_menu
コントローラ:- ベースラインパネル:
baseline_panel
- ベースラインパネル:
-
preset_item_menu
コントローラ:- プリセットパネル:
preset_panel
- プリセットパネル:
新しい一意の ID を定義することで、独自のコンテキストメニューを作成することもできます。
各コンテキストメニューには、 controller id
関連付けられています。 このコントローラーは on-event
各種コンテキストメニューオプションの機能
を理解するための例を見てみましょう。
const fileOptions = {
id: "file_options",
contextMenuWidget: "repository_panel",
view: {
items: [
{
component: "div",
target: {
key:"displayName",value: "Delete",
viewState: VIEW_STATE.REPLACE
}
},
{
component: "div",
target: {
key:"displayName",value: "Edit",
viewState: VIEW_STATE.REPLACE
}
},
{
"displayName": "Download",
"data": {
"eventid": "downloadFile"
},
"icon": "downloadFromCloud",
"class": "menu-separator",
target: {
key:"displayName",value: "Duplicate",
viewState: VIEW_STATE.REPLACE
}
},
]
},
controller: {
downloadFile(){
const path = this.getValue('selectedItems')[0].path
this.loader.loadDitaFile(path).then((file) => {
function download_file(name, contents) {
const mime_type = "text/plain";
const blob = new Blob([contents], {type: mime_type});
const dlink = document.createElement('a');
dlink.download = name;
dlink.href = window.URL.createObjectURL(blob);
dlink.onclick = function() {
// revokeObjectURL needs a delay to work properly
const that = this;
setTimeout(function() {
window.URL.revokeObjectURL(that.href);
}, 1500);
};
dlink.click();
dlink.remove();
}
download_file(path,file.xml)
});
}
}
}
次に、このコードの動作を説明します。
id
は、カスタマイズするコンテキストメニューを識別するために使用されます。contextMenuWidget
を使用して、widget id
またはcomponent
コンテキストメニューを呼び出し、events
.
残りの部分は同じままで、次のような結果になります view
を使用して、項目を定義します。 target
オプションと先頭をどこで置換、追加、または追加するかを指定します。 contextMenuWidget
コントローラは、 on-click
イベント。
recommendation-more-help
11125c99-e1a1-4369-b5d7-fb3098b9b178