Skip to content

A
atlas
Commit ec314fde by kevalbhatt
Options

ATLAS-3897: UI: Normalize list of propagated classifications

parent 7e06f55f
Showing with 350 additions and 78 deletions
dashboardv2/public/css/scss/form.scss
......@@ -369,6 +369,11 @@ button {
>span {
padding: 5px;
&.active {
color: $white;
background-color: $tag_color;
}
&:hover {
@include btn-action-hover-effect('default');
}
......
dashboardv2/public/js/router/Router.js
......@@ -106,11 +106,18 @@ define([
renderViewIfNotExists: function(options) {
var view = options.view,
render = options.render,
viewName = options.viewName,
manualRender = options.manualRender;
if (!view.currentView) {
if (render) view.show(options.render());
if (render) view.show(options.render(options));
} else if (manualRender && viewName) {
if (viewName === view.currentView._viewName) {
options.manualRender(options);
} else {
if (render) view.show(options.render(options));
}
} else {
if (manualRender) options.manualRender();
if (manualRender) options.manualRender(options);
}
},
......@@ -149,13 +156,7 @@ define([
detailPage: function(id) {
var that = this;
if (id) {
require([
'views/site/Header',
'views/detail_page/DetailPageLayoutView',
'views/site/SideNavLayoutView',
'collection/VEntityList'
], function(Header, DetailPageLayoutView, SideNavLayoutView, VEntityList) {
this.entityCollection = new VEntityList([], {});
require(["views/site/Header", "views/detail_page/DetailPageLayoutView", "views/site/SideNavLayoutView"], function(Header, DetailPageLayoutView, SideNavLayoutView) {
var paramObj = Utils.getUrlState.getQueryParams(),
options = _.extend({}, that.preFetchedCollectionLists, that.sharedObj, that.ventObj);
that.renderViewIfNotExists(that.getHeaderOptions(Header));
......@@ -168,9 +169,18 @@ define([
return new SideNavLayoutView(options);
}
});
App.rNContent.show(new DetailPageLayoutView(_.extend({ 'collection': this.entityCollection, 'id': id, 'value': paramObj }, options)));
this.entityCollection.url = UrlLinks.entitiesApiUrl({ guid: id, minExtInfo: true });
this.entityCollection.fetch({ reset: true });
var dOptions = _.extend({ id: id, value: paramObj }, options);
that.renderViewIfNotExists({
view: App.rNContent,
viewName: "DetailPageLayoutView",
manualRender: function() {
this.view.currentView.manualRender(dOptions);
},
render: function() {
return new DetailPageLayoutView(dOptions);
}
});
});
}
},
......
dashboardv2/public/js/templates/tag/TagDetailTableLayoutView_tmpl.html
......@@ -16,11 +16,12 @@
-->
<div class="position-relative">
<div class="tableOverlay"></div>
<div class="inline-content-fr">
<div class="inline-content-fr clearfix" style="margin-bottom: 10px;">
<div class="inline">
<label class="checkbox-inline btn">
<input type="checkbox" data-id="checkPropagtedTag" class="input" checked="true" name="queryType" value="text" name="check" value="1" /> Show Propagated Classifications</label>
</div>
<div class="pull-left" style="width: 300px;"><select data-id="tagList"></select></div>
</div>
<div id="r_tagTableLayoutView"></div>
</div>
\ No newline at end of file
dashboardv2/public/js/utils/Helper.js
......@@ -346,7 +346,7 @@ define(['require',
});
if ($('body').tooltip) {
$('body').tooltip({
selector: '[title]:not(".select2-selection__choice")',
selector: '[title]:not(".select2-selection__choice,.select2-selection__rendered")',
placement: function() {
return this.$element.attr("data-placement") || "bottom";
},
......
dashboardv2/public/js/views/detail_page/DetailPageLayoutView.js
......@@ -24,8 +24,9 @@ define(['require',
'utils/Globals',
'utils/Enums',
'utils/Messages',
'utils/UrlLinks'
], function(require, Backbone, DetailPageLayoutViewTmpl, Utils, CommonViewFunction, Globals, Enums, Messages, UrlLinks) {
'utils/UrlLinks',
'collection/VEntityList'
], function(require, Backbone, DetailPageLayoutViewTmpl, Utils, CommonViewFunction, Globals, Enums, Messages, UrlLinks, VEntityList) {
'use strict';
var DetailPageLayoutView = Backbone.Marionette.LayoutView.extend(
......@@ -52,6 +53,7 @@ define(['require',
/** ui selector cache */
ui: {
tagClick: '[data-id="tagClick"]',
pTagCountClick: '[data-id="pTagCountClick"]',
termClick: '[data-id="termClick"]',
propagatedTagDiv: '[data-id="propagatedTagDiv"]',
title: '[data-id="title"]',
......@@ -84,6 +86,14 @@ define(['require',
});
}
};
events["click " + this.ui.pTagCountClick] = function(e) {
var tag = $(e.currentTarget).parent().children().first().text();
Utils.setUrl({
url: '#!/detailPage/' + this.id + '?tabActive=classification&filter=' + tag,
mergeBrowserUrl: false,
trigger: true
});
};
events["click " + this.ui.termClick] = function(e) {
if (e.target.nodeName.toLocaleLowerCase() != "i") {
Utils.setUrl({
......@@ -119,6 +129,9 @@ define(['require',
initialize: function(options) {
_.extend(this, _.pick(options, 'value', 'collection', 'id', 'entityDefCollection', 'typeHeaders', 'enumDefCollection', 'classificationDefCollection', 'glossaryCollection', 'businessMetadataDefCollection', 'searchVent'));
$('body').addClass("detail-page");
this.collection = new VEntityList([], {});
this.collection.url = UrlLinks.entitiesApiUrl({ guid: this.id, minExtInfo: true });
this.fetchCollection();
},
bindEvents: function() {
var that = this;
......@@ -215,8 +228,34 @@ define(['require',
this.ui.description.hide();
}
}
var tags = {
'self': [],
'propagated': [],
'propagatedMap': {},
'combineMap': {}
};
if (collectionJSON.classifications) {
this.generateTag(collectionJSON.classifications);
var tagObject = collectionJSON.classifications;
_.each(tagObject, function(val) {
var typeName = val.typeName;
if (val.entityGuid === that.id) {
tags['self'].push(val)
} else {
tags['propagated'].push(val);
if (tags.propagatedMap[typeName]) {
tags.propagatedMap[typeName]["count"] += tags.propagatedMap[typeName]["count"];
} else {
tags.propagatedMap[typeName] = val;
tags.propagatedMap[typeName]["count"] = 1;
}
}
if (tags.combineMap[typeName] === undefined) {
tags.combineMap[typeName] = val;
}
});
tags.self = _.sortBy(tags.self, "typeName");
tags.propagated = _.sortBy(tags.propagated, "typeName");
this.generateTag(tags);
} else {
this.generateTag([]);
}
......@@ -243,6 +282,7 @@ define(['require',
guid: this.id,
entityName: this.name,
typeHeaders: this.typeHeaders,
tags: tags,
entityDefCollection: this.entityDefCollection,
fetchCollection: this.fetchCollection.bind(that),
enumDefCollection: this.enumDefCollection,
......@@ -340,6 +380,13 @@ define(['require',
Utils.showTitleLoader(this.$('.page-title .fontLoader'), this.$('.entityDetail'));
this.$('.fontLoader-relative').addClass('show'); // to show tab loader
},
manualRender: function(options) {
if (this.id !== options.id) {
_.extend(this, _.pick(options, 'value', 'id'));
this.collection.url = UrlLinks.entitiesApiUrl({ guid: this.id, minExtInfo: true });
this.fetchCollection();
}
},
onShow: function() {
if (this.value && this.value.tabActive) {
this.$('.nav.nav-tabs').find('[role="' + this.value.tabActive + '"]').addClass('active').siblings().removeClass('active');
......@@ -416,27 +463,18 @@ define(['require',
generateTag: function(tagObject) {
var that = this,
tagData = "",
propagatedTagListData = "",
tag = {
'self': [],
'propagated': []
};
_.each(tagObject, function(val) {
val.entityGuid === that.id ? tag['self'].push(val) : tag['propagated'].push(val);
});
_.each(tag.self, function(val) {
propagatedTagListData = "";
_.each(tagObject.self, function(val) {
tagData += '<span class="btn btn-action btn-sm btn-icon btn-blue" data-id="tagClick"><span>' + val.typeName + '</span><i class="fa fa-close" data-id="deleteTag" data-type="tag" title="Remove Classification"></i></span>';
});
_.each(tag.propagated, function(val) {
var crossButton = '<i class="fa fa-close" data-id="deleteTag" data-entityguid="' + val.entityGuid + '" data-type="tag" title="Remove Classification"></i>';
propagatedTagListData += '<span class="btn btn-action btn-sm btn-icon btn-blue" data-id="tagClick"><span>' + val.typeName + '</span>' + ((that.id !== val.entityGuid && val.entityStatus === "DELETED") ? crossButton : "") + '</span>';
_.each(tagObject.propagatedMap, function(val, key) {
propagatedTagListData += '<span class="btn btn-action btn-sm btn-icon btn-blue"><span data-id="tagClick">' + val.typeName + '</span>' + (val.count > 1 ? '<span class="active" data-id="pTagCountClick">(' + val.count + ')</span>' : "") + '</span>';
});
propagatedTagListData !== "" ? this.ui.propagatedTagDiv.show() : this.ui.propagatedTagDiv.hide();
this.ui.tagList.find("span.btn").remove();
this.ui.propagatedTagList.find("span.btn").remove();
this.ui.tagList.prepend(tagData);
this.ui.propagatedTagList.html(propagatedTagListData);
},
generateTerm: function(data) {
var that = this,
......
dashboardv2/public/js/views/tag/TagDetailTableLayoutView.js
......@@ -42,6 +42,7 @@ define(['require',
/** ui selector cache */
ui: {
detailValue: "[data-id='detailValue']",
tagList: "[data-id='tagList']",
addTag: "[data-id='addTag']",
deleteTag: "[data-id='delete']",
editTag: "[data-id='edit']",
......@@ -75,12 +76,20 @@ define(['require',
* @constructs
*/
initialize: function(options) {
_.extend(this, _.pick(options, 'entity', 'guid', 'entityName', 'fetchCollection', 'enumDefCollection', 'classificationDefCollection'));
_.extend(this, _.pick(options, 'entity', 'guid', 'tags', 'entityName', 'fetchCollection', 'enumDefCollection', 'classificationDefCollection'));
this.collectionObject = this.entity;
this.tagCollection = new VTagList();
var that = this,
tags = _.toArray(this.collectionObject.classifications);
this.tagCollection.fullCollection.reset(tags);
this.allTags = _.sortBy(_.toArray(this.collectionObject.classifications), "typeName");
var paramObj = Utils.getUrlState.getQueryParams();
this.value = { tabActive: "classification", showPC: "true", filter: "all" };
if (paramObj) {
if (paramObj.showPC) {
this.value.showPC = paramObj.showPC;
}
if (paramObj.filter) {
this.value.filter = paramObj.filter;
}
}
this.commonTableOptions = {
collection: this.tagCollection,
includeFilter: false,
......@@ -99,8 +108,81 @@ define(['require',
},
bindEvents: function() {},
onRender: function() {
this.ui.checkPropagtedTag.prop("checked", this.value.showPC === "true");
this.renderFilter();
if (this.tagNotFound === undefined && this.value.filter === "all") {
this.updateCollection(this.value.filter);
}
this.renderTableLayoutView();
},
updateCollection: function(value) {
var newList = null
if (this.value.showPC === "true") {
if (value === "all") {
newList = this.allTags;
} else {
newList = _.filter(this.allTags, function(obj) {
if (obj.typeName === value) {
return true;
}
});
}
} else {
if (value === "all") {
newList = this.tags.self;
} else {
newList = _.filter(this.tags.self, function(obj) {
if (obj.typeName === value) {
return true;
}
});
}
}
this.tagCollection.fullCollection.reset(newList);
if (value) {
this.value["filter"] = value;
this.triggetUrl();
}
},
triggetUrl: function() {
var paramObj = Utils.getUrlState.getQueryParams();
if (paramObj && paramObj.tabActive === "classification") {
Utils.setUrl({
url: '#!/detailPage/' + this.guid,
mergeBrowserUrl: false,
urlParams: this.value,
trigger: false
});
}
},
renderFilter: function() {
var tagName = "<option value='all' selected>All</option>",
that = this;
if (this.value.showPC === "false") {
_.each(this.tags.self, function(val) {
var typeName = val.typeName;
tagName += '<option value="' + typeName + '">' + typeName + '</option>';
});
} else {
_.each(this.tags.combineMap, function(val, key) {
tagName += '<option value="' + key + '">' + key + '</option>';
});
}
this.ui.tagList.html(tagName);
if (this.value.filter && this.ui.tagList.val() !== this.value.filter) {
if (this.ui.tagList.find("option[value='" + this.value.filter + "']").length > 0) {
this.ui.tagList.val(this.value.filter);
this.updateCollection(this.value.filter);
} else {
this.tagNotFound = true;
this.updateCollection("all");
}
}
this.ui.tagList.select2({ placeholder: "Search for tag" }).on("change", function() {
var value = that.ui.tagList.val();
that.updateCollection(value);
});
},
renderTableLayoutView: function() {
var that = this;
require(['utils/TableLayout'], function(TableLayout) {
......@@ -124,7 +206,7 @@ define(['require',
formatter: _.extend({}, Backgrid.CellFormatter.prototype, {
fromRaw: function(rawValue, model) {
if (that.guid !== model.get('entityGuid')) {
var purgeEntityBtn = (Enums.isEntityPurged[model.get('entityStatus')]) ? ' title="Entity not available" disabled' : ' title="Propagated From" data-id="propagatedFromClick"',
var purgeEntityBtn = (Enums.isEntityPurged[model.get('entityStatus')]) ? ' title="Entity not available" disabled' : ' data-id="propagatedFromClick"',
propagtedFrom = ' <span class="btn btn-action btn-sm btn-icon btn-blue" data-guid=' + model.get('entityGuid') + purgeEntityBtn + '><span> Propagated From </span></span>';
return '<a title="" href="#!/tag/tagAttribute/' + model.get('typeName') + '">' + model.get('typeName') + '</a>' + propagtedFrom;
} else {
......@@ -248,17 +330,17 @@ define(['require',
},
onCheckPropagtedTag: function(e) {
var that = this,
tags = _.toArray(that.collectionObject.classifications),
unPropagatedTags = [];
e.stopPropagation();
if (e.target.checked) {
that.tagCollection.fullCollection.reset(tags);
that.tagCollection.fullCollection.reset(this.allTags);
} else {
unPropagatedTags = _.filter(tags, function(val) {
return that.guid === val.entityGuid;
});
that.tagCollection.fullCollection.reset(unPropagatedTags);
that.tagCollection.fullCollection.reset(this.tags.self);
}
this.value.showPC = "" + e.target.checked;
this.value.filter = "all";
this.triggetUrl();
this.renderFilter(e.target.checked);
}
});
return TagDetailTableLayoutView;
......
dashboardv3/public/css/scss/form.scss
......@@ -393,6 +393,11 @@ button {
>span {
padding: 5px;
&.active {
color: $white;
background-color: $tag_color;
}
&:hover {
@include btn-action-hover-effect('default');
}
......
dashboardv3/public/js/main.js
......@@ -51,17 +51,17 @@ require.config({
'deps': ['marionette'],
onNodeCreated: function(node, config, moduleName, url) {
console.log("module " + moduleName + " is about to be loaded");
//console.log("module " + moduleName + " is about to be loaded");
++modulesLoadCount;
showModuleLoader();
node.addEventListener("load", function() {
console.log("module " + moduleName + " has been loaded");
//console.log("module " + moduleName + " has been loaded");
--modulesLoadCount;
hideModuleLoader();
});
node.addEventListener("error", function() {
console.log("module " + moduleName + " could not be loaded");
//console.log("module " + moduleName + " could not be loaded");
--modulesLoadCount;
hideModuleLoader();
});
......
dashboardv3/public/js/router/Router.js
......@@ -177,8 +177,7 @@ define([
detailPage: function(id) {
var that = this;
if (id) {
require(["views/site/Header", "views/detail_page/DetailPageLayoutView", "collection/VEntityList", "views/site/SideNavLayoutView"], function(Header, DetailPageLayoutView, VEntityList, SideNavLayoutView) {
this.entityCollection = new VEntityList([], {});
require(["views/site/Header", "views/detail_page/DetailPageLayoutView", "views/site/SideNavLayoutView"], function(Header, DetailPageLayoutView, SideNavLayoutView) {
var paramObj = Utils.getUrlState.getQueryParams(),
options = _.extend({}, that.preFetchedCollectionLists, that.sharedObj, that.ventObj);
that.renderViewIfNotExists(that.getHeaderOptions(Header));
......@@ -191,9 +190,18 @@ define([
return new SideNavLayoutView(options);
}
});
App.rContent.show(new DetailPageLayoutView(_.extend({ collection: this.entityCollection, id: id, value: paramObj }, options)));
this.entityCollection.url = UrlLinks.entitiesApiUrl({ guid: id, minExtInfo: true });
this.entityCollection.fetch({ reset: true });
var dOptions = _.extend({ id: id, value: paramObj }, options);
that.renderViewIfNotExists({
view: App.rContent,
viewName: "DetailPageLayoutView",
manualRender: function() {
this.view.currentView.manualRender(dOptions);
},
render: function() {
return new DetailPageLayoutView(dOptions);
}
});
});
}
},
......
dashboardv3/public/js/templates/tag/TagDetailTableLayoutView_tmpl.html
......@@ -16,11 +16,12 @@
-->
<div class="position-relative">
<div class="tableOverlay"></div>
<div class="inline-content-fr">
<div class="inline-content-fr clearfix" style="margin-bottom: 10px;">
<div class="inline">
<label class="checkbox-inline btn">
<input type="checkbox" data-id="checkPropagtedTag" class="input" checked="true" name="queryType" value="text" name="check" value="1" /> Show Propagated Classifications</label>
</div>
<div class="pull-left" style="width: 300px;"><select data-id="tagList"></select></div>
</div>
<div id="r_tagTableLayoutView"></div>
</div>
\ No newline at end of file
dashboardv3/public/js/utils/Helper.js
......@@ -366,7 +366,7 @@ define(['require',
});
if ($('body').tooltip) {
$('body').tooltip({
selector: '[title]:not(".select2-selection__choice")',
selector: '[title]:not(".select2-selection__choice,.select2-selection__rendered")',
placement: function() {
return this.$element.attr("data-placement") || "bottom";
},
......
dashboardv3/public/js/views/detail_page/DetailPageLayoutView.js
......@@ -24,8 +24,9 @@ define(['require',
'utils/Globals',
'utils/Enums',
'utils/Messages',
'utils/UrlLinks'
], function(require, Backbone, DetailPageLayoutViewTmpl, Utils, CommonViewFunction, Globals, Enums, Messages, UrlLinks) {
'utils/UrlLinks',
'collection/VEntityList'
], function(require, Backbone, DetailPageLayoutViewTmpl, Utils, CommonViewFunction, Globals, Enums, Messages, UrlLinks, VEntityList) {
'use strict';
var DetailPageLayoutView = Backbone.Marionette.LayoutView.extend(
......@@ -52,6 +53,7 @@ define(['require',
/** ui selector cache */
ui: {
tagClick: '[data-id="tagClick"]',
pTagCountClick: '[data-id="pTagCountClick"]',
termClick: '[data-id="termClick"]',
propagatedTagDiv: '[data-id="propagatedTagDiv"]',
title: '[data-id="title"]',
......@@ -85,6 +87,14 @@ define(['require',
});
}
};
events["click " + this.ui.pTagCountClick] = function(e) {
var tag = $(e.currentTarget).parent().children().first().text();
Utils.setUrl({
url: '#!/detailPage/' + this.id + '?tabActive=classification&filter=' + tag,
mergeBrowserUrl: false,
trigger: true
});
};
events["click " + this.ui.termClick] = function(e) {
if (e.target.nodeName.toLocaleLowerCase() != "i") {
Utils.setUrl({
......@@ -123,6 +133,9 @@ define(['require',
initialize: function(options) {
_.extend(this, _.pick(options, 'value', 'collection', 'id', 'entityDefCollection', 'typeHeaders', 'enumDefCollection', 'classificationDefCollection', 'glossaryCollection', 'businessMetadataDefCollection', 'searchVent'));
$('body').addClass("detail-page");
this.collection = new VEntityList([], {});
this.collection.url = UrlLinks.entitiesApiUrl({ guid: this.id, minExtInfo: true });
this.fetchCollection();
},
bindEvents: function() {
var that = this;
......@@ -219,8 +232,34 @@ define(['require',
this.ui.description.hide();
}
}
var tags = {
'self': [],
'propagated': [],
'propagatedMap': {},
'combineMap': {}
};
if (collectionJSON.classifications) {
this.generateTag(collectionJSON.classifications);
var tagObject = collectionJSON.classifications;
_.each(tagObject, function(val) {
var typeName = val.typeName;
if (val.entityGuid === that.id) {
tags['self'].push(val)
} else {
tags['propagated'].push(val);
if (tags.propagatedMap[typeName]) {
tags.propagatedMap[typeName]["count"] += tags.propagatedMap[typeName]["count"];
} else {
tags.propagatedMap[typeName] = val;
tags.propagatedMap[typeName]["count"] = 1;
}
}
if (tags.combineMap[typeName] === undefined) {
tags.combineMap[typeName] = val;
}
});
tags.self = _.sortBy(tags.self, "typeName");
tags.propagated = _.sortBy(tags.propagated, "typeName");
this.generateTag(tags);
} else {
this.generateTag([]);
}
......@@ -247,6 +286,7 @@ define(['require',
guid: this.id,
entityName: this.name,
typeHeaders: this.typeHeaders,
tags: tags,
entityDefCollection: this.entityDefCollection,
fetchCollection: this.fetchCollection.bind(that),
enumDefCollection: this.enumDefCollection,
......@@ -344,6 +384,13 @@ define(['require',
Utils.showTitleLoader(this.$('.page-title .fontLoader'), this.$('.entityDetail'));
this.$('.fontLoader-relative').addClass('show'); // to show tab loader
},
manualRender: function(options) {
if (this.id !== options.id) {
_.extend(this, _.pick(options, 'value', 'id'));
this.collection.url = UrlLinks.entitiesApiUrl({ guid: this.id, minExtInfo: true });
this.fetchCollection();
}
},
onShow: function() {
if (this.value && this.value.tabActive) {
this.$('.nav.nav-tabs').find('[role="' + this.value.tabActive + '"]').addClass('active').siblings().removeClass('active');
......@@ -420,27 +467,18 @@ define(['require',
generateTag: function(tagObject) {
var that = this,
tagData = "",
propagatedTagListData = "",
tag = {
'self': [],
'propagated': []
};
_.each(tagObject, function(val) {
val.entityGuid === that.id ? tag['self'].push(val) : tag['propagated'].push(val);
});
_.each(tag.self, function(val) {
propagatedTagListData = "";
_.each(tagObject.self, function(val) {
tagData += '<span class="btn btn-action btn-sm btn-icon btn-blue" data-id="tagClick"><span>' + val.typeName + '</span><i class="fa fa-close" data-id="deleteTag" data-type="tag" title="Remove Classification"></i></span>';
});
_.each(tag.propagated, function(val) {
var crossButton = '<i class="fa fa-close" data-id="deleteTag" data-entityguid="' + val.entityGuid + '" data-type="tag" title="Remove Classification"></i>';
propagatedTagListData += '<span class="btn btn-action btn-sm btn-icon btn-blue" data-id="tagClick"><span>' + val.typeName + '</span>' + ((that.id !== val.entityGuid && val.entityStatus === "DELETED") ? crossButton : "") + '</span>';
_.each(tagObject.propagatedMap, function(val, key) {
propagatedTagListData += '<span class="btn btn-action btn-sm btn-icon btn-blue"><span data-id="tagClick">' + val.typeName + '</span>' + (val.count > 1 ? '<span class="active" data-id="pTagCountClick">(' + val.count + ')</span>' : "") + '</span>';
});
propagatedTagListData !== "" ? this.ui.propagatedTagDiv.show() : this.ui.propagatedTagDiv.hide();
this.ui.tagList.find("span.btn").remove();
this.ui.propagatedTagList.find("span.btn").remove();
this.ui.tagList.prepend(tagData);
this.ui.propagatedTagList.html(propagatedTagListData);
},
generateTerm: function(data) {
var that = this,
......
dashboardv3/public/js/views/tag/TagDetailTableLayoutView.js
......@@ -42,6 +42,7 @@ define(['require',
/** ui selector cache */
ui: {
detailValue: "[data-id='detailValue']",
tagList: "[data-id='tagList']",
addTag: "[data-id='addTag']",
deleteTag: "[data-id='delete']",
editTag: "[data-id='edit']",
......@@ -75,12 +76,20 @@ define(['require',
* @constructs
*/
initialize: function(options) {
_.extend(this, _.pick(options, 'entity', 'guid', 'entityName', 'fetchCollection', 'enumDefCollection', 'classificationDefCollection', 'searchVent'));
_.extend(this, _.pick(options, 'entity', 'guid', 'tags', 'entityName', 'fetchCollection', 'enumDefCollection', 'classificationDefCollection', 'searchVent'));
this.collectionObject = this.entity;
this.tagCollection = new VTagList();
var that = this,
tags = _.toArray(this.collectionObject.classifications);
this.tagCollection.fullCollection.reset(tags);
this.allTags = _.sortBy(_.toArray(this.collectionObject.classifications), "typeName");
var paramObj = Utils.getUrlState.getQueryParams();
this.value = { tabActive: "classification", showPC: "true", filter: "all" };
if (paramObj) {
if (paramObj.showPC) {
this.value.showPC = paramObj.showPC;
}
if (paramObj.filter) {
this.value.filter = paramObj.filter;
}
}
this.commonTableOptions = {
collection: this.tagCollection,
includeFilter: false,
......@@ -99,8 +108,81 @@ define(['require',
},
bindEvents: function() {},
onRender: function() {
this.ui.checkPropagtedTag.prop("checked", this.value.showPC === "true");
this.renderFilter();
if (this.tagNotFound === undefined && this.value.filter === "all") {
this.updateCollection(this.value.filter);
}
this.renderTableLayoutView();
},
updateCollection: function(value) {
var newList = null
if (this.value.showPC === "true") {
if (value === "all") {
newList = this.allTags;
} else {
newList = _.filter(this.allTags, function(obj) {
if (obj.typeName === value) {
return true;
}
});
}
} else {
if (value === "all") {
newList = this.tags.self;
} else {
newList = _.filter(this.tags.self, function(obj) {
if (obj.typeName === value) {
return true;
}
});
}
}
this.tagCollection.fullCollection.reset(newList);
if (value) {
this.value["filter"] = value;
this.triggetUrl();
}
},
triggetUrl: function() {
var paramObj = Utils.getUrlState.getQueryParams();
if (paramObj && paramObj.tabActive === "classification") {
Utils.setUrl({
url: '#!/detailPage/' + this.guid,
mergeBrowserUrl: false,
urlParams: this.value,
trigger: false
});
}
},
renderFilter: function() {
var tagName = "<option value='all' selected>All</option>",
that = this;
if (this.value.showPC === "false") {
_.each(this.tags.self, function(val) {
var typeName = val.typeName;
tagName += '<option value="' + typeName + '">' + typeName + '</option>';
});
} else {
_.each(this.tags.combineMap, function(val, key) {
tagName += '<option value="' + key + '">' + key + '</option>';
});
}
this.ui.tagList.html(tagName);
if (this.value.filter && this.ui.tagList.val() !== this.value.filter) {
if (this.ui.tagList.find("option[value='" + this.value.filter + "']").length > 0) {
this.ui.tagList.val(this.value.filter);
this.updateCollection(this.value.filter);
} else {
this.tagNotFound = true;
this.updateCollection("all");
}
}
this.ui.tagList.select2({ placeholder: "Search for tag" }).on("change", function() {
var value = that.ui.tagList.val();
that.updateCollection(value);
});
},
renderTableLayoutView: function() {
var that = this;
require(['utils/TableLayout'], function(TableLayout) {
......@@ -124,7 +206,7 @@ define(['require',
formatter: _.extend({}, Backgrid.CellFormatter.prototype, {
fromRaw: function(rawValue, model) {
if (that.guid !== model.get('entityGuid')) {
var purgeEntityBtn = (Enums.isEntityPurged[model.get('entityStatus')]) ? ' title="Entity not available" disabled' : ' title="Propagated From" data-id="propagatedFromClick"',
var purgeEntityBtn = (Enums.isEntityPurged[model.get('entityStatus')]) ? ' title="Entity not available" disabled' : ' data-id="propagatedFromClick"',
propagtedFrom = ' <span class="btn btn-action btn-sm btn-icon btn-blue" data-guid=' + model.get('entityGuid') + purgeEntityBtn + '><span> Propagated From </span></span>';
return '<a title="" href="#!/tag/tagAttribute/' + model.get('typeName') + '">' + model.get('typeName') + '</a>' + propagtedFrom;
} else {
......@@ -251,17 +333,17 @@ define(['require',
},
onCheckPropagtedTag: function(e) {
var that = this,
tags = _.toArray(that.collectionObject.classifications),
unPropagatedTags = [];
e.stopPropagation();
if (e.target.checked) {
that.tagCollection.fullCollection.reset(tags);
that.tagCollection.fullCollection.reset(this.allTags);
} else {
unPropagatedTags = _.filter(tags, function(val) {
return that.guid === val.entityGuid;
});
that.tagCollection.fullCollection.reset(unPropagatedTags);
that.tagCollection.fullCollection.reset(this.tags.self);
}
this.value.showPC = "" + e.target.checked;
this.value.filter = "all";
this.triggetUrl();
this.renderFilter(e.target.checked);
}
});
return TagDetailTableLayoutView;
......
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