Skip to content

A
atlas
Commit 4952a560 by kevalbhatt Committed by Sarath Subramanian
Options

ATLAS-3453: UI: show shell icon in entity detail page if status is incomplete

Signed-off-by: 's avatarSarath Subramanian <sarath@apache.org>
parent 503a572d
Showing with 64 additions and 6 deletions
dashboardv2/public/css/scss/theme.scss
......@@ -510,4 +510,29 @@ hr[size="10"] {
color: inherit !important;
}
}
}
.entityDetail {
.isIncomplete {
&.show {
img {
opacity: .2;
animation: blink 2.5s infinite;
}
i.fa.fa-refresh {
display: block;
}
}
i.fa.fa-refresh {
display: none;
text-align: center;
font-size: 20px;
top: 0;
position: absolute;
z-index: 999;
left: calc(50% - 8px);
}
}
}
\ No newline at end of file
dashboardv2/public/js/templates/detail_page/DetailPageLayoutView_tmpl.html
......@@ -19,8 +19,8 @@
<i class="fa fa-refresh fa-spin-custom"></i>
</div>
<div class="entityDetail form-horizontal col-sm-12">
<h1 class="title row">
<div data-id="entityIcon" class="entity-icon-box"></div>
<h1 class="title row isIncomplete">
<div data-id="entityIcon" class="entity-icon-box position-relative"></div>
<span data-id="title"></span>
</h1> {{#if entityUpdate}}
<div data-id="editButtonContainer" class="pull-right"></div>
......
dashboardv2/public/js/views/detail_page/DetailPageLayoutView.js
......@@ -193,7 +193,10 @@ define(['require',
} else {
this.ui.entityIcon.removeClass('disabled');
}
this.ui.entityIcon.attr('title', _.escape(collectionJSON.typeName)).html('<img src="' + Utils.getEntityIconPath({ entityData: entityData }) + '"/>').find("img").on('error', function() {
if (collectionJSON.isIncomplete === true) {
this.$(".isIncomplete").addClass("show");
}
this.ui.entityIcon.attr('title', _.escape(collectionJSON.typeName)).html('<img src="' + Utils.getEntityIconPath({ entityData: entityData }) + '"/><i class="fa fa-refresh fa-spin-custom"></i>').find("img").on('error', function() {
this.src = Utils.getEntityIconPath({ entityData: entityData, errorUrl: this.src });
});
} else {
......
dashboardv3/public/css/scss/theme.scss
......@@ -690,4 +690,29 @@ hr[size="10"] {
.tooltip.bottom .tooltip-arrow {
border-bottom-color: #000;
}
.entityDetail {
.isIncomplete {
&.show {
img {
opacity: .2;
animation: blink 2.5s infinite;
}
i.fa.fa-refresh {
display: block;
}
}
i.fa.fa-refresh {
display: none;
text-align: center;
font-size: 20px;
top: 0;
position: absolute;
z-index: 1;
left: calc(50% - 8px);
}
}
}
\ No newline at end of file
dashboardv3/public/js/templates/detail_page/DetailPageLayoutView_tmpl.html
......@@ -22,8 +22,8 @@
<i class="fa fa-refresh fa-spin-custom"></i>
</div>
<div class="entityDetail form-horizontal col-sm-12">
<h1 class="title">
<div data-id="entityIcon" class="entity-icon-box"></div>
<h1 class="title isIncomplete">
<div data-id="entityIcon" class="entity-icon-box position-relative"></div>
<span data-id="title"></span>
</h1> {{#if entityUpdate}}
<div data-id="editButtonContainer" class="pull-right"></div>
......
dashboardv3/public/js/views/detail_page/DetailPageLayoutView.js
......@@ -198,7 +198,10 @@ define(['require',
} else {
this.ui.entityIcon.removeClass('disabled');
}
this.ui.entityIcon.attr('title', _.escape(collectionJSON.typeName)).html('<img src="' + Utils.getEntityIconPath({ entityData: entityData }) + '"/>').find("img").on('error', function() {
if (collectionJSON.isIncomplete === true) {
this.$(".isIncomplete").addClass("show");
}
this.ui.entityIcon.attr('title', _.escape(collectionJSON.typeName)).html('<img src="' + Utils.getEntityIconPath({ entityData: entityData }) + '"/><i class="fa fa-refresh fa-spin-custom"></i>').find("img").on('error', function() {
this.src = Utils.getEntityIconPath({ entityData: entityData, errorUrl: this.src });
});
} else {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment