diff --git a/vndk/tools/definition-tool/assets/insight/insight.css b/vndk/tools/definition-tool/assets/insight/insight.css index 1c5f709e2..538a49fb1 100644 --- a/vndk/tools/definition-tool/assets/insight/insight.css +++ b/vndk/tools/definition-tool/assets/insight/insight.css @@ -70,6 +70,7 @@ a:active { #module_table { border-collapse: collapse; + width: 100%; } #module_tbody td, @@ -107,3 +108,9 @@ a:active { font-size: 80%; color: #aaaaaa; } + +#no_module_placeholder { + font-style: italic; + font-family: sans-serif; + text-align: center; +} diff --git a/vndk/tools/definition-tool/assets/insight/insight.js b/vndk/tools/definition-tool/assets/insight/insight.js index cd199a8d0..1027d979e 100644 --- a/vndk/tools/definition-tool/assets/insight/insight.js +++ b/vndk/tools/definition-tool/assets/insight/insight.js @@ -13,6 +13,8 @@ let strsData, mods, tagIds; let domPathInput, domFuzzyMatch; let domTBody; + let domPlaceholder = null; + let placeholderVisible = false; //-------------------------------------------------------------------------- // DOM Helper Functions @@ -160,9 +162,13 @@ } Module.prototype.showDom = function () { + hidePlaceholder(); if (this.visible) { return; } + if (this.dom === null) { + this.createDom(); + } domTBody.appendChild(this.dom); this.visible = true; } @@ -317,8 +323,8 @@ domTBody.id = 'module_tbody'; createTableHeaderDom(domTBody); - createAllModulesDom(); - showAllModules(); + + showPlaceholder(); let domTable = domNewElem('table', domTBody); domTable.id = 'module_table'; @@ -342,9 +348,31 @@ parent.appendChild(domTr); } - function createAllModulesDom() { - for (let mod of mods) { - mod.createDom(); + function createPlaceholder() { + let domTd = domNewElem('td'); + domTd.setAttribute('colspan', 4); + domTd.setAttribute('id', 'no_module_placeholder'); + domTd.appendChild(domNewText( + 'No modules are selected. Click the menu to select modules by ' + + 'names or categories.')); + domPlaceholder = domNewElem('tr', domTd); + } + + function showPlaceholder() { + if (placeholderVisible) { + return; + } + placeholderVisible = true; + if (domPlaceholder === null) { + createPlaceholder(); + } + domTBody.appendChild(domPlaceholder); + } + + function hidePlaceholder() { + if (placeholderVisible) { + domTBody.removeChild(domPlaceholder); + placeholderVisible = false; } } @@ -352,6 +380,7 @@ for (let mod of mods) { mod.hideDom(); } + showPlaceholder(); } function showAllModules() {