You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@atlas.apache.org by sa...@apache.org on 2019/10/03 18:45:18 UTC
[atlas] branch branch-2.0 updated: ATLAS-3436: UI: Show Incomplete
entity status in the Lineage graph
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 181d46c ATLAS-3436: UI: Show Incomplete entity status in the Lineage graph
181d46c is described below
commit 181d46c7519367125bdd62fe1371182d3dcfbd00
Author: kevalbhatt <kb...@apache.org>
AuthorDate: Thu Oct 3 18:33:28 2019 +0530
ATLAS-3436: UI: Show Incomplete entity status in the Lineage graph
Signed-off-by: Sarath Subramanian <sa...@apache.org>
(cherry picked from commit b0ab2ffeb43a3e3c4aa66bf8fecd6ee836e6d359)
---
dashboardv2/public/css/scss/graph.scss | 37 ++++++++++++++++++++++
.../js/templates/graph/LineageLayoutView_tmpl.html | 1 +
.../public/js/views/graph/LineageLayoutView.js | 16 ++++++++++
dashboardv3/public/css/scss/graph.scss | 37 ++++++++++++++++++++++
.../js/templates/graph/LineageLayoutView_tmpl.html | 1 +
.../public/js/views/graph/LineageLayoutView.js | 16 ++++++++++
6 files changed, 108 insertions(+)
diff --git a/dashboardv2/public/css/scss/graph.scss b/dashboardv2/public/css/scss/graph.scss
index ab0d9c8..683fdd1 100644
--- a/dashboardv2/public/css/scss/graph.scss
+++ b/dashboardv2/public/css/scss/graph.scss
@@ -448,4 +448,41 @@ span#zoom_in {
list-style-position: inside;
}
+}
+
+.isIncomplete {
+
+ foreignObject {
+ display: none;
+ }
+
+ &.show {
+ image {
+ opacity: 0.2;
+ animation: blink 2.5s infinite;
+ }
+
+ foreignObject {
+ display: block;
+ }
+ }
+
+ i.fa-refresh {
+
+ text-align: center;
+ margin-top: 33%;
+ font-size: 15px;
+ }
+
+}
+
+
+@-webkit-keyframes blink {
+ from {
+ opacity: 0.2;
+ }
+
+ to {
+ opacity: 0.5;
+ }
}
\ No newline at end of file
diff --git a/dashboardv2/public/js/templates/graph/LineageLayoutView_tmpl.html b/dashboardv2/public/js/templates/graph/LineageLayoutView_tmpl.html
index 8679c3b..dd45cc8 100644
--- a/dashboardv2/public/js/templates/graph/LineageLayoutView_tmpl.html
+++ b/dashboardv2/public/js/templates/graph/LineageLayoutView_tmpl.html
@@ -139,6 +139,7 @@
</div>
<div class="legends pull-left" style="height: 25px; padding: 2px;">
<span style="margin-right: 8px; color:#fb4200;"><i class="fa fa-circle-o fa-fw"></i>Current Entity</span>
+ <span style="margin-right: 8px;"><i class="fa fa-refresh fa-fw"></i>In Progress</span>
<span style="margin-right: 8px; color:#df9b00;"><i class="fa fa-long-arrow-right fa-fw"></i>Lineage</span>
<span style="margin-right: 8px; color:#fb4200;"><i class="fa fa-long-arrow-right fa-fw"></i>Impact</span>
</div>
diff --git a/dashboardv2/public/js/views/graph/LineageLayoutView.js b/dashboardv2/public/js/views/graph/LineageLayoutView.js
index bcf0428..e7b5a27 100644
--- a/dashboardv2/public/js/views/graph/LineageLayoutView.js
+++ b/dashboardv2/public/js/views/graph/LineageLayoutView.js
@@ -329,6 +329,7 @@ define(['require',
toolTipLabel: relationObj.displayText,
id: relationObj.guid,
isLineage: true,
+ isIncomplete: relationObj.isIncomplete,
entityDef: this.getEntityDef(relationObj.typeName)
}, relationObj);
obj["serviceType"] = this.getServiceType({ typeName: relationObj.typeName, entityDef: obj.entityDef });
@@ -559,6 +560,12 @@ define(['require',
if (currentNode) {
shapeSvg.attr("stroke", "#fb4200")
}
+ if (node.isIncomplete === true) {
+ parent.attr("class", "isIncomplete show");
+ } else {
+ parent.attr("class", "isIncomplete");
+ }
+
parent.insert("defs")
.append("pattern")
.attr("x", "0%")
@@ -625,6 +632,15 @@ define(['require',
.attr("y", currentNode ? "3" : "4").attr("width", "40")
.attr("height", "40");
+ parent.insert("foreignObject")
+ .attr("x", "-25")
+ .attr("y", "-25")
+ .attr("width", "50")
+ .attr("height", "50")
+ .append("xhtml:div")
+ .insert("i")
+ .attr("class", "fa fa-refresh fa-spin-custom");
+
node.intersect = function(point) {
return dagreD3.intersect.circle(node, currentNode ? 24 : 21, point);
};
diff --git a/dashboardv3/public/css/scss/graph.scss b/dashboardv3/public/css/scss/graph.scss
index bcb506f..5d3c308 100644
--- a/dashboardv3/public/css/scss/graph.scss
+++ b/dashboardv3/public/css/scss/graph.scss
@@ -441,4 +441,41 @@ span#zoom_in {
list-style-position: inside;
}
+}
+
+.isIncomplete {
+
+ foreignObject {
+ display: none;
+ }
+
+ &.show {
+ image {
+ opacity: 0.2;
+ animation: blink 2.5s infinite;
+ }
+
+ foreignObject {
+ display: block;
+ }
+ }
+
+ i.fa-refresh {
+
+ text-align: center;
+ margin-top: 33%;
+ font-size: 15px;
+ }
+
+}
+
+
+@-webkit-keyframes blink {
+ from {
+ opacity: 0.2;
+ }
+
+ to {
+ opacity: 0.5;
+ }
}
\ No newline at end of file
diff --git a/dashboardv3/public/js/templates/graph/LineageLayoutView_tmpl.html b/dashboardv3/public/js/templates/graph/LineageLayoutView_tmpl.html
index 8679c3b..dd45cc8 100644
--- a/dashboardv3/public/js/templates/graph/LineageLayoutView_tmpl.html
+++ b/dashboardv3/public/js/templates/graph/LineageLayoutView_tmpl.html
@@ -139,6 +139,7 @@
</div>
<div class="legends pull-left" style="height: 25px; padding: 2px;">
<span style="margin-right: 8px; color:#fb4200;"><i class="fa fa-circle-o fa-fw"></i>Current Entity</span>
+ <span style="margin-right: 8px;"><i class="fa fa-refresh fa-fw"></i>In Progress</span>
<span style="margin-right: 8px; color:#df9b00;"><i class="fa fa-long-arrow-right fa-fw"></i>Lineage</span>
<span style="margin-right: 8px; color:#fb4200;"><i class="fa fa-long-arrow-right fa-fw"></i>Impact</span>
</div>
diff --git a/dashboardv3/public/js/views/graph/LineageLayoutView.js b/dashboardv3/public/js/views/graph/LineageLayoutView.js
index b2e2701..8dfdfc5 100644
--- a/dashboardv3/public/js/views/graph/LineageLayoutView.js
+++ b/dashboardv3/public/js/views/graph/LineageLayoutView.js
@@ -344,6 +344,7 @@ define(['require',
toolTipLabel: relationObj.displayText,
id: relationObj.guid,
isLineage: true,
+ isIncomplete: relationObj.isIncomplete,
entityDef: this.getEntityDef(relationObj.typeName)
}, relationObj);
obj["serviceType"] = this.getServiceType({ typeName: relationObj.typeName, entityDef: obj.entityDef });
@@ -574,6 +575,12 @@ define(['require',
if (currentNode) {
shapeSvg.attr("stroke", "#fb4200")
}
+ if (node.isIncomplete === true) {
+ parent.attr("class", "isIncomplete show");
+ } else {
+ parent.attr("class", "isIncomplete");
+ }
+
parent.insert("defs")
.append("pattern")
.attr("x", "0%")
@@ -640,6 +647,15 @@ define(['require',
.attr("y", currentNode ? "3" : "4").attr("width", "40")
.attr("height", "40");
+ parent.insert("foreignObject")
+ .attr("x", "-25")
+ .attr("y", "-25")
+ .attr("width", "50")
+ .attr("height", "50")
+ .append("xhtml:div")
+ .insert("i")
+ .attr("class", "fa fa-refresh fa-spin-custom");
+
node.intersect = function(point) {
return dagreD3.intersect.circle(node, currentNode ? 24 : 21, point);
};