Skip to content

A
atlas
Commit 60b7d2ac by kevalbhatt
Options

ATLAS-3156 : UI:No loading animation while creating or deleting a…

ATLAS-3156 : UI:No loading animation while creating or deleting a Classification, Create Entity, View loading
parent 5c9cb781
Showing with 377 additions and 92 deletions
dashboardv2/public/css/scss/common.scss
...@@ -272,4 +272,38 @@ pre { ...@@ -272,4 +272,38 @@ pre {
margin-bottom: 5px; margin-bottom: 5px;
margin-left: 5px; margin-left: 5px;
float: left; float: left;
}
.button-loader:after {
content: "\f021";
position: absolute;
left: -6px;
bottom: 4px;
font-family: FontAwesome;
background: transparent;
height: 34px;
width: 38px;
line-height: 34px;
text-align: center;
animation: spin 1000ms infinite linear;
}
@-webkit-keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(359deg);
}
}
@keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(359deg);
}
} }
\ No newline at end of file
dashboardv2/public/js/templates/glossary/GlossaryLayoutView_tmpl.html
...@@ -42,18 +42,23 @@ ...@@ -42,18 +42,23 @@
</div> </div>
<div class="row"> <div class="row">
<div class="col-sm-12"> <div class="col-sm-12">
<div class="no-padding col-sm-12 term-view"> <div class="col-sm-12 text-center" data-id='glossaryTreeLoader'>
<div> <i class="fa fa-refresh fa-spin-custom"></i>
<input type="text" class="form-control" data-id="searchTerm" placeholder="{{#if isAssignView}}Search Term{{else}}Search Glossary, Term{{/if}}">
</div>
<div data-id="termTree" style="margin-top: 5px;padding-bottom: 25px;overflow-x: auto;overflow-y:hidden;">
</div>
</div> </div>
<div class="col-sm-12 no-padding category-view" style="display: none;"> <div data-id='glossaryTreeView'>
<div> <div class="no-padding col-sm-12 term-view">
<input type="text" class="form-control" data-id="searchCategory" placeholder="{{#if isAssignView}}Search Catalog{{else}}Search Glossary, Category{{/if}}"> <div>
<input type="text" class="form-control" data-id="searchTerm" placeholder="{{#if isAssignView}}Search Term{{else}}Search Glossary, Term{{/if}}">
</div>
<div data-id="termTree" style="margin-top: 5px;padding-bottom: 25px;overflow-x: auto;overflow-y:hidden;">
</div>
</div> </div>
<div data-id="categoryTree" style="margin-top: 5px;padding-bottom: 25px;overflow-x: auto;overflow-y: hidden;"> <div class="col-sm-12 no-padding category-view" style="display: none;">
<div>
<input type="text" class="form-control" data-id="searchCategory" placeholder="{{#if isAssignView}}Search Catalog{{else}}Search Glossary, Category{{/if}}">
</div>
<div data-id="categoryTree" style="margin-top: 5px;padding-bottom: 25px;overflow-x: auto;overflow-y: hidden;">
</div>
</div> </div>
</div> </div>
</div> </div>
......
dashboardv2/public/js/templates/tag/TagLayoutView_tmpl.html
...@@ -30,20 +30,22 @@ ...@@ -30,20 +30,22 @@
</div> </div>
</div> </div>
</div> </div>
<!-- <div class="clearfix add-seperator">
<button type="button" class="btn btn-action btn-md pull-left" data-id="createTag" type="button"><i class="fa fa-plus"></i> Create Tag</button>
</div> -->
<div class="row"> <div class="row">
<div class="list-view col-sm-12"> <div class="col-sm-12 text-center" data-id="tagTreeLoader">
<input type="text" class="form-control" data-id="offlineSearchTag" placeholder="Search Classification"> <i class="fa fa-refresh fa-spin-custom"></i>
<ul class="tag-tree" data-id="tagsList">
</ul>
</div> </div>
<div class="tree-view col-sm-12" style="display: none;"> <div data-id="tagTreeView">
<div class="treeLov"> <div class="list-view col-sm-12">
<select class="form-control" data-id="treeLov"></select> <input type="text" class="form-control" data-id="offlineSearchTag" placeholder="Search Classification">
<ul class="tag-tree" data-id="tagsList">
</ul>
</div>
<div class="tree-view col-sm-12" style="display: none;">
<div class="treeLov">
<select class="form-control" data-id="treeLov"></select>
</div>
<ul class="tag-tree" data-id="tagsParent">
</ul>
</div> </div>
<ul class="tag-tree" data-id="tagsParent">
</ul>
</div> </div>
</div> </div>
\ No newline at end of file
dashboardv2/public/js/utils/CommonViewFunction.js
...@@ -696,7 +696,7 @@ define(['require', 'utils/Utils', 'modules/Modal', 'utils/Messages', 'utils/Enum ...@@ -696,7 +696,7 @@ define(['require', 'utils/Utils', 'modules/Modal', 'utils/Messages', 'utils/Enum
} }
}); });
modal.on('ok', function() { modal.on('ok', function() {
modal.$el.find('button.ok').attr("disabled", true); modal.$el.find('button.ok').showButtonLoader();
CommonViewFunction.createEditGlossaryCategoryTermSubmit(_.extend({ "ref": view, "modal": modal }, options)); CommonViewFunction.createEditGlossaryCategoryTermSubmit(_.extend({ "ref": view, "modal": modal }, options));
}); });
modal.on('closeModal', function() { modal.on('closeModal', function() {
...@@ -742,7 +742,7 @@ define(['require', 'utils/Utils', 'modules/Modal', 'utils/Messages', 'utils/Enum ...@@ -742,7 +742,7 @@ define(['require', 'utils/Utils', 'modules/Modal', 'utils/Messages', 'utils/Enum
modal.trigger('closeModal'); modal.trigger('closeModal');
}, },
cust_error: function() { cust_error: function() {
modal.$el.find('button.ok').attr("disabled", false); modal.$el.find('button.ok').hideButtonLoader();
} }
} }
if (model) { if (model) {
......
dashboardv2/public/js/utils/Utils.js
...@@ -870,7 +870,12 @@ define(['require', 'utils/Globals', 'pnotify', 'utils/Messages', 'utils/Enums', ...@@ -870,7 +870,12 @@ define(['require', 'utils/Globals', 'pnotify', 'utils/Messages', 'utils/Enums',
} else { } else {
tableEl.addClass('hide-empty-value'); tableEl.addClass('hide-empty-value');
} }
}
$.fn.showButtonLoader = function() {
$(this).css({ "position": "relative" }).attr("disabled", "true").addClass('button-loader');
}
$.fn.hideButtonLoader = function() {
$(this).removeClass('button-loader').removeAttr("disabled");
} }
return Utils; return Utils;
}); });
\ No newline at end of file
dashboardv2/public/js/views/entity/CreateEntityLayoutView.js
...@@ -103,7 +103,8 @@ define(['require', ...@@ -103,7 +103,8 @@ define(['require',
}).open(); }).open();
this.modal.$el.find('button.ok').attr("disabled", true); this.modal.$el.find('button.ok').attr("disabled", true);
this.modal.on('ok', function(e) { this.modal.on('ok', function(e) {
that.modal.$el.find('button.ok, button.cancel').attr("disabled", true); that.modal.$el.find('button.cancel').attr("disabled", true);
that.modal.$el.find('button.ok').showButtonLoader();
that.okButton(); that.okButton();
}); });
this.modal.on('closeModal', function() { this.modal.on('closeModal', function() {
...@@ -688,6 +689,7 @@ define(['require', ...@@ -688,6 +689,7 @@ define(['require',
$(this).addClass('errorClass'); $(this).addClass('errorClass');
} }
that.hideLoader(); that.hideLoader();
that.modal.$el.find('button.ok').hideButtonLoader();
throw new Error("Please fill the required fields"); throw new Error("Please fill the required fields");
return; return;
} }
...@@ -763,6 +765,7 @@ define(['require', ...@@ -763,6 +765,7 @@ define(['require',
data: JSON.stringify(entityJson), data: JSON.stringify(entityJson),
type: "POST", type: "POST",
success: function(model, response) { success: function(model, response) {
that.modal.$el.find('button.ok').hideButtonLoader();
that.modal.close(); that.modal.close();
var msgType = that.guid ? 'editSuccessMessage' : 'addSuccessMessage'; var msgType = that.guid ? 'editSuccessMessage' : 'addSuccessMessage';
Utils.notifySuccess({ Utils.notifySuccess({
...@@ -784,7 +787,8 @@ define(['require', ...@@ -784,7 +787,8 @@ define(['require',
that.hideLoader({ that.hideLoader({
editVisiblityOfEntitySelectionBox: true editVisiblityOfEntitySelectionBox: true
}); });
that.modal.$el.find('button.ok, button.cancel').attr("disabled", false); that.modal.$el.find('button.ok').hideButtonLoader();
that.modal.$el.find('button.cancel').attr("disabled", false);
} }
}); });
......
dashboardv2/public/js/views/glossary/GlossaryLayoutView.js
...@@ -54,7 +54,9 @@ define(['require', ...@@ -54,7 +54,9 @@ define(['require',
glossaryView: 'input[name="glossaryView"]', glossaryView: 'input[name="glossaryView"]',
termTree: "[data-id='termTree']", termTree: "[data-id='termTree']",
categoryTree: "[data-id='categoryTree']", categoryTree: "[data-id='categoryTree']",
importGlossary: "[data-id='importGlossary']" importGlossary: "[data-id='importGlossary']",
glossaryTreeLoader: "[data-id='glossaryTreeLoader']",
glossaryTreeView: "[data-id='glossaryTreeView']"
}, },
/** ui events hash */ /** ui events hash */
events: function() { events: function() {
...@@ -110,6 +112,7 @@ define(['require', ...@@ -110,6 +112,7 @@ define(['require',
this.listenTo(this.glossaryCollection.fullCollection, "reset add change", function(skip) { this.listenTo(this.glossaryCollection.fullCollection, "reset add change", function(skip) {
this.generateTree(); this.generateTree();
this.setValues(); this.setValues();
this.changeLoaderState(false);
}, this); }, this);
this.listenTo(this.glossaryCollection, "update:details", function(options) { this.listenTo(this.glossaryCollection, "update:details", function(options) {
var isGlossaryUpdate = options.isGlossaryUpdate; var isGlossaryUpdate = options.isGlossaryUpdate;
...@@ -127,6 +130,7 @@ define(['require', ...@@ -127,6 +130,7 @@ define(['require',
this.setValues({ trigger: false }); this.setValues({ trigger: false });
} }
} }
this.changeLoaderState(false);
}, this); }, this);
if (!this.isAssignView) { if (!this.isAssignView) {
$('body').on('click', '.termPopoverOptions li, .categoryPopoverOptions li', function(e) { $('body').on('click', '.termPopoverOptions li, .categoryPopoverOptions li', function(e) {
...@@ -136,6 +140,7 @@ define(['require', ...@@ -136,6 +140,7 @@ define(['require',
} }
}, },
onRender: function() { onRender: function() {
this.changeLoaderState(true);
if (this.isAssignCategoryView) { if (this.isAssignCategoryView) {
this.$('.category-view').show(); this.$('.category-view').show();
this.$('.term-view').hide(); this.$('.term-view').hide();
...@@ -146,6 +151,15 @@ define(['require', ...@@ -146,6 +151,15 @@ define(['require',
this.getGlossary(); this.getGlossary();
} }
}, },
changeLoaderState: function(showLoader) {
if (showLoader) {
this.ui.glossaryTreeLoader.show();
this.ui.glossaryTreeView.hide();
} else {
this.ui.glossaryTreeLoader.hide();
this.ui.glossaryTreeView.show();
}
},
setValues: function(options) { setValues: function(options) {
if (this.viewType == "category") { if (this.viewType == "category") {
if (!this.ui.glossaryView.prop("checked")) { if (!this.ui.glossaryView.prop("checked")) {
...@@ -213,6 +227,7 @@ define(['require', ...@@ -213,6 +227,7 @@ define(['require',
} }
}, },
getGlossary: function() { getGlossary: function() {
this.changeLoaderState(true);
this.glossaryCollection.fetch({ reset: true }); this.glossaryCollection.fetch({ reset: true });
}, },
generateCategoryData: function(options) { generateCategoryData: function(options) {
...@@ -685,6 +700,7 @@ define(['require', ...@@ -685,6 +700,7 @@ define(['require',
notifyObj = { notifyObj = {
modal: true, modal: true,
ok: function(argument) { ok: function(argument) {
that.changeLoaderState(true);
if (type == "Glossary") { if (type == "Glossary") {
that.glossaryCollection.fullCollection.get(guid).destroy(options, { silent: true, reset: false }); that.glossaryCollection.fullCollection.get(guid).destroy(options, { silent: true, reset: false });
} else if (type == "GlossaryCategory") { } else if (type == "GlossaryCategory") {
...@@ -692,6 +708,7 @@ define(['require', ...@@ -692,6 +708,7 @@ define(['require',
} else if (type == "GlossaryTerm") { } else if (type == "GlossaryTerm") {
new that.glossaryCollection.model().deleteTerm(guid, options); new that.glossaryCollection.model().deleteTerm(guid, options);
} }
that.changeLoaderState(false);
}, },
cancel: function(argument) {} cancel: function(argument) {}
}; };
......
dashboardv2/public/js/views/tag/TagLayoutView.js
...@@ -47,7 +47,9 @@ define(['require', ...@@ -47,7 +47,9 @@ define(['require',
treeLov: "[data-id='treeLov']", treeLov: "[data-id='treeLov']",
refreshTag: '[data-id="refreshTag"]', refreshTag: '[data-id="refreshTag"]',
tagView: 'input[name="tagView"]', tagView: 'input[name="tagView"]',
expandArrow: '[data-id="expandArrow"]' expandArrow: '[data-id="expandArrow"]',
tagTreeLoader: '[data-id="tagTreeLoader"]',
tagTreeView: '[data-id="tagTreeView"]'
}, },
/** ui events hash */ /** ui events hash */
events: function() { events: function() {
...@@ -96,10 +98,21 @@ define(['require', ...@@ -96,10 +98,21 @@ define(['require',
}, },
onRender: function() { onRender: function() {
var that = this; var that = this;
this.changeLoaderState(true);
this.bindEvents(); this.bindEvents();
this.tagsGenerator(); this.tagsGenerator();
}, },
changeLoaderState: function(showLoader) {
if (showLoader) {
this.ui.tagTreeLoader.show();
this.ui.tagTreeView.hide();
} else {
this.ui.tagTreeLoader.hide();
this.ui.tagTreeView.show();
}
},
fetchCollections: function() { fetchCollections: function() {
this.changeLoaderState(true);
this.collection.fetch({ reset: true }); this.collection.fetch({ reset: true });
this.ui.offLineSearchTag.val(""); this.ui.offLineSearchTag.val("");
}, },
...@@ -229,7 +242,9 @@ define(['require', ...@@ -229,7 +242,9 @@ define(['require',
if (this.createTag) { if (this.createTag) {
this.createTag = false; this.createTag = false;
} }
} }
this.changeLoaderState(false);
}, },
getTagTreeList: function(options) { getTagTreeList: function(options) {
var that = this, var that = this,
...@@ -373,7 +388,8 @@ define(['require', ...@@ -373,7 +388,8 @@ define(['require',
}); });
}); });
modal.on('ok', function() { modal.on('ok', function() {
modal.$el.find('button.ok').attr("disabled", "true"); // modal.$el.find('button.ok').attr("disabled", "true");
modal.$el.find('button.ok').showButtonLoader();
that.onCreateButton(view, modal); that.onCreateButton(view, modal);
}); });
modal.on('closeModal', function() { modal.on('closeModal', function() {
...@@ -401,9 +417,9 @@ define(['require', ...@@ -401,9 +417,9 @@ define(['require',
Utils.notifyInfo({ Utils.notifyInfo({
content: "Please fill the attributes or delete the input box" content: "Please fill the attributes or delete the input box"
}); });
modal.$el.find('button.ok').hideButtonLoader();
return; return;
} }
this.name = ref.ui.tagName.val(); this.name = ref.ui.tagName.val();
this.description = ref.ui.description.val(); this.description = ref.ui.description.val();
var superTypes = []; var superTypes = [];
...@@ -459,6 +475,7 @@ define(['require', ...@@ -459,6 +475,7 @@ define(['require',
} }
notifyObj['text'] = text; notifyObj['text'] = text;
Utils.notifyConfirm(notifyObj); Utils.notifyConfirm(notifyObj);
modal.$el.find('button.ok').hideButtonLoader();
return false; return false;
} }
} }
...@@ -476,6 +493,7 @@ define(['require', ...@@ -476,6 +493,7 @@ define(['require',
}; };
new this.collection.model().set(this.json).save(null, { new this.collection.model().set(this.json).save(null, {
success: function(model, response) { success: function(model, response) {
that.changeLoaderState(true);
var classificationDefs = model.get('classificationDefs'); var classificationDefs = model.get('classificationDefs');
that.ui.createTag.removeAttr("disabled"); that.ui.createTag.removeAttr("disabled");
that.createTag = true; that.createTag = true;
...@@ -496,7 +514,12 @@ define(['require', ...@@ -496,7 +514,12 @@ define(['require',
content: "Classification " + that.name + Messages.getAbbreviationMsg(false, 'addSuccessMessage') content: "Classification " + that.name + Messages.getAbbreviationMsg(false, 'addSuccessMessage')
}); });
modal.trigger('cancel'); modal.trigger('cancel');
modal.$el.find('button.ok').hideButtonLoader();
that.changeLoaderState(false);
that.typeHeaders.fetch({ reset: true }); that.typeHeaders.fetch({ reset: true });
},
complete: function() {
modal.$el.find("button.ok").hideButtonLoader();
} }
}); });
}, },
...@@ -570,6 +593,7 @@ define(['require', ...@@ -570,6 +593,7 @@ define(['require',
onNotifyOk: function(data) { onNotifyOk: function(data) {
var that = this, var that = this,
deleteTagData = this.collection.fullCollection.findWhere({ name: this.tag }); deleteTagData = this.collection.fullCollection.findWhere({ name: this.tag });
that.changeLoaderState(true);
deleteTagData.deleteTag({ deleteTagData.deleteTag({
typeName: that.tag, typeName: that.tag,
success: function() { success: function() {
......
dashboardv3/public/css/scss/common.scss
...@@ -285,4 +285,38 @@ pre { ...@@ -285,4 +285,38 @@ pre {
.errorValidate+span .select2-selection { .errorValidate+span .select2-selection {
border-color: red !important; border-color: red !important;
}
.button-loader:after {
content: "\f021";
position: absolute;
left: -6px;
bottom: 4px;
font-family: FontAwesome;
background: transparent;
height: 34px;
width: 38px;
line-height: 34px;
text-align: center;
animation: spin 1000ms infinite linear;
}
@-webkit-keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(359deg);
}
}
@keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(359deg);
}
} }
\ No newline at end of file
dashboardv3/public/css/scss/loader.scss
...@@ -14,7 +14,6 @@ ...@@ -14,7 +14,6 @@
// See the License for the specific language governing permissions and // See the License for the specific language governing permissions and
// limitations under the License. // limitations under the License.
/* loader.scss */ /* loader.scss */
.fa-spin-custom { .fa-spin-custom {
...@@ -165,4 +164,42 @@ ...@@ -165,4 +164,42 @@
100% { 100% {
background-position: 468px 0; background-position: 468px 0;
} }
}
.loader-row .fontLoader-relative {
margin-top: 43px;
}
.module-loader {
position: fixed;
top: 0;
height: 2px;
z-index: 9999;
background: repeating-linear-gradient(to right, $color_jungle_green_approx 0%, $color_havelock_blue_approx 50%, #38bb4e 100%);
width: 100%;
background-size: 200% auto;
background-position: 0 100%;
animation: moduleLoader 2s infinite;
animation-fill-mode: forwards;
animation-timing-function: linear;
transition: all 2s linear;
visibility: hidden;
opacity: 0;
transition: visibility 0s linear 0.33s, opacity 0.33s linear;
&.show-loader {
opacity: 1;
transition-delay: 0s;
visibility: visible;
}
}
@keyframes moduleLoader {
0% {
background-position: 0 0;
}
100% {
background-position: -200% 0;
}
} }
\ No newline at end of file
dashboardv3/public/index.html.tpl
...@@ -118,6 +118,7 @@ ...@@ -118,6 +118,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="module-loader"></div>
<!-- build:js scripts/main.js --> <!-- build:js scripts/main.js -->
<script data-main="js/main.js?bust=<%- bust %>" src="js/libs/requirejs/require.js?bust=<%- bust %>"></script> <script data-main="js/main.js?bust=<%- bust %>" src="js/libs/requirejs/require.js?bust=<%- bust %>"></script>
<!-- endbuild --> <!-- endbuild -->
......
dashboardv3/public/js/main.js
...@@ -15,7 +15,19 @@ ...@@ -15,7 +15,19 @@
* See the License for the specific language governing permissions and * See the License for the specific language governing permissions and
* limitations under the License. * limitations under the License.
*/ */
var modulesLoadCount = 0,
showModuleLoader = function() {
if (modulesLoadCount === 1) {
document.querySelector(".module-loader").classList.add("show-loader");
}
},
hideModuleLoader = function() {
setTimeout(function() {
if (modulesLoadCount === 0) {
document.querySelector(".module-loader").className = "module-loader";
}
}, 1000);
};
require.config({ require.config({
/* starting point for application */ /* starting point for application */
'hbs': { 'hbs': {
...@@ -27,6 +39,7 @@ require.config({ ...@@ -27,6 +39,7 @@ require.config({
'templateExtension': 'html', // Set the extension automatically appended to templates 'templateExtension': 'html', // Set the extension automatically appended to templates
'compileOptions': {} // options object which is passed to Handlebars compiler 'compileOptions': {} // options object which is passed to Handlebars compiler
}, },
'urlArgs': "bust=" + getBustValue(), 'urlArgs': "bust=" + getBustValue(),
/** /**
* Requested as soon as the loader has processed the configuration. It does * Requested as soon as the loader has processed the configuration. It does
...@@ -37,6 +50,23 @@ require.config({ ...@@ -37,6 +50,23 @@ require.config({
*/ */
'deps': ['marionette'], 'deps': ['marionette'],
onNodeCreated: function(node, config, moduleName, url) {
console.log("module " + moduleName + " is about to be loaded");
++modulesLoadCount;
showModuleLoader();
node.addEventListener("load", function() {
console.log("module " + moduleName + " has been loaded");
--modulesLoadCount;
hideModuleLoader();
});
node.addEventListener("error", function() {
console.log("module " + moduleName + " could not be loaded");
--modulesLoadCount;
hideModuleLoader();
});
},
/** /**
* The number of seconds to wait before giving up on loading a script. * The number of seconds to wait before giving up on loading a script.
* @default 7 seconds * @default 7 seconds
......
dashboardv3/public/js/templates/detail_page/DetailPageLayoutView_tmpl.html
...@@ -76,14 +76,22 @@ ...@@ -76,14 +76,22 @@
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-6"> <div class="col-md-6 loader-row">
<div id="r_entityUserDefineView"> <div id="r_entityUserDefineView">
<div class="fontLoader-relative"> <div class="fontLoader-relative">
<i class="fa fa-refresh fa-spin-custom"></i> <i class="fa fa-refresh fa-spin-custom"></i>
</div> </div>
</div> </div>
<div id="r_entityLabelDefineView"></div> <div id="r_entityLabelDefineView">
<div id="r_entityBusinessMetadataView"></div> <div class="fontLoader-relative">
<i class="fa fa-refresh fa-spin-custom"></i>
</div>
</div>
<div id="r_entityBusinessMetadataView">
<div class="fontLoader-relative">
<i class="fa fa-refresh fa-spin-custom"></i>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
......
dashboardv3/public/js/templates/search/tree/BusinessMetadataTreeLayoutView_tmpl.html
...@@ -31,5 +31,8 @@ ...@@ -31,5 +31,8 @@
</div> </div>
<div id="businessMetadataTree" class="panel-collapse collapse jstree-with-action in"> <div id="businessMetadataTree" class="panel-collapse collapse jstree-with-action in">
<div data-id="businessMetadataSearchTree"></div> <div data-id="businessMetadataSearchTree"></div>
<div class="text-center" data-id="businessMetadataTreeLoader">
<i class="fa fa-refresh fa-spin-custom"></i>
</div>
</div> </div>
</div> </div>
\ No newline at end of file
dashboardv3/public/js/templates/search/tree/ClassificationTreeLayoutView_tmpl.html
...@@ -51,5 +51,8 @@ ...@@ -51,5 +51,8 @@
</div> </div>
<div id="c_classfication" class="panel-collapse collapse jstree-with-action in"> <div id="c_classfication" class="panel-collapse collapse jstree-with-action in">
<div data-id="classificationSearchTree"></div> <div data-id="classificationSearchTree"></div>
<div class="text-center" data-id="classificationTreeLoader">
<i class="fa fa-refresh fa-spin-custom"></i>
</div>
</div> </div>
</div> </div>
\ No newline at end of file
dashboardv3/public/js/templates/search/tree/CustomFilterTreeLayoutView_tmpl.html
...@@ -25,23 +25,12 @@ ...@@ -25,23 +25,12 @@
<button type="button" class="typeRefresh" data-id="refreshTree" data-type="CustomFilter" title="Refresh"> <button type="button" class="typeRefresh" data-id="refreshTree" data-type="CustomFilter" title="Refresh">
<i class="fa fa-refresh"></i> <i class="fa fa-refresh"></i>
</button> </button>
<!-- <button type="button" class="typeRefresh" data-id="showCustomFilter" title="Show Advanced search">
<i class="fa fa-toggle-on switch-button"></i>
</button> -->
<!-- <button type="button" class="typeRefresh dropdown">
<div class=" btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fa fa-ellipsis-v"></i>
</div>
<ul class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<li data-id="groupOrFlatTreeView" data-type="customFilter"> <i class="fa fa-sitemap"></i><span>Show flat tree</span>
</li>
<li data-id="refreshTree" data-type="customFilter"><i class="fa fa-refresh"></i><span>Refresh</span>
</li>
</ul>
</button> -->
</div> </div>
</div> </div>
<div id="c_customFilter" class="panel-collapse collapse jstree-with-action in"> <div id="c_customFilter" class="panel-collapse collapse jstree-with-action in">
<div class="custom-filter" data-id="customFilterSearchTree"></div> <div class="custom-filter" data-id="customFilterSearchTree"></div>
<div class="text-center" data-id="customFilterTreeLoader">
<i class="fa fa-refresh fa-spin-custom"></i>
</div>
</div> </div>
</div> </div>
\ No newline at end of file
dashboardv3/public/js/templates/search/tree/EntityTreeLayoutView_tmpl.html
...@@ -19,17 +19,9 @@ ...@@ -19,17 +19,9 @@
<i class="ec-icon fa"></i> <i class="ec-icon fa"></i>
<h4 class="panel-title">Entities</h4> <h4 class="panel-title">Entities</h4>
<div class="btn-group pull-right"> <div class="btn-group pull-right">
<!-- <button type="button" class="typeRefresh" data-id="groupOrFlatTreeView" data-type="entity" title="Show flat tree">
<i class="fa fa-sitemap"></i>
</button> -->
<button type="button" class="typeRefresh" data-id="refreshTree" data-type="entity" title="Refresh"> <button type="button" class="typeRefresh" data-id="refreshTree" data-type="entity" title="Refresh">
<i class="fa fa-refresh"></i> <i class="fa fa-refresh"></i>
</button> </button>
<!-- <ul class="dropdown-menu right-align tree-menu">
<li class="typeEmptyEntity" data-id="showEmptyServiceType">
<i class="fa fa-check-circle"></i> <a>Show Empty</a>
</li>
</ul> -->
<button type="button" class="typeRefresh" data-id="showEmptyServiceType" data-type="entity" title="Show empty service types"> <button type="button" class="typeRefresh" data-id="showEmptyServiceType" data-type="entity" title="Show empty service types">
<i class="fa fa-toggle-off"></i> <i class="fa fa-toggle-off"></i>
</button> </button>
...@@ -40,15 +32,14 @@ ...@@ -40,15 +32,14 @@
<ul class="dropdown-menu" aria-labelledby="dropdownMenuButton"> <ul class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<li data-id="groupOrFlatTreeView" data-type="entity"> <i class="fa fa-list-ul"></i><span>Show flat tree</span> <li data-id="groupOrFlatTreeView" data-type="entity"> <i class="fa fa-list-ul"></i><span>Show flat tree</span>
</li> </li>
<!-- <li data-id="showEmptyServiceType" data-type="entity"> <i class="fa fa-toggle-off"></i><span >Show empty service types</span>
</li>
<li data-id="refreshTree" data-type="entity"><i class="fa fa-refresh"></i><span >Refresh</span>
</li> -->
</ul> </ul>
</button> </button>
</div> </div>
</div> </div>
<div id="c_entity" class="panel-collapse collapse jstree-with-action in"> <div id="c_entity" class="panel-collapse collapse jstree-with-action in">
<div class="entityTree" data-id="entitySearchTree"></div> <div class="entityTree" data-id="entitySearchTree"></div>
<div class="text-center" data-id="entityTreeLoader">
<i class="fa fa-refresh fa-spin-custom"></i>
</div>
</div> </div>
</div> </div>
\ No newline at end of file
dashboardv3/public/js/templates/search/tree/GlossaryTreeLayoutView_tmpl.html
...@@ -23,9 +23,6 @@ ...@@ -23,9 +23,6 @@
<button type="button" class="typeRefresh" data-id="showGlossaryType" title="Show Category"> <button type="button" class="typeRefresh" data-id="showGlossaryType" title="Show Category">
<i class="fa fa-toggle-on switch-button"></i> <i class="fa fa-toggle-on switch-button"></i>
</button> </button>
<!-- <button title="Create Glossary" type="button" data-id="createGlossary">
<i class="fa fa-plus"></i>
</button> -->
<button type="button" class="typeRefresh dropdown"> <button type="button" class="typeRefresh dropdown">
<div class=" btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <div class=" btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fa fa-ellipsis-v"></i> <i class="fa fa-ellipsis-v"></i>
...@@ -43,5 +40,8 @@ ...@@ -43,5 +40,8 @@
</div> </div>
<div id="c_term" class="panel-collapse collapse jstree-with-action in"> <div id="c_term" class="panel-collapse collapse jstree-with-action in">
<div data-id="termSearchTree"></div> <div data-id="termSearchTree"></div>
<div class="glossary-tree-loader text-center">
<i class="fa fa-refresh fa-spin-custom"></i>
</div>
</div> </div>
</div> </div>
\ No newline at end of file
dashboardv3/public/js/utils/CommonViewFunction.js
...@@ -716,7 +716,7 @@ define(['require', 'utils/Utils', 'modules/Modal', 'utils/Messages', 'utils/Enum ...@@ -716,7 +716,7 @@ define(['require', 'utils/Utils', 'modules/Modal', 'utils/Messages', 'utils/Enum
} }
}); });
modal.on('ok', function() { modal.on('ok', function() {
modal.$el.find('button.ok').attr("disabled", true); modal.$el.find('button.ok').showButtonLoader();
CommonViewFunction.createEditGlossaryCategoryTermSubmit(_.extend({ "ref": view, "modal": modal }, options)); CommonViewFunction.createEditGlossaryCategoryTermSubmit(_.extend({ "ref": view, "modal": modal }, options));
}); });
modal.on('closeModal', function() { modal.on('closeModal', function() {
...@@ -762,7 +762,7 @@ define(['require', 'utils/Utils', 'modules/Modal', 'utils/Messages', 'utils/Enum ...@@ -762,7 +762,7 @@ define(['require', 'utils/Utils', 'modules/Modal', 'utils/Messages', 'utils/Enum
modal.trigger('closeModal'); modal.trigger('closeModal');
}, },
cust_error: function() { cust_error: function() {
modal.$el.find('button.ok').attr("disabled", false); modal.$el.find('button.ok').hideButtonLoader();
} }
} }
if (model) { if (model) {
......
dashboardv3/public/js/utils/Utils.js
...@@ -919,5 +919,11 @@ define(['require', 'utils/Globals', 'pnotify', 'utils/Messages', 'utils/Enums', ...@@ -919,5 +919,11 @@ define(['require', 'utils/Globals', 'pnotify', 'utils/Messages', 'utils/Enums',
} }
} }
$.fn.showButtonLoader = function() {
$(this).css({ "position": "relative" }).attr("disabled", "true").addClass('button-loader');
}
$.fn.hideButtonLoader = function() {
$(this).removeClass('button-loader').removeAttr("disabled");
}
return Utils; return Utils;
}); });
\ No newline at end of file
dashboardv3/public/js/views/business_metadata/EnumCreateUpdateItemView.js
...@@ -150,14 +150,14 @@ define(["require", "backbone", "hbs!tmpl/business_metadata/EnumCreateUpdateItemV ...@@ -150,14 +150,14 @@ define(["require", "backbone", "hbs!tmpl/business_metadata/EnumCreateUpdateItemV
selectedEnumValues = this.ui.valueSelector.val(); selectedEnumValues = this.ui.valueSelector.val();
if (selectedEnumName == "" || selectedEnumName == null) { if (selectedEnumName == "" || selectedEnumName == null) {
this.ui.enumOkBtn.removeAttr("disabled"); this.ui.enumOkBtn.hideButtonLoader();
Utils.notifyInfo({ Utils.notifyInfo({
content: "Please enter the Enumeration Name" content: "Please enter the Enumeration Name"
}); });
return true; return true;
} }
if (selectedEnumValues == "" || selectedEnumValues == null) { if (selectedEnumValues == "" || selectedEnumValues == null) {
this.ui.enumOkBtn.removeAttr("disabled"); this.ui.enumOkBtn.hideButtonLoader();
Utils.notifyInfo({ Utils.notifyInfo({
content: "Please enter the Enum values" content: "Please enter the Enum values"
}); });
...@@ -175,7 +175,7 @@ define(["require", "backbone", "hbs!tmpl/business_metadata/EnumCreateUpdateItemV ...@@ -175,7 +175,7 @@ define(["require", "backbone", "hbs!tmpl/business_metadata/EnumCreateUpdateItemV
if (this.validationEnum()) { if (this.validationEnum()) {
return; return;
} }
this.ui.enumOkBtn.attr("disabled", "true"); this.ui.enumOkBtn.showButtonLoader();
this.ui.enumSelector.attr("disabled", "true"); this.ui.enumSelector.attr("disabled", "true");
this.ui.valueSelector.attr("disabled", "true"); this.ui.valueSelector.attr("disabled", "true");
this.ui.enumCancleBtn.attr("disabled", "true"); this.ui.enumCancleBtn.attr("disabled", "true");
...@@ -237,7 +237,7 @@ define(["require", "backbone", "hbs!tmpl/business_metadata/EnumCreateUpdateItemV ...@@ -237,7 +237,7 @@ define(["require", "backbone", "hbs!tmpl/business_metadata/EnumCreateUpdateItemV
reset: true, reset: true,
complete: function(model, status) { complete: function(model, status) {
that.emumTypeSelectDisplay(); that.emumTypeSelectDisplay();
that.ui.enumOkBtn.removeAttr("disabled"); that.ui.enumOkBtn.hideButtonLoader();
that.ui.enumSelector.removeAttr("disabled"); that.ui.enumSelector.removeAttr("disabled");
that.ui.valueSelector.removeAttr("disabled"); that.ui.valueSelector.removeAttr("disabled");
if (that.options.closeModal) { if (that.options.closeModal) {
...@@ -254,7 +254,7 @@ define(["require", "backbone", "hbs!tmpl/business_metadata/EnumCreateUpdateItemV ...@@ -254,7 +254,7 @@ define(["require", "backbone", "hbs!tmpl/business_metadata/EnumCreateUpdateItemV
Utils.notifySuccess({ Utils.notifySuccess({
content: "No updated values" content: "No updated values"
}); });
that.ui.enumOkBtn.removeAttr("disabled"); that.ui.enumOkBtn.hideButtonLoader();
that.ui.enumSelector.removeAttr("disabled"); that.ui.enumSelector.removeAttr("disabled");
that.ui.valueSelector.removeAttr("disabled"); that.ui.valueSelector.removeAttr("disabled");
if (that.options.closeModal) { if (that.options.closeModal) {
......
dashboardv3/public/js/views/entity/CreateEntityLayoutView.js
...@@ -103,7 +103,8 @@ define(['require', ...@@ -103,7 +103,8 @@ define(['require',
}).open(); }).open();
this.modal.$el.find('button.ok').attr("disabled", true); this.modal.$el.find('button.ok').attr("disabled", true);
this.modal.on('ok', function(e) { this.modal.on('ok', function(e) {
that.modal.$el.find('button.ok, button.cancel').attr("disabled", true); that.modal.$el.find('button.cancel').attr("disabled", true);
that.modal.$el.find('button.ok').showButtonLoader();
that.okButton(); that.okButton();
}); });
this.modal.on('closeModal', function() { this.modal.on('closeModal', function() {
...@@ -135,6 +136,7 @@ define(['require', ...@@ -135,6 +136,7 @@ define(['require',
if (!value.length && $(this).hasClass('false')) { if (!value.length && $(this).hasClass('false')) {
$(this).removeClass('errorClass'); $(this).removeClass('errorClass');
that.modal.$el.find('button.ok').prop("disabled", false); that.modal.$el.find('button.ok').prop("disabled", false);
} else { } else {
try { try {
if (value && value.length) { if (value && value.length) {
...@@ -690,6 +692,7 @@ define(['require', ...@@ -690,6 +692,7 @@ define(['require',
$(this).addClass('errorClass'); $(this).addClass('errorClass');
} }
that.hideLoader(); that.hideLoader();
that.modal.$el.find('button.ok').hideButtonLoader();
throw new Error("Please fill the required fields"); throw new Error("Please fill the required fields");
return; return;
} }
...@@ -765,6 +768,7 @@ define(['require', ...@@ -765,6 +768,7 @@ define(['require',
data: JSON.stringify(entityJson), data: JSON.stringify(entityJson),
type: "POST", type: "POST",
success: function(model, response) { success: function(model, response) {
that.modal.$el.find('button.ok').hideButtonLoader();
that.modal.close(); that.modal.close();
var msgType = that.guid ? "editSuccessMessage" : "addSuccessMessage"; var msgType = that.guid ? "editSuccessMessage" : "addSuccessMessage";
Utils.notifySuccess({ Utils.notifySuccess({
...@@ -789,7 +793,8 @@ define(['require', ...@@ -789,7 +793,8 @@ define(['require',
that.hideLoader({ that.hideLoader({
editVisiblityOfEntitySelectionBox: true editVisiblityOfEntitySelectionBox: true
}); });
that.modal.$el.find('button.ok, button.cancel').attr("disabled", false); that.modal.$el.find('button.ok').hideButtonLoader();
that.modal.$el.find('button.cancel').attr("disabled", false);
} }
}); });
......
dashboardv3/public/js/views/search/tree/BusinessMetadataTreeLayoutView.js
...@@ -42,7 +42,8 @@ define([ ...@@ -42,7 +42,8 @@ define([
businessMetadataSearchTree: '[data-id="businessMetadataSearchTree"]', businessMetadataSearchTree: '[data-id="businessMetadataSearchTree"]',
// Create // Create
createBusinessMetadata: '[data-id="createBusinessMetadata"]' createBusinessMetadata: '[data-id="createBusinessMetadata"]',
businessMetadataTreeLoader: '[data-id="businessMetadataTreeLoader"]'
}, },
templateHelpers: function() { templateHelpers: function() {
return { return {
...@@ -54,6 +55,7 @@ define([ ...@@ -54,6 +55,7 @@ define([
that = this; that = this;
// refresh individual tree // refresh individual tree
events["click " + this.ui.refreshTree] = function(e) { events["click " + this.ui.refreshTree] = function(e) {
that.changeLoaderState(true);
e.stopPropagation(); e.stopPropagation();
that.refresh(); that.refresh();
}; };
...@@ -85,7 +87,9 @@ define([ ...@@ -85,7 +87,9 @@ define([
this.bindEvents(); this.bindEvents();
}, },
onRender: function() { onRender: function() {
this.changeLoaderState(true);
this.renderBusinessMetadataTree(); this.renderBusinessMetadataTree();
this.changeLoaderState(false);
//this.createBusinessMetadataAction(); //this.createBusinessMetadataAction();
}, },
bindEvents: function() { bindEvents: function() {
...@@ -107,6 +111,15 @@ define([ ...@@ -107,6 +111,15 @@ define([
that[$(this).find("a").data("fn") + "BusinessMetadata"](e); that[$(this).find("a").data("fn") + "BusinessMetadata"](e);
}); });
}, },
changeLoaderState: function(showLoader) {
if (showLoader) {
this.ui.businessMetadataSearchTree.hide();
this.ui.businessMetadataTreeLoader.show();
} else {
this.ui.businessMetadataSearchTree.show();
this.ui.businessMetadataTreeLoader.hide();
}
},
createBusinessMetadataAction: function() { createBusinessMetadataAction: function() {
var that = this; var that = this;
Utils.generatePopover({ Utils.generatePopover({
...@@ -186,6 +199,7 @@ define([ ...@@ -186,6 +199,7 @@ define([
}; };
that.businessMetadataDefCollection.fullCollection.sort({ silent: true }); that.businessMetadataDefCollection.fullCollection.sort({ silent: true });
that.ui.businessMetadataSearchTree.jstree(true).refresh(); that.ui.businessMetadataSearchTree.jstree(true).refresh();
that.changeLoaderState(false);
} }
}); });
}, },
......
dashboardv3/public/js/views/search/tree/ClassificationTreeLayoutView.js
...@@ -53,7 +53,8 @@ define([ ...@@ -53,7 +53,8 @@ define([
wildCardSearch: '[data-id="wildCardSearch"]', wildCardSearch: '[data-id="wildCardSearch"]',
wildCardValue: '[data-id="wildCardValue"]', wildCardValue: '[data-id="wildCardValue"]',
wildCardContainer: '[data-id="wildCardContainer"]', wildCardContainer: '[data-id="wildCardContainer"]',
clearWildCard: '[data-id="clearWildCard"]' clearWildCard: '[data-id="clearWildCard"]',
classificationTreeLoader: '[data-id="classificationTreeLoader"]'
}, },
templateHelpers: function() { templateHelpers: function() {
return { return {
...@@ -63,8 +64,8 @@ define([ ...@@ -63,8 +64,8 @@ define([
events: function() { events: function() {
var events = {}, var events = {},
that = this; that = this;
// refresh individual tree
events["click " + this.ui.refreshTree] = function(e) { events["click " + this.ui.refreshTree] = function(e) {
that.changeLoaderState(true);
var type = $(e.currentTarget).data("type"); var type = $(e.currentTarget).data("type");
e.stopPropagation(); e.stopPropagation();
that.refresh({ type: type }); that.refresh({ type: type });
...@@ -159,9 +160,21 @@ define([ ...@@ -159,9 +160,21 @@ define([
this.isGroupView = true; this.isGroupView = true;
}, },
onRender: function() { onRender: function() {
this.changeLoaderState(true);
this.renderClassificationTree(); this.renderClassificationTree();
this.createClassificationAction(); this.createClassificationAction();
this.ui.clearWildCard.addClass('hide-icon'); this.ui.clearWildCard.addClass('hide-icon');
this.changeLoaderState(false);
},
changeLoaderState: function(showLoader) {
if (showLoader) {
this.ui.classificationSearchTree.hide();
this.ui.classificationTreeLoader.show();
} else {
this.ui.classificationSearchTree.show();
this.ui.classificationTreeLoader.hide();
}
}, },
bindEvents: function() { bindEvents: function() {
var that = this; var that = this;
...@@ -182,6 +195,7 @@ define([ ...@@ -182,6 +195,7 @@ define([
that[$(this).find('a').data('fn') + "Classification"](e) that[$(this).find('a').data('fn') + "Classification"](e)
}); });
this.searchVent.on("Classification:Count:Update", function(options) { this.searchVent.on("Classification:Count:Update", function(options) {
that.changeLoaderState(true);
var opt = options || {}; var opt = options || {};
if (opt && !opt.metricData) { if (opt && !opt.metricData) {
that.metricCollection.fetch({ that.metricCollection.fetch({
...@@ -189,12 +203,15 @@ define([ ...@@ -189,12 +203,15 @@ define([
that.entityCountObj = _.first(that.metricCollection.toJSON()); that.entityCountObj = _.first(that.metricCollection.toJSON());
that.classificationTreeUpdate = true; that.classificationTreeUpdate = true;
that.ui.classificationSearchTree.jstree(true).refresh(); that.ui.classificationSearchTree.jstree(true).refresh();
that.changeLoaderState(false);
} }
}); });
} else { } else {
that.entityCountObj = opt.metricData; that.entityCountObj = opt.metricData;
that.ui.classificationSearchTree.jstree(true).refresh(); that.ui.classificationSearchTree.jstree(true).refresh();
that.changeLoaderState(false);
} }
}); });
}, },
findSearchResult: function(tagValue) { findSearchResult: function(tagValue) {
...@@ -266,7 +283,10 @@ define([ ...@@ -266,7 +283,10 @@ define([
this.tagId = Globals[that.options.value.tag].guid; this.tagId = Globals[that.options.value.tag].guid;
this.ui.classificationSearchTree.jstree(true).select_node(this.tagId); this.ui.classificationSearchTree.jstree(true).select_node(this.tagId);
} else if ((this.tagId !== "_ALL_CLASSIFICATION_TYPES" && that.options.value.tag !== this.tagId) || (this.tagId !== "_NOT_CLASSIFIED" && that.options.value.tag !== this.tagId) || (this.tagId !== "_CLASSIFIED" && that.options.value.tag !== this.tagId)) { } else if ((this.tagId !== "_ALL_CLASSIFICATION_TYPES" && that.options.value.tag !== this.tagId) || (this.tagId !== "_NOT_CLASSIFIED" && that.options.value.tag !== this.tagId) || (this.tagId !== "_CLASSIFIED" && that.options.value.tag !== this.tagId)) {
if ((that.options.value.tag.indexOf('*') != -1)) {
that.ui.classificationSearchTree.jstree(true).deselect_all();
that.ui.wildCardValue.val(that.options.value.tag); that.ui.wildCardValue.val(that.options.value.tag);
}
var dataFound = this.classificationDefCollection.fullCollection.find(function(obj) { var dataFound = this.classificationDefCollection.fullCollection.find(function(obj) {
return obj.get("name") === that.options.value.tag return obj.get("name") === that.options.value.tag
}); });
...@@ -359,6 +379,7 @@ define([ ...@@ -359,6 +379,7 @@ define([
that.classificationDefCollection.fullCollection.sort({ silent: true }); that.classificationDefCollection.fullCollection.sort({ silent: true });
that.classificationTreeUpdate = true that.classificationTreeUpdate = true
that.ui.classificationSearchTree.jstree(true).refresh(); that.ui.classificationSearchTree.jstree(true).refresh();
that.changeLoaderState(false);
} }
}; };
this.classificationDefCollection.fetch({ this.classificationDefCollection.fetch({
...@@ -423,8 +444,8 @@ define([ ...@@ -423,8 +444,8 @@ define([
that.tagId = isSelectedChild ? child.get("guid") : null; that.tagId = isSelectedChild ? child.get("guid") : null;
} }
} }
var modelJSON = child.toJSON();
if (child) { if (child) {
var modelJSON = child.toJSON();
var nodeDetails = { var nodeDetails = {
name: _.escape(name), name: _.escape(name),
model: modelJSON, model: modelJSON,
...@@ -639,7 +660,7 @@ define([ ...@@ -639,7 +660,7 @@ define([
}); });
}); });
modal.on("ok", function() { modal.on("ok", function() {
modal.$el.find("button.ok").attr("disabled", "true"); modal.$el.find("button.ok").showButtonLoader();
that.onCreateTagButton(view, modal); that.onCreateTagButton(view, modal);
}); });
modal.on("closeModal", function() { modal.on("closeModal", function() {
...@@ -666,6 +687,7 @@ define([ ...@@ -666,6 +687,7 @@ define([
Utils.notifyInfo({ Utils.notifyInfo({
content: "Please fill the attributes or delete the input box" content: "Please fill the attributes or delete the input box"
}); });
modal.$el.find("button.ok").hideButtonLoader();
return; return;
} }
...@@ -724,6 +746,7 @@ define([ ...@@ -724,6 +746,7 @@ define([
} }
notifyObj["text"] = text; notifyObj["text"] = text;
Utils.notifyConfirm(notifyObj); Utils.notifyConfirm(notifyObj);
modal.$el.find("button.ok").hideButtonLoader();
return false; return false;
} }
} }
...@@ -758,9 +781,11 @@ define([ ...@@ -758,9 +781,11 @@ define([
content: "Classification " + name + Messages.getAbbreviationMsg(false, 'addSuccessMessage') content: "Classification " + name + Messages.getAbbreviationMsg(false, 'addSuccessMessage')
}); });
modal.trigger("cancel"); modal.trigger("cancel");
modal.$el.find("button.ok").showButtonLoader();
that.typeHeaders.fetch({ reset: true }); that.typeHeaders.fetch({ reset: true });
var url = "#!/tag/tagAttribute/" + name; },
this.onClassificationUpdate(url); complete: function() {
modal.$el.find("button.ok").hideButtonLoader();
} }
}); });
}, },
...@@ -832,4 +857,4 @@ define([ ...@@ -832,4 +857,4 @@ define([
}); });
return ClassificationTreeLayoutView; return ClassificationTreeLayoutView;
}); });
\ No newline at end of file
dashboardv3/public/js/views/search/tree/CustomFilterTreeLayoutView.js
...@@ -44,8 +44,8 @@ define([ ...@@ -44,8 +44,8 @@ define([
refreshTree: '[data-id="refreshTree"]', refreshTree: '[data-id="refreshTree"]',
groupOrFlatTree: '[data-id="groupOrFlatTreeView"]', groupOrFlatTree: '[data-id="groupOrFlatTreeView"]',
customFilterSearchTree: '[data-id="customFilterSearchTree"]', customFilterSearchTree: '[data-id="customFilterSearchTree"]',
showCustomFilter: '[data-id="showCustomFilter"]' showCustomFilter: '[data-id="showCustomFilter"]',
customFilterTreeLoader: '[data-id="customFilterTreeLoader"]'
}, },
templateHelpers: function() { templateHelpers: function() {
return { return {
...@@ -55,8 +55,8 @@ define([ ...@@ -55,8 +55,8 @@ define([
events: function() { events: function() {
var events = {}, var events = {},
that = this; that = this;
// refresh individual tree
events["click " + this.ui.refreshTree] = function(e) { events["click " + this.ui.refreshTree] = function(e) {
that.changeLoaderState(true);
var type = $(e.currentTarget).data("type"); var type = $(e.currentTarget).data("type");
e.stopPropagation(); e.stopPropagation();
that.refreshCustomFilterTree(); that.refreshCustomFilterTree();
...@@ -66,6 +66,7 @@ define([ ...@@ -66,6 +66,7 @@ define([
this.customFilterSwitchBtnUpdate(); this.customFilterSwitchBtnUpdate();
}; };
events["click " + this.ui.groupOrFlatTree] = function(e) { events["click " + this.ui.groupOrFlatTree] = function(e) {
that.changeLoaderState(true);
var type = $(e.currentTarget).data("type"); var type = $(e.currentTarget).data("type");
e.stopPropagation(); e.stopPropagation();
this.isGroupView = !this.isGroupView; this.isGroupView = !this.isGroupView;
...@@ -152,8 +153,18 @@ define([ ...@@ -152,8 +153,18 @@ define([
this.isGroupView = true; this.isGroupView = true;
}, },
onRender: function() { onRender: function() {
this.changeLoaderState(true);
this.fetchCustomFilter(); this.fetchCustomFilter();
}, },
changeLoaderState: function(showLoader) {
if (showLoader) {
this.ui.customFilterSearchTree.hide();
this.ui.customFilterTreeLoader.show();
} else {
this.ui.customFilterSearchTree.show();
this.ui.customFilterTreeLoader.hide();
}
},
manualRender: function(options) { manualRender: function(options) {
_.extend(this.options, options); _.extend(this.options, options);
...@@ -178,6 +189,7 @@ define([ ...@@ -178,6 +189,7 @@ define([
success: function(collection, data) { success: function(collection, data) {
that.saveSearchBaiscCollection.fullCollection.reset(_.where(data, { searchType: "BASIC" })); that.saveSearchBaiscCollection.fullCollection.reset(_.where(data, { searchType: "BASIC" }));
that.saveSearchAdvanceCollection.fullCollection.reset(_.where(data, { searchType: "ADVANCED" })); that.saveSearchAdvanceCollection.fullCollection.reset(_.where(data, { searchType: "ADVANCED" }));
that.changeLoaderState(false);
}, },
silent: true silent: true
}); });
......
dashboardv3/public/js/views/search/tree/EntityTreeLayoutView.js
...@@ -42,7 +42,8 @@ define([ ...@@ -42,7 +42,8 @@ define([
entitySearchTree: '[data-id="entitySearchTree"]', entitySearchTree: '[data-id="entitySearchTree"]',
// Show/hide empty values in tree // Show/hide empty values in tree
showEmptyServiceType: '[data-id="showEmptyServiceType"]' showEmptyServiceType: '[data-id="showEmptyServiceType"]',
entityTreeLoader: '[data-id="entityTreeLoader"]'
}, },
templateHelpers: function() { templateHelpers: function() {
return { return {
...@@ -52,8 +53,8 @@ define([ ...@@ -52,8 +53,8 @@ define([
events: function() { events: function() {
var events = {}, var events = {},
that = this; that = this;
// refresh individual tree
events["click " + this.ui.refreshTree] = function(e) { events["click " + this.ui.refreshTree] = function(e) {
that.changeLoaderState(true);
var type = $(e.currentTarget).data("type"); var type = $(e.currentTarget).data("type");
e.stopPropagation(); e.stopPropagation();
that.ui[type + "SearchTree"].jstree(true).destroy(); that.ui[type + "SearchTree"].jstree(true).destroy();
...@@ -74,7 +75,6 @@ define([ ...@@ -74,7 +75,6 @@ define([
this.ui.groupOrFlatTree.tooltip('hide'); this.ui.groupOrFlatTree.tooltip('hide');
this.ui.groupOrFlatTree.find("i").toggleClass("fa-sitemap fa-list-ul"); this.ui.groupOrFlatTree.find("i").toggleClass("fa-sitemap fa-list-ul");
this.ui.groupOrFlatTree.find("span").html(this.isGroupView ? "Show flat tree" : "Show group tree"); this.ui.groupOrFlatTree.find("span").html(this.isGroupView ? "Show flat tree" : "Show group tree");
that.ui[type + "SearchTree"].jstree(true).destroy(); that.ui[type + "SearchTree"].jstree(true).destroy();
that.renderEntityTree(); that.renderEntityTree();
}; };
...@@ -88,17 +88,20 @@ define([ ...@@ -88,17 +88,20 @@ define([
that[$(this).find('a').data('fn') + "Entity"](e) that[$(this).find('a').data('fn') + "Entity"](e)
}); });
this.searchVent.on("Entity:Count:Update", function(options) { this.searchVent.on("Entity:Count:Update", function(options) {
that.changeLoaderState(true);
var opt = options || {}; var opt = options || {};
if (opt && !opt.metricData) { if (opt && !opt.metricData) {
that.metricCollection.fetch({ that.metricCollection.fetch({
complete: function() { complete: function() {
that.entityCountObj = _.first(that.metricCollection.toJSON()); that.entityCountObj = _.first(that.metricCollection.toJSON());
that.ui.entitySearchTree.jstree(true).refresh(); that.ui.entitySearchTree.jstree(true).refresh();
that.changeLoaderState(false);
} }
}); });
} else { } else {
that.entityCountObj = opt.metricData; that.entityCountObj = opt.metricData;
that.ui.entitySearchTree.jstree(true).refresh(); that.ui.entitySearchTree.jstree(true).refresh();
that.changeLoaderState(false);
} }
}); });
}, },
...@@ -126,8 +129,19 @@ define([ ...@@ -126,8 +129,19 @@ define([
this.isGroupView = true; this.isGroupView = true;
}, },
onRender: function() { onRender: function() {
this.changeLoaderState(true);
this.renderEntityTree(); this.renderEntityTree();
this.createEntityAction(); this.createEntityAction();
this.changeLoaderState(false);
},
changeLoaderState: function(showLoader) {
if (showLoader) {
this.ui.entitySearchTree.hide();
this.ui.entityTreeLoader.show();
} else {
this.ui.entitySearchTree.show();
this.ui.entityTreeLoader.hide();
}
}, },
createEntityAction: function() { createEntityAction: function() {
var that = this; var that = this;
...@@ -510,6 +524,7 @@ define([ ...@@ -510,6 +524,7 @@ define([
renderTree = function() { renderTree = function() {
if (apiCount === 0) { if (apiCount === 0) {
that.renderEntityTree(); that.renderEntityTree();
that.changeLoaderState(false);
} }
}; };
this.entityDefCollection.fetch({ this.entityDefCollection.fetch({
......
dashboardv3/public/js/views/search/tree/GlossaryTreeLayoutView.js
...@@ -39,8 +39,8 @@ define([ ...@@ -39,8 +39,8 @@ define([
createGlossary: '[data-id="createGlossary"]', createGlossary: '[data-id="createGlossary"]',
showGlossaryType: '[data-id="showGlossaryType"]', showGlossaryType: '[data-id="showGlossaryType"]',
importGlossary: "[data-id='importGlossary']", importGlossary: "[data-id='importGlossary']",
downloadTemplate: "[data-id='downloadTemplate']" downloadTemplate: "[data-id='downloadTemplate']",
glossaryTreeLoader: ".glossary-tree-loader"
}, },
templateHelpers: function() { templateHelpers: function() {
return { return {
...@@ -52,6 +52,7 @@ define([ ...@@ -52,6 +52,7 @@ define([
var events = {}, var events = {},
that = this; that = this;
events["click " + this.ui.refreshTree] = function(e) { events["click " + this.ui.refreshTree] = function(e) {
that.changeLoaderState(true);
var type = $(e.currentTarget).data("type"); var type = $(e.currentTarget).data("type");
e.stopPropagation(); e.stopPropagation();
that.refresh({ type: type }); that.refresh({ type: type });
...@@ -96,6 +97,7 @@ define([ ...@@ -96,6 +97,7 @@ define([
} else { } else {
this.renderGlossaryTree(); this.renderGlossaryTree();
} }
that.changeLoaderState();
}, },
this this
); );
...@@ -144,9 +146,18 @@ define([ ...@@ -144,9 +146,18 @@ define([
this.bindEvents(); this.bindEvents();
}, },
onRender: function() { onRender: function() {
this.changeLoaderState(true);
this.fetchGlossary(); this.fetchGlossary();
}, },
changeLoaderState: function(showLoader) {
if (showLoader) {
this.ui.termSearchTree.hide();
this.ui.glossaryTreeLoader.show();
} else {
this.ui.termSearchTree.show();
this.ui.glossaryTreeLoader.hide();
}
},
onBeforeDestroy: function() { onBeforeDestroy: function() {
this.options.categoryEvent.off("Success:TermRename") this.options.categoryEvent.off("Success:TermRename")
}, },
......
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