This is an automated email from the ASF dual-hosted git repository.
sarath pushed a commit to branch branch-2.0
in repository https://gitbox.apache.org/repos/asf/atlas.git
The following commit(s) were added to refs/heads/branch-2.0 by this push:
new f84093b ATLAS-3146 UI : Toggle N/A values in relationship and
property tables.
f84093b is described below
commit f84093b879177af27a78119faf8870f336459ec1
Author: gutkaBinit <binitgu...@gmail.com>
AuthorDate: Thu Apr 18 11:11:11 2019 +0530
ATLAS-3146 UI : Toggle N/A values in relationship and property tables.
Signed-off-by: kevalbhatt <kbh...@apache.org>
(cherry picked from commit 24c9556c969eaa294e5c8537d98227c6bd6978e0)
---
dashboardv2/public/css/scss/relationship.scss | 1 +
dashboardv2/public/css/scss/table.scss | 26 +++++++++++++++++++
.../entity/EntityDetailTableLayoutView_tmpl.html | 30 ++++++++++++++--------
.../graph/RelationshipLayoutView_tmpl.html | 10 +++++++-
dashboardv2/public/js/utils/CommonViewFunction.js | 6 +++--
dashboardv2/public/js/utils/Utils.js | 10 ++++++++
.../js/views/entity/EntityDetailTableLayoutView.js | 16 ++++++++++--
.../js/views/graph/RelationshipLayoutView.js | 13 +++++++++-
8 files changed, 96 insertions(+), 16 deletions(-)
diff --git a/dashboardv2/public/css/scss/relationship.scss
b/dashboardv2/public/css/scss/relationship.scss
index a51f83c..7226bbd 100644
--- a/dashboardv2/public/css/scss/relationship.scss
+++ b/dashboardv2/public/css/scss/relationship.scss
@@ -22,6 +22,7 @@
height: 100%;
width: 100%;
overflow: hidden;
+ z-index: 1;
.relatioship-link {
fill: none;
diff --git a/dashboardv2/public/css/scss/table.scss
b/dashboardv2/public/css/scss/table.scss
index e3e4717..497ea2a 100644
--- a/dashboardv2/public/css/scss/table.scss
+++ b/dashboardv2/public/css/scss/table.scss
@@ -41,4 +41,30 @@ tr.empty {
.table-action-btn {
position: absolute;
right: 0px;
+}
+
+.entity-detail-table,
+.relationship-detail-table {
+ position: relative;
+
+ .hide-empty-value {
+ .hide-row {
+ display: none;
+ }
+ }
+
+ .entity-relationship-table-toggle,
+ .entity-detail-table-toggle {
+ position: absolute;
+ right: 0;
+ top: 18px;
+ }
+
+ table {
+
+ th:nth-child(1),
+ td:nth-child(1) {
+ width: 20%;
+ }
+ }
}
\ No newline at end of file
diff --git
a/dashboardv2/public/js/templates/entity/EntityDetailTableLayoutView_tmpl.html
b/dashboardv2/public/js/templates/entity/EntityDetailTableLayoutView_tmpl.html
index cf89287..1c01077 100644
---
a/dashboardv2/public/js/templates/entity/EntityDetailTableLayoutView_tmpl.html
+++
b/dashboardv2/public/js/templates/entity/EntityDetailTableLayoutView_tmpl.html
@@ -14,13 +14,23 @@
* See the License for the specific language governing permissions and
* limitations under the License.
-->
-<table class="table table-quickMenu">
- <thead>
- <tr>
- <th>Key</th>
- <th>Value</th>
- </tr>
- </thead>
- <tbody data-id="detailValue">
- </tbody>
-</table>
+<div class="entity-detail-table">
+ <div class="entity-detail-table-toggle">
+ <div class="pretty p-switch p-fill">
+ <input type="checkbox" data-id="noValueToggle" />
+ <div class="state p-primary">
+ <label>Show Empty Values</label>
+ </div>
+ </div>
+ </div>
+ <table class="table table-quickMenu">
+ <thead>
+ <tr>
+ <th>Key</th>
+ <th>Value</th>
+ </tr>
+ </thead>
+ <tbody data-id="detailValue" class="hide-empty-value">
+ </tbody>
+ </table>
+</div>
\ No newline at end of file
diff --git
a/dashboardv2/public/js/templates/graph/RelationshipLayoutView_tmpl.html
b/dashboardv2/public/js/templates/graph/RelationshipLayoutView_tmpl.html
index 344c1fc..28e5a24 100644
--- a/dashboardv2/public/js/templates/graph/RelationshipLayoutView_tmpl.html
+++ b/dashboardv2/public/js/templates/graph/RelationshipLayoutView_tmpl.html
@@ -46,7 +46,15 @@
</div>
</div>
</div>
-<div>
+<div class="relationship-detail-table">
+ <div class="entity-relationship-table-toggle">
+ <div class="pretty p-switch p-fill">
+ <input type="checkbox" data-id="noValueToggle" />
+ <div class="state p-primary">
+ <label>Show Empty Values</label>
+ </div>
+ </div>
+ </div>
<table class="table table-quickMenu" data-id="relationshipDetailTable">
<thead>
<tr>
diff --git a/dashboardv2/public/js/utils/CommonViewFunction.js
b/dashboardv2/public/js/utils/CommonViewFunction.js
index 5088b4a..90bf114 100644
--- a/dashboardv2/public/js/utils/CommonViewFunction.js
+++ b/dashboardv2/public/js/utils/CommonViewFunction.js
@@ -254,7 +254,9 @@ define(['require', 'utils/Utils', 'modules/Modal',
'utils/Messages', 'utils/Enum
val = _.escape(keyValue);
}
if (isTable) {
- var htmlTag = '<div class="scroll-y">' + getValue(val) +
'</div>';
+ var value = getValue(val),
+ appendClass = (value == "N/A" ? "hide-row" : ""),
+ htmlTag = '<div class="scroll-y">' + value + '</div>';
if (_.isObject(valueObject[key]) &&
!_.isEmpty(valueObject[key])) {
var matchedLinkString = val.match(/href|value-loader\w*/g),
matchedJson = val.match(/json-value|json-string\w*/g),
@@ -266,7 +268,7 @@ define(['require', 'utils/Utils', 'modules/Modal',
'utils/Messages', 'utils/Enum
htmlTag = '<pre class="shrink code-block ' +
(isMatchJSONStringIsSingle ? 'fixed-height' : '') + '">' + expandCollapseButton
+ '<code>' + val + '</code></pre>';
}
}
- table += '<tr><td>' + (_.escape(key) + listCount) +
'</td><td>' + htmlTag + '</td></tr>';
+ table += '<tr class="' + appendClass + '"><td>' +
(_.escape(key) + listCount) + '</td><td>' + htmlTag + '</td></tr>';
} else {
table += '<div>' + val + '</div>';
}
diff --git a/dashboardv2/public/js/utils/Utils.js
b/dashboardv2/public/js/utils/Utils.js
index 8f33c2e..af593db 100644
--- a/dashboardv2/public/js/utils/Utils.js
+++ b/dashboardv2/public/js/utils/Utils.js
@@ -828,5 +828,15 @@ define(['require', 'utils/Globals', 'pnotify',
'utils/Messages', 'utils/Enums',
return hours + ":" + minutes + ":" + seconds + "." + milliseconds;
}
+ Utils.togglePropertyRelationshipTableEmptyValues = function(object) {
+ var inputSelector = object.inputType,
+ tableEl = object.tableEl;
+ if (inputSelector.prop('checked') == true) {
+ tableEl.removeClass('hide-empty-value');
+ } else {
+ tableEl.addClass('hide-empty-value');
+ }
+
+ }
return Utils;
});
\ No newline at end of file
diff --git a/dashboardv2/public/js/views/entity/EntityDetailTableLayoutView.js
b/dashboardv2/public/js/views/entity/EntityDetailTableLayoutView.js
index 28eb749..1c8ff9b 100644
--- a/dashboardv2/public/js/views/entity/EntityDetailTableLayoutView.js
+++ b/dashboardv2/public/js/views/entity/EntityDetailTableLayoutView.js
@@ -20,8 +20,9 @@ define(['require',
'backbone',
'hbs!tmpl/entity/EntityDetailTableLayoutView_tmpl',
'utils/CommonViewFunction',
- 'models/VEntity'
-], function(require, Backbone, EntityDetailTableLayoutView_tmpl,
CommonViewFunction, VEntity) {
+ 'models/VEntity',
+ 'utils/Utils'
+], function(require, Backbone, EntityDetailTableLayoutView_tmpl,
CommonViewFunction, VEntity, Utils) {
'use strict';
var EntityDetailTableLayoutView = Backbone.Marionette.LayoutView.extend(
@@ -37,10 +38,17 @@ define(['require',
/** ui selector cache */
ui: {
detailValue: "[data-id='detailValue']",
+ noValueToggle: "[data-id='noValueToggle']"
},
/** ui events hash */
events: function() {
var events = {};
+ events["click " + this.ui.noValueToggle] = function() {
+ Utils.togglePropertyRelationshipTableEmptyValues({
+ "inputType": this.ui.noValueToggle,
+ "tableEl": this.ui.detailValue
+ });
+ };
return events;
},
/**
@@ -58,6 +66,10 @@ define(['require',
entityTableGenerate: function() {
var table = CommonViewFunction.propertyTable({ scope: this,
valueObject: this.entity.attributes, attributeDefs: this.attributeDefs });
this.ui.detailValue.append(table);
+ Utils.togglePropertyRelationshipTableEmptyValues({
+ "inputType": this.ui.noValueToggle,
+ "tableEl": this.ui.detailValue
+ });
}
});
return EntityDetailTableLayoutView;
diff --git a/dashboardv2/public/js/views/graph/RelationshipLayoutView.js
b/dashboardv2/public/js/views/graph/RelationshipLayoutView.js
index a98b61d..cd2abe5 100644
--- a/dashboardv2/public/js/views/graph/RelationshipLayoutView.js
+++ b/dashboardv2/public/js/views/graph/RelationshipLayoutView.js
@@ -49,7 +49,8 @@ define(['require',
relationshipSVG: "[data-id='relationshipSVG']",
relationshipDetailValue: "[data-id='relationshipDetailValue']",
zoomControl: "[data-id='zoomControl']",
- boxClose: '[data-id="box-close"]'
+ boxClose: '[data-id="box-close"]',
+ noValueToggle: "[data-id='noValueToggle']"
},
/** ui events hash */
@@ -63,6 +64,12 @@ define(['require',
events["change " + this.ui.relationshipViewToggle] =
function(e) {
this.relationshipViewToggle(e.currentTarget.checked)
};
+ events["click " + this.ui.noValueToggle] = function(e) {
+ Utils.togglePropertyRelationshipTableEmptyValues({
+ "inputType": this.ui.noValueToggle,
+ "tableEl": this.ui.relationshipDetailValue
+ });
+ };
return events;
},
@@ -463,6 +470,10 @@ define(['require',
this.entityModel = new VEntity({});
var table = CommonViewFunction.propertyTable({ scope: this,
valueObject: this.entity.relationshipAttributes, attributeDefs:
this.attributeDefs });
this.ui.relationshipDetailValue.html(table);
+ Utils.togglePropertyRelationshipTableEmptyValues({
+ "inputType": this.ui.noValueToggle,
+ "tableEl": this.ui.relationshipDetailValue
+ });
},
relationshipViewToggle: function(checked) {
this.ui.relationshipDetailTable.toggleClass('visible
invisible');
