Commit 153fc362 by Hemanth Yamijala

ATLAS-812 Atlas UI - Associate Terms with Assets (kevalbhatt18 via yhemanth)

parent 74d9b3fb
...@@ -93,6 +93,7 @@ ...@@ -93,6 +93,7 @@
.select2-container--default .select2-selection--multiple .select2-selection__choice { .select2-container--default .select2-selection--multiple .select2-selection__choice {
background-color: #fff; background-color: #fff;
color: #9599a0; color: #9599a0;
border: 1px solid $tag_color;
} }
.select2-container--default .select2-search--inline .select2-search__field { .select2-container--default .select2-search--inline .select2-search__field {
...@@ -206,7 +207,17 @@ form-control .tagInpput { ...@@ -206,7 +207,17 @@ form-control .tagInpput {
margin-top: 15px; margin-top: 15px;
} }
// .select2-container--default .select2-selection--multiple { .attributeText {
// background-color: #f6f7fb; color: $color_star_dust_approx;
// border: 1px #e8e9ee solid; }
// }
.termTagLine {
border-top: 1px solid $action_gray;
}
.tagTerm {
margin-top: 10px;
div {
display: inline-block;
}
}
...@@ -42,6 +42,7 @@ ...@@ -42,6 +42,7 @@
text-overflow: ellipsis; text-overflow: ellipsis;
max-width: 91%; max-width: 91%;
overflow: hidden; overflow: hidden;
display: inline-block;
small { small {
position: relative; position: relative;
bottom: 5px; bottom: 5px;
......
<!--
* Licensed to the Apache Software Foundation (ASF) under one or more
* contributor license agreements. See the NOTICE file distributed with
* this work for additional information regarding copyright ownership.
* The ASF licenses this file to You under the Apache License, Version 2.0
* (the "License"); you may not use this file except in compliance with
* the License. You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
-->
<div class="row">
<div name="tagDefinitionform" class="css-form">
<div class="form-group">
<label class="control-label col-sm-4">Term</label>
<div class="col-sm-8 input-spacing">
<select class="form-control" data-id="addTermOptions" required>
</select>
</div>
</div>
</div>
</div>
</div>
...@@ -14,7 +14,7 @@ ...@@ -14,7 +14,7 @@
* 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.
--> -->
<form name="tagDefinitionform" class="css-form"> <form name="tagDefinitionform" class="css-form" onsubmit="return false;">
<!-- <h4 style="margin-bottom:30px">Add Term</h4> --> <!-- <h4 style="margin-bottom:30px">Add Term</h4> -->
<div class="form-group"> <div class="form-group">
<input class="form-control" data-id="termName" placeholder="Add subterm"> <input class="form-control" data-id="termName" placeholder="Add subterm">
......
...@@ -26,18 +26,17 @@ ...@@ -26,18 +26,17 @@
<button class="btn-atlas" data-id="publishButton">Publish</button> <button class="btn-atlas" data-id="publishButton">Publish</button>
</div> </div>
</div> </div>
<div data-id="inputTagging"> <div class="tagTerm">
<div class="dropdown addTag-dropdown" data-id="addTagListBtn"> <div class="" data-id="tagList">
<div class=" addTagBase dropdown-toggle" data-id="addTagBtn" data-toggle="dropdown"> <div class="addTag-dropdown" data-id="addTag">
<div class="addTagText" data-id="addTagtext" style="display: block">ADD TAG &nbsp; <i class="fa fa-plus"></i></div> <div class="addTagBase tagBox" data-id="addTagPlus"> Add Tag <i class="fa fa-plus"></i></div>
<div class="addTagPlus" data-id="addTagPlus" style="display: none"><i class="fa fa-plus"></i></div>
</div> </div>
<!-- <div class="dropdown-menu menuItem" data-id="addTagCollection">
<div data-id="searchTag" class="searchTag row-margin-bottom">
<input placeholder="Search" type=search class="inputSearchTag form-control"></input>
</div> </div>
<div class="appendList" data-id="appendList"></div> <hr class=" termTagLine">
</div> --> <div class="" data-id="termList">
<div class="addTag-dropdown" data-id="addTerm">
<div class="addTagBase termBox" data-id="addTermPlus"> Add Term <i class="fa fa-plus"></i></div>
</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -57,7 +56,8 @@ ...@@ -57,7 +56,8 @@
<ul class="nav nav-tabs" role="tablist"> <ul class="nav nav-tabs" role="tablist">
<li role="presentation" class="tab active"><a href="#tab-details" aria-controls="tab-details" role="tab" data-toggle="tab">Properties</a></li> <li role="presentation" class="tab active"><a href="#tab-details" aria-controls="tab-details" role="tab" data-toggle="tab">Properties</a></li>
<!-- <li role="presentation"><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab">Acceptable Use</a></li> --> <!-- <li role="presentation"><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab">Acceptable Use</a></li> -->
<li role="presentation"><a href="#tab-tagTable" aria-controls="tab-tagTable" role="tab" data-toggle="tab">Tag Attribute</a></li> <li role="presentation"><a href="#tab-tagTable" aria-controls="tab-tagTable" role="tab" data-toggle="tab">Tags</a></li>
<li role="presentation"><a href="#tab-termTable" aria-controls="tab-termTable" role="tab" data-toggle="tab">Terms</a></li>
<li role="presentation" class="tab schemaTable" style="display:none"><a href="#tab-schema" aria-controls="tab-schema" role="tab" data-toggle="tab">Schema</a></li> <li role="presentation" class="tab schemaTable" style="display:none"><a href="#tab-schema" aria-controls="tab-schema" role="tab" data-toggle="tab">Schema</a></li>
</ul> </ul>
<div class="tab-content"> <div class="tab-content">
...@@ -67,6 +67,9 @@ ...@@ -67,6 +67,9 @@
<div id="tab-tagTable" role="tabpanel" class="tab-pane"> <div id="tab-tagTable" role="tabpanel" class="tab-pane">
<div id="r_tagTableLayoutView"></div> <div id="r_tagTableLayoutView"></div>
</div> </div>
<div id="tab-termTable" role="tabpanel" class="tab-pane">
<div id="r_termTableLayoutView"></div>
</div>
<div id="tab-schema" role="tabpanel" class="tab-pane"> <div id="tab-schema" role="tabpanel" class="tab-pane">
<div id="r_schemaTableLayoutView"></div> <div id="r_schemaTableLayoutView"></div>
</div> </div>
......
...@@ -18,5 +18,5 @@ ...@@ -18,5 +18,5 @@
<div class="fontLoader"> <div class="fontLoader">
<i class="fa fa-refresh fa-spin-custom"></i> <i class="fa fa-refresh fa-spin-custom"></i>
</div> </div>
<div id="r_entityTableLayoutView" class=""></div> <div id="r_searchResultTableLayoutView" class="searchTable"></div>
</div> </div>
...@@ -23,8 +23,8 @@ ...@@ -23,8 +23,8 @@
<table class="table table-quickMenu"> <table class="table table-quickMenu">
<thead> <thead>
<tr> <tr>
<th>Tag</th> <th class="tagTermheading">Tag</th>
<th>Attribute</th> <th>Attributes</th>
<th>Tools</th> <th>Tools</th>
</tr> </tr>
</thead> </thead>
......
...@@ -17,11 +17,12 @@ ...@@ -17,11 +17,12 @@
<form name="tagDefinitionform" class="css-form"> <form name="tagDefinitionform" class="css-form">
<!-- <h4 style="margin-bottom:30px"></h4> --> <!-- <h4 style="margin-bottom:30px"></h4> -->
<div class="form-group"> <div class="form-group">
<input class="form-control row-margin-bottom" data-id="tagName" placeholder="Create tag"> <input class="form-control row-margin-bottom" data-id="tagName" placeholder="Name(required)">
</input> </input>
<input class="form-control row-margin-bottom" data-id="description" placeholder="Description"> <input class="form-control row-margin-bottom" data-id="description" placeholder="Description">
</input> </input>
<span class="row-margin-bottom">Parent Tag</span> <span class="row-margin-bottom">Select tags to inherit attributes(optional)</span>
<p class="attributeText">Attributes define additional properties for the tag</p>
<select class="form-control tagList" data-id="parentTag" multiple="multiple"></select> <select class="form-control tagList" data-id="parentTag" multiple="multiple"></select>
</div> </div>
</form> </form>
...@@ -23,8 +23,13 @@ define(['require', 'utils/Utils', 'modules/Modal'], function(require, Utils, Mod ...@@ -23,8 +23,13 @@ define(['require', 'utils/Utils', 'modules/Modal'], function(require, Utils, Mod
CommonViewFunction.deleteTagModel = function(tagName) { CommonViewFunction.deleteTagModel = function(tagName) {
var msg = "<b>Tag:</b>"; var msg = "<b>Tag:</b>";
if (tagName) { if (tagName) {
var tagOrTerm = Utils.checkTagOrTerm(tagName);
if (tagOrTerm.term) {
msg = "<b>Term: " + tagName + "</b>";
} else {
msg = "<b>Tag: " + tagName + "</b>"; msg = "<b>Tag: " + tagName + "</b>";
} }
}
var modal = new Modal({ var modal = new Modal({
title: 'Are you sure you want to delete ?', title: 'Are you sure you want to delete ?',
okText: 'Delete', okText: 'Delete',
...@@ -39,12 +44,29 @@ define(['require', 'utils/Utils', 'modules/Modal'], function(require, Utils, Mod ...@@ -39,12 +44,29 @@ define(['require', 'utils/Utils', 'modules/Modal'], function(require, Utils, Mod
CommonViewFunction.deleteTag = function(options) { CommonViewFunction.deleteTag = function(options) {
require(['models/VTag'], function(VTag) { require(['models/VTag'], function(VTag) {
var tagModel = new VTag(); var tagModel = new VTag();
if (options && options.guid && options.tagName) if (options && options.guid && options.tagName) {
tagModel.deleteTag(options.guid, options.tagName, { tagModel.deleteTag(options.guid, options.tagName, {
beforeSend: function() {}, beforeSend: function() {},
success: function(data) { success: function(data) {
var msg = "Tag " + name.name + " has been deleted successfully";
if (data.traitName) {
var tagOrTerm = Utils.checkTagOrTerm(data.traitName);
if (tagOrTerm.term) {
msg = "Term " + data.traitName + " has been deleted successfully";
} else {
msg = "Tag " + data.traitName + " has been deleted successfully";
}
} else {
var tagOrTerm = Utils.checkTagOrTerm(options.tagName);
if (tagOrTerm.term) {
msg = "Term " + data.traitName + " has been deleted successfully";
} else {
msg = "Tag " + data.traitName + " has been deleted successfully";
}
}
Utils.notifySuccess({ Utils.notifySuccess({
content: "Tag " + options.tagName + " has been deleted successfully" content: msg
}); });
if (options.callback) { if (options.callback) {
options.callback(); options.callback();
...@@ -55,7 +77,7 @@ define(['require', 'utils/Utils', 'modules/Modal'], function(require, Utils, Mod ...@@ -55,7 +77,7 @@ define(['require', 'utils/Utils', 'modules/Modal'], function(require, Utils, Mod
}, },
error: function(error, data, status) { error: function(error, data, status) {
var message = "Tag " + options.tagName + " could not be deleted"; var message = options.tagName + " could not be deleted";
if (data.error) { if (data.error) {
message = data.error; message = data.error;
} }
...@@ -65,6 +87,7 @@ define(['require', 'utils/Utils', 'modules/Modal'], function(require, Utils, Mod ...@@ -65,6 +87,7 @@ define(['require', 'utils/Utils', 'modules/Modal'], function(require, Utils, Mod
}, },
complete: function() {} complete: function() {}
}); });
}
}); });
}; };
return CommonViewFunction; return CommonViewFunction;
......
...@@ -225,5 +225,19 @@ define(['require', 'utils/Globals'], function(require, Globals) { ...@@ -225,5 +225,19 @@ define(['require', 'utils/Globals'], function(require, Globals) {
} }
} }
} }
Utils.checkTagOrTerm = function(value) {
var name = value.split('.');
if (name.length > 1) {
return {
term: true,
name: name[name.length - 1]
}
} else {
return {
term: false,
name: name[name.length - 1]
}
}
}
return Utils; return Utils;
}); });
/**
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership. The ASF licenses this file
* to you under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance
* with the License. You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
define(['require',
'backbone',
'hbs!tmpl/business_catalog/AddTermToEntityLayoutView_tmpl',
'utils/Utils',
'modules/Modal',
'collection/VCatalogList'
], function(require, Backbone, AddTermToEntityLayoutViewTmpl, Utils, Modal, VCatalogList) {
'use strict';
var AddTermToEntityLayoutView = Backbone.Marionette.LayoutView.extend(
/** @lends AddTermToEntityLayoutView */
{
_viewName: 'AddTermToEntityLayoutView',
template: AddTermToEntityLayoutViewTmpl,
/** Layout sub regions */
regions: {},
/** ui selector cache */
ui: {
termName: '[data-id="termName"]',
addTermOptions: '[data-id="addTermOptions"]'
},
/** ui events hash */
events: function() {
var events = {};
return events;
},
/**
* intialize a new AddTermToEntityLayoutView Layout
* @constructs
*/
initialize: function(options) {
_.extend(this, _.pick(options, 'guid', 'modalCollection', 'callback'));
this.vCatalogList = new VCatalogList();
var that = this;
this.modal = new Modal({
title: 'Add Term',
content: this,
okText: 'Save',
cancelText: "Cancel",
allowCancel: true,
}).open();
this.on('ok', function() {
that.saveTermToAsset();
});
this.on('closeModal', function() {
this.modal.trigger('cancel');
});
this.fetchTaxonomy = true;
this.bindEvents();
},
bindEvents: function() {
this.listenTo(this.vCatalogList, 'reset', function() {
var url = "",
that = this;
_.each(this.vCatalogList.models, function(obj) {
if (that.fetchTaxonomy && obj.get('href').search("terms") == -1) {
url = obj.get('href');
that.fetchTaxonomy = false;
}
});
if (url.length == 0) {
this.generateTerm();
} else {
url = "/api" + url.split("/api")[1] + "/terms";
this.fetchTerms(url);
}
}, this);
},
onRender: function() {
this.fetchTerms();
},
fetchTerms: function(url) {
if (url) {
this.vCatalogList.url = url;
}
this.vCatalogList.fetch({ reset: true });
},
generateTerm: function() {
var terms = '<option selected="selected" disabled="disabled">-- Select Term --</option>';
_.each(this.vCatalogList.fullCollection.models, function(obj, key) {
terms += '<option value="' + obj.get('name') + '">' + obj.get('name') + '</option>';
});
this.ui.addTermOptions.html(terms);
},
saveTermToAsset: function() {
var that = this;
var VCatalog = new this.vCatalogList.model();
VCatalog.url = function() {
return "api/atlas/v1/entities/" + that.guid + "/tags/" + that.ui.addTermOptions.val();
}
VCatalog.save(null, {
beforeSend: function() {},
success: function(data) {
Utils.notifySuccess({
content: "Term " + that.ui.addTermOptions.val() + " has been added to entity"
});
if (that.callback) {
that.callback();
}
if (that.modalCollection) {
that.modalCollection.fetch({ reset: true });
}
},
error: function(error, data, status) {
if (data && data.responseText) {
var data = JSON.parse(data.responseText);
Utils.notifyError({
content: data.message
});
}
},
complete: function() {}
});
}
});
return AddTermToEntityLayoutView;
});
...@@ -103,7 +103,8 @@ define(['require', ...@@ -103,7 +103,8 @@ define(['require',
createdDate = this.model.get('creation_time'); createdDate = this.model.get('creation_time');
if (name) { if (name) {
this.ui.title.show(); this.ui.title.show();
this.ui.title.html('<span>' + name + '</span>'); var termName = Utils.checkTagOrTerm(name);
this.ui.title.html('<span>' + termName.name + '</span>');
} else { } else {
this.ui.title.hide(); this.ui.title.hide();
} }
......
...@@ -22,8 +22,9 @@ define(['require', ...@@ -22,8 +22,9 @@ define(['require',
'utils/Utils', 'utils/Utils',
'collection/VTagList', 'collection/VTagList',
'models/VEntity', 'models/VEntity',
'utils/CommonViewFunction' 'utils/CommonViewFunction',
], function(require, Backbone, DetailPageLayoutViewTmpl, Utils, VTagList, VEntity, CommonViewFunction) { 'utils/Globals'
], function(require, Backbone, DetailPageLayoutViewTmpl, Utils, VTagList, VEntity, CommonViewFunction, Globals) {
'use strict'; 'use strict';
var DetailPageLayoutView = Backbone.Marionette.LayoutView.extend( var DetailPageLayoutView = Backbone.Marionette.LayoutView.extend(
...@@ -39,6 +40,8 @@ define(['require', ...@@ -39,6 +40,8 @@ define(['require',
RSchemaTableLayoutView: "#r_schemaTableLayoutView", RSchemaTableLayoutView: "#r_schemaTableLayoutView",
RTagTableLayoutView: "#r_tagTableLayoutView", RTagTableLayoutView: "#r_tagTableLayoutView",
RLineageLayoutView: "#r_lineageLayoutView", RLineageLayoutView: "#r_lineageLayoutView",
RTermTableLayoutView: "#r_termTableLayoutView"
}, },
/** ui selector cache */ /** ui selector cache */
ui: { ui: {
...@@ -53,15 +56,12 @@ define(['require', ...@@ -53,15 +56,12 @@ define(['require',
createDate: '[data-id="createDate"]', createDate: '[data-id="createDate"]',
updateDate: '[data-id="updateDate"]', updateDate: '[data-id="updateDate"]',
createdUser: '[data-id="createdUser"]', createdUser: '[data-id="createdUser"]',
addTagBtn: '[data-id="addTagBtn"]',
appendList: '[data-id="appendList"]',
inputTagging: '[data-id="inputTagging"]',
deleteTag: '[data-id="deleteTag"]', deleteTag: '[data-id="deleteTag"]',
addTagtext: '[data-id="addTagtext"]', backButton: "[data-id='backButton']",
addTagPlus: '[data-id="addTagPlus"]', addTag: '[data-id="addTag"]',
searchTag: '[data-id="searchTag"] input', addTerm: '[data-id="addTerm"]',
addTagListBtn: '[data-id="addTagListBtn"]', tagList: '[data-id="tagList"]',
backButton: "[data-id='backButton']" termList: '[data-id="termList"]'
}, },
/** ui events hash */ /** ui events hash */
events: function() { events: function() {
...@@ -77,20 +77,29 @@ define(['require', ...@@ -77,20 +77,29 @@ define(['require',
}; };
events["click " + this.ui.tagClick] = function(e) { events["click " + this.ui.tagClick] = function(e) {
if (e.target.nodeName.toLocaleLowerCase() != "i") { if (e.target.nodeName.toLocaleLowerCase() != "i") {
var scope = $(e.currentTarget);
if (scope.hasClass('term')) {
var url = scope.data('href').split(".").join("/terms/");
Globals.saveApplicationState.tabState.stateChanged = false;
Utils.setUrl({
url: '#!/taxonomy/detailCatalog/api/atlas/v1/taxonomies/' + url,
mergeBrowserUrl: false,
trigger: true
});
} else {
Utils.setUrl({ Utils.setUrl({
url: '#!/tag/tagAttribute/' + e.currentTarget.textContent, url: '#!/tag/tagAttribute/' + e.currentTarget.textContent,
mergeBrowserUrl: false, mergeBrowserUrl: false,
trigger: true trigger: true
}); });
} }
}
}; };
// events["click " + this.ui.publishButton] = 'onPublishButtonClick'; // events["click " + this.ui.publishButton] = 'onPublishButtonClick';
events["click " + this.ui.cancelButton] = 'onCancelButtonClick'; events["click " + this.ui.cancelButton] = 'onCancelButtonClick';
events["click " + this.ui.deleteTag] = 'onClickTagCross'; events["click " + this.ui.deleteTag] = 'onClickTagCross';
// events["keyup " + this.ui.searchTag] = function(e) { events["click " + this.ui.addTag] = 'onClickAddTagBtn';
// // this.offlineSearchTag(e); events["click " + this.ui.addTerm] = 'onClickAddTermBtn';
// };
events["click " + this.ui.addTagListBtn] = 'onClickAddTagBtn';
events['click ' + this.ui.backButton] = function() { events['click ' + this.ui.backButton] = function() {
Backbone.history.history.back(); Backbone.history.history.back();
}; };
...@@ -145,9 +154,6 @@ define(['require', ...@@ -145,9 +154,6 @@ define(['require',
} }
if (collectionJSON[0].traits) { if (collectionJSON[0].traits) {
this.tagElement = _.keys(collectionJSON[0].traits); this.tagElement = _.keys(collectionJSON[0].traits);
this.ui.addTagtext.hide();
this.ui.addTagPlus.show();
this.ui.inputTagging.find('.inputTag').remove();
this.addTagToTerms(this.tagElement); this.addTagToTerms(this.tagElement);
} }
} }
...@@ -156,20 +162,20 @@ define(['require', ...@@ -156,20 +162,20 @@ define(['require',
this.renderTagTableLayoutView(tagGuid); this.renderTagTableLayoutView(tagGuid);
this.renderLineageLayoutView(tagGuid); this.renderLineageLayoutView(tagGuid);
this.renderSchemaLayoutView(tagGuid); this.renderSchemaLayoutView(tagGuid);
this.renderTermTableLayoutView(tagGuid);
}, this); }, this);
}, },
onRender: function() { onRender: function() {
var that = this; var that = this;
this.ui.editBox.hide(); this.ui.editBox.hide();
this.ui.appendList.on('click', 'div', function(e) { /* this.ui.appendList.on('click', 'div', function(e) {
if (e.target.nodeName == "INPUT") { if (e.target.nodeName == "INPUT") {
return false; return false;
} }
that.ui.addTagtext.hide(); that.ui.addTagtext.hide();
that.ui.addTagPlus.show(); that.ui.addTagPlus.show();
// that.addTagToTerms([$(this).text()]);
that.saveTagFromList($(this)); that.saveTagFromList($(this));
}); });*/
}, },
fetchCollection: function() { fetchCollection: function() {
this.collection.fetch({ reset: true }); this.collection.fetch({ reset: true });
...@@ -202,11 +208,21 @@ define(['require', ...@@ -202,11 +208,21 @@ define(['require',
}); });
}, },
addTagToTerms: function(tagObject) { addTagToTerms: function(tagObject) {
var tagData = ""; var tagData = "",
termData = "";
_.each(tagObject, function(val) { _.each(tagObject, function(val) {
var isTerm = Utils.checkTagOrTerm(val);
if (!isTerm.term) {
tagData += '<span class="inputTag" data-id="tagClick">' + val + '<i class="fa fa-close" data-id="deleteTag"></i></span>'; tagData += '<span class="inputTag" data-id="tagClick">' + val + '<i class="fa fa-close" data-id="deleteTag"></i></span>';
}
if (isTerm.term) {
termData += '<span class="inputTag term" data-id="tagClick" data-href="' + val + '">' + val + '<i class="fa fa-close" data-id="deleteTag"></i></span>';
}
}); });
this.$('.addTag-dropdown').before(tagData); this.ui.tagList.find("span.inputTag").remove();
this.ui.termList.find("span.inputTag").remove();
this.ui.tagList.prepend(tagData);
this.ui.termList.prepend(termData);
}, },
saveTagFromList: function(ref) { saveTagFromList: function(ref) {
var that = this; var that = this;
...@@ -246,6 +262,20 @@ define(['require', ...@@ -246,6 +262,20 @@ define(['require',
}*/ }*/
}); });
}, },
onClickAddTermBtn: function(e) {
var that = this;
require([
'views/business_catalog/AddTermToEntityLayoutView',
], function(AddTermToEntityLayoutView) {
var view = new AddTermToEntityLayoutView({
guid: that.id,
callback: function() {
that.fetchCollection();
}
});
});
},
renderEntityDetailTableLayoutView: function() { renderEntityDetailTableLayoutView: function() {
var that = this; var that = this;
require(['views/entity/EntityDetailTableLayoutView'], function(EntityDetailTableLayoutView) { require(['views/entity/EntityDetailTableLayoutView'], function(EntityDetailTableLayoutView) {
...@@ -282,6 +312,17 @@ define(['require', ...@@ -282,6 +312,17 @@ define(['require',
guid: tagGuid guid: tagGuid
})); }));
}); });
},
renderTermTableLayoutView: function(tagGuid) {
var that = this;
require(['views/tag/TagDetailTableLayoutView'], function(TagDetailTableLayoutView) {
that.RTermTableLayoutView.show(new TagDetailTableLayoutView({
globalVent: that.globalVent,
collection: that.collection,
guid: tagGuid,
term: true
}));
});
} }
}); });
return DetailPageLayoutView; return DetailPageLayoutView;
......
...@@ -40,14 +40,15 @@ define(['require', ...@@ -40,14 +40,15 @@ define(['require',
ui: { ui: {
tagClick: '[data-id="tagClick"]', tagClick: '[data-id="tagClick"]',
addTag: "[data-id='addTag']", addTag: "[data-id='addTag']",
addTerm: '[data-id="addTerm"]'
}, },
/** ui events hash */ /** ui events hash */
events: function() { events: function() {
var events = {}; var events = {};
events["click " + this.ui.addTag] = function(e) { events["click " + this.ui.addTag] = 'addTagModalView';
this.onClickSchemaTag(e); events["click " + this.ui.addTerm] = 'addTermModalView';
},
events["click " + this.ui.tagClick] = function(e) { events["click " + this.ui.tagClick] = function(e) {
if (e.target.nodeName.toLocaleLowerCase() == "i") { if (e.target.nodeName.toLocaleLowerCase() == "i") {
this.onClickTagCross(e); this.onClickTagCross(e);
...@@ -170,18 +171,44 @@ define(['require', ...@@ -170,18 +171,44 @@ define(['require',
var traits = model.get('$traits$'); var traits = model.get('$traits$');
var atags = ""; var atags = "";
_.keys(model.get('$traits$')).map(function(key) { _.keys(model.get('$traits$')).map(function(key) {
var tagName = Utils.checkTagOrTerm(traits[key].$typeName$);
if (!tagName.term) {
atags += '<a class="inputTag" data-id="tagClick">' + traits[key].$typeName$ + '<i class="fa fa-times" data-id="delete" data-name="' + traits[key].$typeName$ + '" data-guid="' + model.get('$id$').id + '" ></i></a>'; atags += '<a class="inputTag" data-id="tagClick">' + traits[key].$typeName$ + '<i class="fa fa-times" data-id="delete" data-name="' + traits[key].$typeName$ + '" data-guid="' + model.get('$id$').id + '" ></i></a>';
}
}); });
return '<div class="tagList">' + atags + '<a href="javascript:void(0);" class="inputTag" data-id="addTag" data-guid="' + model.get('$id$').id + '"><i style="right:0" class="fa fa-plus"></i></a></div>'; return '<div class="tagList">' + atags + '<a href="javascript:void(0);" class="inputTag" data-id="addTag" data-guid="' + model.get('$id$').id + '"><i style="right:0" class="fa fa-plus"></i></a></div>';
} }
}) })
}; };
col['terms'] = {
label: "Terms",
cell: "Html",
editable: false,
sortable: false,
orderable: true,
formatter: _.extend({}, Backgrid.CellFormatter.prototype, {
fromRaw: function(rawValue, model) {
var traits = model.get('$traits$');
var aterms = "";
_.keys(model.get('$traits$')).map(function(key) {
var tagName = Utils.checkTagOrTerm(traits[key].$typeName$);
if (tagName.term) {
aterms += '<a class="inputTag" data-id="tagClick">' + traits[key].$typeName$ + '<i class="fa fa-times" data-id="delete" data-name="' + traits[key].$typeName$ + '" data-guid="' + model.get('$id$').id + '" ></i></a>';
}
});
return '<div class="tagList">' + aterms + '<a href="javascript:void(0);" class="inputTag" data-id="addTerm" data-guid="' + model.get('$id$').id + '"><i style="right:0" class="fa fa-plus"></i></a></div>';
}
})
};
} }
return this.schemaCollection.constructor.getTableCols(col, this.schemaCollection); return this.schemaCollection.constructor.getTableCols(col, this.schemaCollection);
}, },
onClickSchemaTag: function(e) { addTagModalView: function(e) {
if (e) {
e.stopPropagation();
}
var that = this; var that = this;
require(['views/tag/addTagModalView'], function(AddTagModalView) { require(['views/tag/addTagModalView'], function(AddTagModalView) {
var view = new AddTagModalView({ var view = new AddTagModalView({
...@@ -195,6 +222,23 @@ define(['require', ...@@ -195,6 +222,23 @@ define(['require',
// } // }
}); });
}, },
addTermModalView: function(e) {
if (e) {
e.stopPropagation();
}
var that = this;
require([
'views/business_catalog/AddTermToEntityLayoutView',
], function(AddTermToEntityLayoutView) {
var view = new AddTermToEntityLayoutView({
guid: that.$(e.currentTarget).data("guid"),
callback: function() {
that.fetchCollection();
}
});
});
},
onClickTagCross: function(e) { onClickTagCross: function(e) {
var tagName = $(e.target).data("name"), var tagName = $(e.target).data("name"),
that = this, that = this,
......
...@@ -39,13 +39,14 @@ define(['require', ...@@ -39,13 +39,14 @@ define(['require',
regions: { regions: {
RTagLayoutView: "#r_tagLayoutView", RTagLayoutView: "#r_tagLayoutView",
RSearchLayoutView: "#r_searchLayoutView", RSearchLayoutView: "#r_searchLayoutView",
REntityTableLayoutView: "#r_entityTableLayoutView", REntityTableLayoutView: "#r_searchResultTableLayoutView",
}, },
/** ui selector cache */ /** ui selector cache */
ui: { ui: {
tagClick: '[data-id="tagClick"]', tagClick: '[data-id="tagClick"]',
addTag: '[data-id="addTag"]', addTag: '[data-id="addTag"]',
addTerm: '[data-id="addTerm"]'
}, },
/** ui events hash */ /** ui events hash */
...@@ -55,16 +56,27 @@ define(['require', ...@@ -55,16 +56,27 @@ define(['require',
if (e.target.nodeName.toLocaleLowerCase() == "i") { if (e.target.nodeName.toLocaleLowerCase() == "i") {
this.onClickTagCross(e); this.onClickTagCross(e);
} else { } else {
var scope = $(e.currentTarget);
if (scope.hasClass('term')) {
var url = scope.data('href').split(".").join("/terms/");
Globals.saveApplicationState.tabState.stateChanged = false;
Utils.setUrl({
url: '#!/taxonomy/detailCatalog/api/atlas/v1/taxonomies/' + url,
mergeBrowserUrl: false,
trigger: true
});
} else {
Utils.setUrl({ Utils.setUrl({
url: '#!/tag/tagAttribute/' + e.currentTarget.text, url: '#!/tag/tagAttribute/' + e.currentTarget.text,
mergeBrowserUrl: false, mergeBrowserUrl: false,
trigger: true trigger: true
}); });
} }
}
}; };
events["click " + this.ui.addTag] = function(e) { events["click " + this.ui.addTag] = 'addTagModalView';
this.addModalView(e); events["click " + this.ui.addTerm] = 'addTermModalView';
};
events["click " + this.ui.tagCrossIcon] = function(e) {}; events["click " + this.ui.tagCrossIcon] = function(e) {};
return events; return events;
}, },
...@@ -135,7 +147,7 @@ define(['require', ...@@ -135,7 +147,7 @@ define(['require',
}, },
fetchCollection: function(value) { fetchCollection: function(value) {
this.$('.fontLoader').show(); this.$('.fontLoader').show();
this.$('.entityTable').hide(); this.$('.searchTable').hide();
if (value) { if (value) {
if (value.searchType) { if (value.searchType) {
this.searchCollection.url = "/api/atlas/discovery/search/" + value.searchType; this.searchCollection.url = "/api/atlas/discovery/search/" + value.searchType;
...@@ -183,7 +195,7 @@ define(['require', ...@@ -183,7 +195,7 @@ define(['require',
checkTableFetch: function() { checkTableFetch: function() {
if (this.fetchList <= 0) { if (this.fetchList <= 0) {
this.$('.fontLoader').hide(); this.$('.fontLoader').hide();
this.$('.entityTable').show(); this.$('.searchTable').show();
} }
}, },
getEntityTableColumns: function() { getEntityTableColumns: function() {
...@@ -244,7 +256,10 @@ define(['require', ...@@ -244,7 +256,10 @@ define(['require',
var atags = "", var atags = "",
addTag = ""; addTag = "";
_.keys(model.get('$traits$')).map(function(key) { _.keys(model.get('$traits$')).map(function(key) {
atags += '<a class="inputTag" data-id="tagClick">' + traits[key].$typeName$ + '<i class="fa fa-times" data-id="delete" data-name="' + traits[key].$typeName$ + '" data-guid="' + model.get('$id$').id + '" ></i></a>'; var tagName = Utils.checkTagOrTerm(traits[key].$typeName$);
if (!tagName.term) {
atags += '<a class="inputTag" data-id="tagClick">' + traits[key].$typeName$ + '<i class="fa fa-times" data-id="delete" data-name="' + tagName.name + '" data-guid="' + model.get('$id$').id + '" ></i></a>';
}
}); });
if (model.get('$id$')) { if (model.get('$id$')) {
addTag += '<a href="javascript:void(0)" data-id="addTag" class="inputTag" data-guid="' + model.get('$id$').id + '" ><i style="right:0" class="fa fa-plus"></i></a>'; addTag += '<a href="javascript:void(0)" data-id="addTag" class="inputTag" data-guid="' + model.get('$id$').id + '" ><i style="right:0" class="fa fa-plus"></i></a>';
...@@ -256,12 +271,31 @@ define(['require', ...@@ -256,12 +271,31 @@ define(['require',
} }
}) })
}; };
col['taxonomy'] = { col['terms'] = {
label: "Taxonomy", label: "Terms",
cell: "Html", cell: "Html",
editable: false, editable: false,
sortable: false, sortable: false,
orderable: true, orderable: true,
formatter: _.extend({}, Backgrid.CellFormatter.prototype, {
fromRaw: function(rawValue, model) {
var traits = model.get('$traits$');
var aterm = "",
addTerm = "";
_.keys(model.get('$traits$')).map(function(key) {
var tagName = Utils.checkTagOrTerm(traits[key].$typeName$);
if (tagName.term) {
aterm += '<a class="inputTag term" data-id="tagClick" data-href="' + traits[key].$typeName$ + '">' + traits[key].$typeName$ + '<i class="fa fa-times" data-id="delete" data-name="' + traits[key].$typeName$ + '" data-guid="' + model.get('$id$').id + '" ></i></a>';
}
});
if (model.get('$id$')) {
addTerm += '<a href="javascript:void(0)" data-id="addTerm" class="inputTag" data-guid="' + model.get('$id$').id + '" ><i style="right:0" class="fa fa-plus"></i></a>';
} else {
addTerm += '<a href="javascript:void(0)" data-id="addTerm" class="inputTag"><i style="right:0" class="fa fa-plus"></i></a>';
}
return '<div class="tagList">' + aterm + addTerm + '</div>';
}
})
}; };
that.checkTableFetch(); that.checkTableFetch();
return this.searchCollection.constructor.getTableCols(col, this.searchCollection); return this.searchCollection.constructor.getTableCols(col, this.searchCollection);
...@@ -342,19 +376,34 @@ define(['require', ...@@ -342,19 +376,34 @@ define(['require',
} }
}, this.searchCollection); }, this.searchCollection);
}, },
addModalView: function(e) { addTagModalView: function(e) {
var that = this; var that = this;
require(['views/tag/addTagModalView'], function(AddTagModalView) { require(['views/tag/addTagModalView'], function(AddTagModalView) {
var view = new AddTagModalView({ var view = new AddTagModalView({
vent: that.vent,
guid: that.$(e.currentTarget).data("guid"), guid: that.$(e.currentTarget).data("guid"),
modalCollection: that.searchCollection callback: function() {
that.fetchCollection();
}
}); });
// view.saveTagData = function() { // view.saveTagData = function() {
//override saveTagData function //override saveTagData function
// } // }
}); });
}, },
addTermModalView: function(e) {
var that = this;
require([
'views/business_catalog/AddTermToEntityLayoutView',
], function(AddTermToEntityLayoutView) {
var view = new AddTermToEntityLayoutView({
guid: that.$(e.currentTarget).data("guid"),
callback: function() {
that.fetchCollection();
}
});
});
},
onClickTagCross: function(e) { onClickTagCross: function(e) {
var tagName = $(e.target).data("name"), var tagName = $(e.target).data("name"),
guid = $(e.target).data("guid"), guid = $(e.target).data("guid"),
...@@ -374,7 +423,9 @@ define(['require', ...@@ -374,7 +423,9 @@ define(['require',
CommonViewFunction.deleteTag({ CommonViewFunction.deleteTag({
'tagName': tagName, 'tagName': tagName,
'guid': guid, 'guid': guid,
'collection': that.searchCollection callback: function() {
that.fetchCollection();
}
}); });
} }
}); });
......
...@@ -71,7 +71,7 @@ define(['require', ...@@ -71,7 +71,7 @@ define(['require',
this.ui.parentTag.html(str); this.ui.parentTag.html(str);
} }
this.ui.parentTag.select2({ this.ui.parentTag.select2({
placeholder: "Select parent Tag", placeholder: "Search Tags",
allowClear: true allowClear: true
}); });
}, },
......
...@@ -19,8 +19,9 @@ ...@@ -19,8 +19,9 @@
define(['require', define(['require',
'backbone', 'backbone',
'hbs!tmpl/tag/TagDetailTableLayoutView_tmpl', 'hbs!tmpl/tag/TagDetailTableLayoutView_tmpl',
'utils/CommonViewFunction' 'utils/CommonViewFunction',
], function(require, Backbone, TagDetailTableLayoutView_tmpl, CommonViewFunction) { 'utils/Utils'
], function(require, Backbone, TagDetailTableLayoutView_tmpl, CommonViewFunction, Utils) {
'use strict'; 'use strict';
var TagDetailTableLayoutView = Backbone.Marionette.LayoutView.extend( var TagDetailTableLayoutView = Backbone.Marionette.LayoutView.extend(
...@@ -55,20 +56,25 @@ define(['require', ...@@ -55,20 +56,25 @@ define(['require',
* @constructs * @constructs
*/ */
initialize: function(options) { initialize: function(options) {
_.extend(this, _.pick(options, 'globalVent', 'collection', 'guid')); _.extend(this, _.pick(options, 'globalVent', 'collection', 'guid', 'term'));
this.collectionObject = this.collection.toJSON(); this.collectionObject = this.collection.toJSON();
}, },
bindEvents: function() {}, bindEvents: function() {},
onRender: function() { onRender: function() {
this.tagTableGenerate(); this.tagTableGenerate();
if (this.term) {
this.$('.tagTermheading').text('Terms');
} else {
this.$('.tagTermheading').text('Tags');
}
}, },
tagTableGenerate: function() { tagTableGenerate: function() {
var that = this, var that = this,
table = "", table = "",
valueObject = this.collectionObject[0].traits; valueObject = this.collectionObject[0].traits;
if (_.isEmpty(valueObject)) { if (_.isEmpty(valueObject)) {
this.$(".noTags").show(); this.showNoTagorTermMessage()
} else { } else {
this.$(".noTags").hide(); this.$(".noTags").hide();
_.keys(valueObject).map(function(key) { _.keys(valueObject).map(function(key) {
...@@ -86,12 +92,29 @@ define(['require', ...@@ -86,12 +92,29 @@ define(['require',
}); });
tagValue += stringArr.join(", "); tagValue += stringArr.join(", ");
} }
var name = Utils.checkTagOrTerm(keyValue.typeName);
if (that.term && name.term) {
table += '<tr><td>' + keyValue.typeName + '</td><td>' + tagValue + '</td><td>' + '<a href="javascript:void(0)"><i class="fa fa-trash" data-id="delete" data-name="' + keyValue.typeName + '"></i></a></tr>'; table += '<tr><td>' + keyValue.typeName + '</td><td>' + tagValue + '</td><td>' + '<a href="javascript:void(0)"><i class="fa fa-trash" data-id="delete" data-name="' + keyValue.typeName + '"></i></a></tr>';
}
if (!that.term && !name.term) {
table += '<tr><td>' + keyValue.typeName + '</td><td>' + tagValue + '</td><td>' + '<a href="javascript:void(0)"><i class="fa fa-trash" data-id="delete" data-name="' + keyValue.typeName + '"></i></a></tr>';
}
} else {} } else {}
}); });
if (table.length == 0) {
this.showNoTagorTermMessage();
}
that.ui.detailValue.append(table); that.ui.detailValue.append(table);
} }
}, },
showNoTagorTermMessage: function() {
if (this.term) {
this.$(".noTags").text(' No terms to display').show();
} else {
this.$(".noTags").text(' No tags to display').show();
}
},
addModalView: function(e) { addModalView: function(e) {
var that = this; var that = this;
require(['views/tag/addTagModalView'], function(AddTagModalView) { require(['views/tag/addTagModalView'], function(AddTagModalView) {
......
...@@ -137,10 +137,12 @@ define(['require', ...@@ -137,10 +137,12 @@ define(['require',
return $(this).text() === tag; return $(this).text() === tag;
}).addClass('active'); }).addClass('active');
if (this.createTag || !manual) { if (this.createTag || !manual) {
if (target && target.offset()) {
$('#sidebar-wrapper').animate({ $('#sidebar-wrapper').animate({
scrollTop: target.offset().top - 100 scrollTop: target.offset().top - 100
}, 500); }, 500);
} }
}
} }
} }
...@@ -150,6 +152,8 @@ define(['require', ...@@ -150,6 +152,8 @@ define(['require',
str = ''; str = '';
_.each(this[collection].fullCollection.models, function(model) { _.each(this[collection].fullCollection.models, function(model) {
var tagName = model.get("tags"); var tagName = model.get("tags");
var tagOrTerm = Utils.checkTagOrTerm(tagName);
if (!tagOrTerm.term) {
if (searchString) { if (searchString) {
if (tagName.search(new RegExp(searchString, "i")) != -1) { if (tagName.search(new RegExp(searchString, "i")) != -1) {
str = '<li class="parent-node" data-id="tags"><div class="tools"><i class="fa fa-ellipsis-h tagPopover"></i></div><a href="#!/tag/tagAttribute/' + tagName + '">' + tagName + '</a></li>' + str; str = '<li class="parent-node" data-id="tags"><div class="tools"><i class="fa fa-ellipsis-h tagPopover"></i></div><a href="#!/tag/tagAttribute/' + tagName + '">' + tagName + '</a></li>' + str;
...@@ -160,6 +164,7 @@ define(['require', ...@@ -160,6 +164,7 @@ define(['require',
//str = '<li class="parent-node" data-id="tags"><div class="tools"><i class="fa fa-trash-o" data-id="deleteTerm"></i></div><a href="#!/tag/tagAttribute/' + tagName + '">' + tagName + '</a></li>' + str; //str = '<li class="parent-node" data-id="tags"><div class="tools"><i class="fa fa-trash-o" data-id="deleteTerm"></i></div><a href="#!/tag/tagAttribute/' + tagName + '">' + tagName + '</a></li>' + str;
str = '<li class="parent-node" data-id="tags"><div class="tools"><i class="fa fa-ellipsis-h tagPopover"></i></div><a href="#!/tag/tagAttribute/' + tagName + '">' + tagName + '</a></li>' + str; str = '<li class="parent-node" data-id="tags"><div class="tools"><i class="fa fa-ellipsis-h tagPopover"></i></div><a href="#!/tag/tagAttribute/' + tagName + '">' + tagName + '</a></li>' + str;
} }
}
}); });
this.ui.tagsParent.empty().html(str); this.ui.tagsParent.empty().html(str);
this.setValues(); this.setValues();
......
...@@ -80,11 +80,13 @@ define(['require', ...@@ -80,11 +80,13 @@ define(['require',
}, },
tagsCollection: function() { tagsCollection: function() {
var str = '<option selected="selected" disabled="disabled">-- Select Tag --</option>'; var str = '<option selected="selected" disabled="disabled">-- Select Tag --</option>';
for (var i = 0; i < this.collection.fullCollection.models.length; i++) { _.each(this.collection.fullCollection.models, function(obj, key) {
var tags = this.collection.fullCollection.models[i].get("tags"); var tagOrTerm = Utils.checkTagOrTerm(obj.get('tags'));
str += '<option>' + tags + '</option>'; if (!tagOrTerm.term) {
this.ui.addTagOptions.html(str); str += '<option>' + obj.get('tags') + '</option>';
} }
});
this.ui.addTagOptions.html(str);
}, },
onChangeTagDefination: function() { onChangeTagDefination: function() {
this.ui.tagAttribute.empty(); this.ui.tagAttribute.empty();
......
...@@ -21,6 +21,7 @@ ATLAS-409 Atlas will not import avro tables with schema read from a file (dosset ...@@ -21,6 +21,7 @@ ATLAS-409 Atlas will not import avro tables with schema read from a file (dosset
ATLAS-379 Create sqoop and falcon metadata addons (venkatnrangan,bvellanki,sowmyaramesh via shwethags) ATLAS-379 Create sqoop and falcon metadata addons (venkatnrangan,bvellanki,sowmyaramesh via shwethags)
ALL CHANGES: ALL CHANGES:
ATLAS-812 Atlas UI - Associate Terms with Assets (kevalbhatt18 via yhemanth)
ATLAS-809 JAAS configuration needed for Kafka interaction via Atlas config file (abhayk via shwethags) ATLAS-809 JAAS configuration needed for Kafka interaction via Atlas config file (abhayk via shwethags)
ATLAS-817 Asset details page -- generate schema dynamically based on attributeDefinitions (kevalbhatt18 via yhemanth) ATLAS-817 Asset details page -- generate schema dynamically based on attributeDefinitions (kevalbhatt18 via yhemanth)
ATLAS-495 Atlas Ranger Authorization Plugin (nixonrodrigues via shwethags) ATLAS-495 Atlas Ranger Authorization Plugin (nixonrodrigues via shwethags)
......
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