Repository: atlas Updated Branches: refs/heads/master 570f24231 -> a8fab3e77
ATLAS-2663: Glossary UI updates for related term association Signed-off-by: Madhan Neethiraj <mad...@apache.org> Project: http://git-wip-us.apache.org/repos/asf/atlas/repo Commit: http://git-wip-us.apache.org/repos/asf/atlas/commit/a8fab3e7 Tree: http://git-wip-us.apache.org/repos/asf/atlas/tree/a8fab3e7 Diff: http://git-wip-us.apache.org/repos/asf/atlas/diff/a8fab3e7 Branch: refs/heads/master Commit: a8fab3e77fd9374595b08f72d21a06b6543ba28d Parents: 570f242 Author: kevalbhatt <kbh...@apache.org> Authored: Wed May 9 18:05:28 2018 +0530 Committer: Madhan Neethiraj <mad...@apache.org> Committed: Wed May 9 07:29:00 2018 -0700 ---------------------------------------------------------------------- dashboardv2/public/js/collection/VSearchList.js | 2 +- dashboardv2/public/js/modules/Helpers.js | 10 ++ dashboardv2/public/js/router/Router.js | 2 +- .../public/js/templates/common/Modal.html | 3 +- .../glossary/GlossaryDetailLayoutView_tmpl.html | 6 +- .../TermRelationAttributeLayoutView_tmpl.html | 8 +- .../TermRelationAttributeTable_tmpl.html | 32 ++-- .../public/js/utils/CommonViewFunction.js | 4 +- dashboardv2/public/js/utils/Overrides.js | 26 ++- dashboardv2/public/js/utils/Utils.js | 28 ++- .../views/detail_page/DetailPageLayoutView.js | 2 +- .../views/glossary/GlossaryDetailLayoutView.js | 3 + .../js/views/glossary/GlossaryLayoutView.js | 21 ++- .../glossary/TermRelationAttributeLayoutView.js | 172 +++++++++++++++---- .../public/js/views/search/SearchLayoutView.js | 2 +- .../js/views/search/SearchResultLayoutView.js | 6 +- 16 files changed, 254 insertions(+), 73 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/atlas/blob/a8fab3e7/dashboardv2/public/js/collection/VSearchList.js ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/collection/VSearchList.js b/dashboardv2/public/js/collection/VSearchList.js index db380f6..7417efc 100644 --- a/dashboardv2/public/js/collection/VSearchList.js +++ b/dashboardv2/public/js/collection/VSearchList.js @@ -57,7 +57,7 @@ define(['require', this.dynamicTable = false; return resp.entities ? resp.entities : []; } else { - return resp ? resp : []; + return []; } }, getBasicRearchResult: function(options) { http://git-wip-us.apache.org/repos/asf/atlas/blob/a8fab3e7/dashboardv2/public/js/modules/Helpers.js ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/modules/Helpers.js b/dashboardv2/public/js/modules/Helpers.js index 4a92932..258a40e 100644 --- a/dashboardv2/public/js/modules/Helpers.js +++ b/dashboardv2/public/js/modules/Helpers.js @@ -100,5 +100,15 @@ define(['require', return (obj[field] ? obj[field] : (defaulValue ? defaulValue : "")); }); + Handlebars.registerHelper('eachlookup', function(obj, field, options) { + return Handlebars.helpers.each((obj[field] ? obj[field] : null), options); + }); + + Handlebars.registerHelper('callmyfunction', function(functionObj, param, options) { + var argumentObj = _.extend([], arguments); + argumentObj.shift(); + return functionObj.apply(this, argumentObj); + }); + return HHelpers; }); \ No newline at end of file http://git-wip-us.apache.org/repos/asf/atlas/blob/a8fab3e7/dashboardv2/public/js/router/Router.js ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/router/Router.js b/dashboardv2/public/js/router/Router.js index 9899a96..1f1bd40 100644 --- a/dashboardv2/public/js/router/Router.js +++ b/dashboardv2/public/js/router/Router.js @@ -225,7 +225,7 @@ define([ if (Utils.getUrlState.isTagTab()) { App.rSideNav.currentView.RTagLayoutView.currentView.manualRender(); } else if (Utils.getUrlState.isGlossaryTab()) { - App.rSideNav.currentView.RGlossaryLayoutView.currentView.manualRender(_.extend({ isTrigger: true }, paramObj)); + App.rSideNav.currentView.RGlossaryLayoutView.currentView.manualRender(_.extend({ "isTrigger": true }, { "value": paramObj })); } } http://git-wip-us.apache.org/repos/asf/atlas/blob/a8fab3e7/dashboardv2/public/js/templates/common/Modal.html ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/templates/common/Modal.html b/dashboardv2/public/js/templates/common/Modal.html index e000fa8..2179a7d 100644 --- a/dashboardv2/public/js/templates/common/Modal.html +++ b/dashboardv2/public/js/templates/common/Modal.html @@ -28,7 +28,8 @@ </h4> </div> {{/if}} {{#if contentWithFooter}} {{else}} - <div class="modal-body">{{content}}</div> + <div class="modal-body">{{#if contentHtml}} {{{contentHtm}}} {{else}} {{content}} {{/if}} + </div> {{#if showFooter}} <div class="modal-footer"> {{#if buttons}} {{#each buttons}} http://git-wip-us.apache.org/repos/asf/atlas/blob/a8fab3e7/dashboardv2/public/js/templates/glossary/GlossaryDetailLayoutView_tmpl.html ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/templates/glossary/GlossaryDetailLayoutView_tmpl.html b/dashboardv2/public/js/templates/glossary/GlossaryDetailLayoutView_tmpl.html index 3e17425..7720196 100644 --- a/dashboardv2/public/js/templates/glossary/GlossaryDetailLayoutView_tmpl.html +++ b/dashboardv2/public/js/templates/glossary/GlossaryDetailLayoutView_tmpl.html @@ -52,7 +52,7 @@ </div> {{/if}} {{#if isCategoryView}} <div class="form-group clearfix"> - <span class="control-label-sm-pr pull-left">Term:</span> + <span class="control-label-sm-pr pull-left">Terms:</span> <div class="pull-left" data-id="termList"> <button class="btn btn-action btn-sm" title="Add Term" data-id="addTerm"> <i class="fa fa-plus"> </i> @@ -65,7 +65,7 @@ <ul class="nav nav-tabs" data-id="tab-list"> <li role="entities" class="tab active"><a href="#tab-entities" aria-controls="tab-entities" role="tab" data-toggle="tab">Entities</a></li> <li role="classification"><a href="#tab-tagTable" aria-controls="tab-tagTable" role="tab" data-toggle="tab">Classifications</a></li> - <li role="properties"><a href="#tab-properties" aria-controls="tab-properties" role="tab" data-toggle="tab">Properties</a></li> + <li role="relatedTerm"><a href="#tab-relatedTerm" aria-controls="tab-relatedTerm" role="tab" data-toggle="tab">Related Terms</a></li> </ul> </div> </div> @@ -89,7 +89,7 @@ </div> </div> </div> - <div id="tab-properties" role="properties" class="tab-pane animated fadeIn"> + <div id="tab-relatedTerm" role="relatedTerm" class="tab-pane animated fadeIn"> <div id="r_relationLayoutView"> <div class="fontLoader-relative"> <i class="fa fa-refresh fa-spin-custom"></i> http://git-wip-us.apache.org/repos/asf/atlas/blob/a8fab3e7/dashboardv2/public/js/templates/glossary/TermRelationAttributeLayoutView_tmpl.html ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/templates/glossary/TermRelationAttributeLayoutView_tmpl.html b/dashboardv2/public/js/templates/glossary/TermRelationAttributeLayoutView_tmpl.html index 8a99a58..0755196 100644 --- a/dashboardv2/public/js/templates/glossary/TermRelationAttributeLayoutView_tmpl.html +++ b/dashboardv2/public/js/templates/glossary/TermRelationAttributeLayoutView_tmpl.html @@ -16,17 +16,17 @@ --> <div> <div class="row form-group"> - <div class="col-md-6"> + <!-- <div class="col-md-6"> <select data-id="termAttributeSelect"> {{#each attributeList}} <option value="{{@key}}">{{@key}}</option>{{/each}} </select> - </div> - <div class="col-md-6"> + </div> --> + <!-- <div class="col-md-6"> <button type="button" class="btn btn-action btn-md" data-id="addTermRelation"> <i class="fa fa-plus"></i> <span>Assign Term</span> </button> - </div> + </div> --> </div> <div data-id="termAttributeTable"></div> </div> \ No newline at end of file http://git-wip-us.apache.org/repos/asf/atlas/blob/a8fab3e7/dashboardv2/public/js/templates/glossary/TermRelationAttributeTable_tmpl.html ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/templates/glossary/TermRelationAttributeTable_tmpl.html b/dashboardv2/public/js/templates/glossary/TermRelationAttributeTable_tmpl.html index 1c1e8fe..164c4b7 100644 --- a/dashboardv2/public/js/templates/glossary/TermRelationAttributeTable_tmpl.html +++ b/dashboardv2/public/js/templates/glossary/TermRelationAttributeTable_tmpl.html @@ -17,13 +17,19 @@ <table class="table table-hover table-quickMenu"> <thead> <tr> - <th>Term</th> - <th>Attribute</th> - <th>Action</th> + <th>{{#if relationTypeTable}}Relation Types{{else}}Term{{/if}}</th> + <th>{{#if relationTypeTable}}Related Terms{{else}}Attribute{{/if}}</th> + {{#if relationTypeTable}} + <th>Attributes</th>{{/if}} </tr> </thead> <tbody> - {{#if attributeValue}} {{#each attributeValue}} + {{#if relationTypeTable}} {{#each attributes}} + <tr> + <td>{{@key}}</td> + {{{callmyfunction ../getTerms @key}}} + </tr> + {{/each}} {{else}} {{#if attributeValue}} {{#each attributeValue}} <tr> <td>{{this.displayText}}</td> <td> @@ -39,22 +45,22 @@ {{#each ../attributes}} <tr> <td>{{@key}}</td> - <td>{{lookup ../this @key "-"}}</td> + {{#if ../../editMode}} + <td> + <input data-id="attributeUpdate" class="form-control" type="text" data-name="{{@key}}" data-termguid="{{../../this.termGuid}}" " value="{{lookup ../../this @key ''}} "> + </td>{{else}} + <td>{{lookup ../../this @key "- "}}</td> + {{/if}} </tr> {{/each}} </tbody> </table> </div> </td> - <td> - <div class="btn-inline"> - <button title="Delete" data-termguid="{{this.termGuid}}" class="btn btn-action btn-sm" data-id="deleteAttribute" data-name="Dimension"><i class="fa fa-trash"></i></button> - </div> - </td> </tr> {{/each}}{{else}} - <tr class="empty text-center"> - <td colspan="3"><span>No records found!</span></td> - </tr>{{/if}} + <tr class="empty text-center "> + <td colspan="3 "><span>No records found!</span></td> + </tr>{{/if}} {{/if}} </tbody> </table> \ No newline at end of file http://git-wip-us.apache.org/repos/asf/atlas/blob/a8fab3e7/dashboardv2/public/js/utils/CommonViewFunction.js ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/utils/CommonViewFunction.js b/dashboardv2/public/js/utils/CommonViewFunction.js index de420f2..bd99de9 100644 --- a/dashboardv2/public/js/utils/CommonViewFunction.js +++ b/dashboardv2/public/js/utils/CommonViewFunction.js @@ -280,8 +280,8 @@ define(['require', 'utils/Utils', 'modules/Modal', 'utils/Messages', 'utils/Enum if (terms) { terms.map(function(term) { var className = "btn btn-action btn-sm btn-blue btn-icon", - deleteIcon = '<i class="fa fa-times" data-id="delete" data-assetname="' + entityName + '"data-name="' + term.typeName + '" data-type="tag" data-guid="' + obj.guid + '" data-termGuid="' + term.termGuid + '" ></i>', - termString = '<a class="' + className + '" data-id="termClick"><span title="' + term.typeName + '">' + term.displayText + '</span>' + deleteIcon + '</a>'; + deleteIcon = '<i class="fa fa-times" data-id="delete" data-assetname="' + entityName + '"data-name="' + term.displayText + '" data-type="term" data-guid="' + obj.guid + '" data-termGuid="' + term.termGuid + '" ></i>', + termString = '<a class="' + className + '" data-id="termClick"><span title="' + term.displayText + '">' + term.displayText + '</span>' + deleteIcon + '</a>'; if (count >= 1) { popTerm += termString; } else { http://git-wip-us.apache.org/repos/asf/atlas/blob/a8fab3e7/dashboardv2/public/js/utils/Overrides.js ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/utils/Overrides.js b/dashboardv2/public/js/utils/Overrides.js index 81141f4..efd5e40 100644 --- a/dashboardv2/public/js/utils/Overrides.js +++ b/dashboardv2/public/js/utils/Overrides.js @@ -105,6 +105,12 @@ define(['require', 'utils/Utils', 'marionette', 'backgrid', 'asBreadcrumbs', 'jq return false; } }); + $("body").on('click', '.dropdown-menu.dropdown-changetitle li a', function() { + $(this).parents('li').find(".btn:first-child").html($(this).text() + ' <span class="caret"></span>'); + }); + $("body").on('click', '.btn', function() { + $(this).blur(); + }); // For placeholder support if (!('placeholder' in HTMLInputElement.prototype)) { @@ -144,8 +150,24 @@ define(['require', 'utils/Utils', 'marionette', 'backgrid', 'asBreadcrumbs', 'jq var that = this; Backgrid.HeaderRow.__super__.render.apply(this, arguments); _.each(this.columns.models, function(modelValue) { - if (modelValue.get('width')) that.$el.find('.' + modelValue.get('name')).css('min-width', modelValue.get('width') + 'px') - if (modelValue.get('toolTip')) that.$el.find('.' + modelValue.get('name')).attr('title', modelValue.get('toolTip')) + var elAttr = modelValue.get('elAttr'), + elAttrObj = null; + if (elAttr) { + if (_.isFunction(elAttr)) { + elAttrObj = elAttr(modelValue); + } else if (_.isObject(elAttr)) { + if (!_.isArray(elAttr)) { + elAttrObj = [elAttr]; + } else { + elAttrObj = elAttr; + } + } + _.each(elAttrObj, function(val) { + that.$el.find('.' + modelValue.get('name')).data(val); + }); + } + if (modelValue.get('width')) that.$el.find('.' + modelValue.get('name')).css('min-width', modelValue.get('width') + 'px'); + if (modelValue.get('toolTip')) that.$el.find('.' + modelValue.get('name')).attr('title', modelValue.get('toolTip')); }); return this; } http://git-wip-us.apache.org/repos/asf/atlas/blob/a8fab3e7/dashboardv2/public/js/utils/Utils.js ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/utils/Utils.js b/dashboardv2/public/js/utils/Utils.js index a981307..fd2565a 100644 --- a/dashboardv2/public/js/utils/Utils.js +++ b/dashboardv2/public/js/utils/Utils.js @@ -305,21 +305,38 @@ define(['require', 'utils/Globals', 'pnotify', 'utils/Messages', 'utils/Enums', lastValue: hashValue.split('/')[hashValue.split('/').length - 1] } }, + checkTabUrl: function(options) { + var url = options && options.url, + matchString = options && options.matchString, + quey = this.getQueryUrl(url); + return quey.firstValue == matchString || quey.queyParams[0] == "#!/" + matchString; + }, isInitial: function() { return this.getQueryUrl().firstValue == undefined; }, isTagTab: function(url) { - var quey = this.getQueryUrl(url); - return quey.firstValue == "tag" || quey.queyParams[0] == "#!/tag"; + return this.checkTabUrl({ + url: url, + matchString: "tag" + }); }, isSearchTab: function(url) { - return this.getQueryUrl(url).firstValue == "search"; + return this.checkTabUrl({ + url: url, + matchString: "search" + }); }, isGlossaryTab: function(url) { - return this.getQueryUrl(url).firstValue == "glossary"; + return this.checkTabUrl({ + url: url, + matchString: "glossary" + }); }, isDetailPage: function(url) { - return this.getQueryUrl(url).firstValue == "detailPage"; + return this.checkTabUrl({ + url: url, + matchString: "detailPage" + }); }, getLastValue: function() { return this.getQueryUrl().lastValue; @@ -640,6 +657,7 @@ define(['require', 'utils/Globals', 'pnotify', 'utils/Messages', 'utils/Enums', } } } + Utils.isUrl = function(url) { var regexp = /(ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?/ return regexp.test(url); http://git-wip-us.apache.org/repos/asf/atlas/blob/a8fab3e7/dashboardv2/public/js/views/detail_page/DetailPageLayoutView.js ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/views/detail_page/DetailPageLayoutView.js b/dashboardv2/public/js/views/detail_page/DetailPageLayoutView.js index a1fe805..6fc8ce2 100644 --- a/dashboardv2/public/js/views/detail_page/DetailPageLayoutView.js +++ b/dashboardv2/public/js/views/detail_page/DetailPageLayoutView.js @@ -502,4 +502,4 @@ define(['require', } }); return DetailPageLayoutView; -}); +}); \ No newline at end of file http://git-wip-us.apache.org/repos/asf/atlas/blob/a8fab3e7/dashboardv2/public/js/views/glossary/GlossaryDetailLayoutView.js ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/views/glossary/GlossaryDetailLayoutView.js b/dashboardv2/public/js/views/glossary/GlossaryDetailLayoutView.js index 1fa12a9..2cf5a23 100644 --- a/dashboardv2/public/js/views/glossary/GlossaryDetailLayoutView.js +++ b/dashboardv2/public/js/views/glossary/GlossaryDetailLayoutView.js @@ -195,11 +195,13 @@ define(['require', if (this.isGlossaryView) { if (this.glossaryCollection.fullCollection.length) { this.data = this.glossaryCollection.fullCollection.get(this.guid).toJSON(); + this.glossaryCollection.trigger("data:updated", $.extend(true, {}, this.data)); this.renderDetails(this.data); } else { this.listenTo(this.glossaryCollection.fullCollection, "reset ", function(skip) { var foundGlossary = this.glossaryCollection.fullCollection.get(this.guid); this.data = foundGlossary ? foundGlossary.toJSON() : null; + this.glossaryCollection.trigger("data:updated", $.extend(true, {}, this.data)); if (this.data == null) { this.glossary.selectedItem = {}; Utils.setUrl({ @@ -248,6 +250,7 @@ define(['require', that.renderRelationLayoutView(obj); } that.data = data; + that.glossaryCollection.trigger("data:updated", $.extend(true, {}, data)); that.glossary.selectedItem.model = data; that.glossary.selectedItem.guid = data.guid; that.renderDetails(data) http://git-wip-us.apache.org/repos/asf/atlas/blob/a8fab3e7/dashboardv2/public/js/views/glossary/GlossaryLayoutView.js ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/views/glossary/GlossaryLayoutView.js b/dashboardv2/public/js/views/glossary/GlossaryLayoutView.js index 88b86be..852f429 100644 --- a/dashboardv2/public/js/views/glossary/GlossaryLayoutView.js +++ b/dashboardv2/public/js/views/glossary/GlossaryLayoutView.js @@ -98,8 +98,8 @@ define(['require', }; if (Utils.getUrlState.isGlossaryTab() && this.value && this.value.viewType) { this.viewType = this.value.viewType; + this.query[this.viewType] = _.extend({}, this.value, { "guid": this.guid }); } - this.query[this.viewType] = _.extend({}, this.value, { "guid": this.guid }); }, bindEvents: function() { var that = this; @@ -164,6 +164,9 @@ define(['require', this.viewType = "term"; } var setDefaultSelector = function() { + if (!that.value) { + return; + } var model = null; if (that.value.gId) { model = that.glossaryCollection.fullCollection.get(that.value.gId); @@ -195,12 +198,13 @@ define(['require', $tree.jstree('activate_node', that.glossary.selectedItem.guid); } this.query[this.viewType] = _.extend(obj, _.pick(this.glossary.selectedItem, 'model', 'guid', 'gType'), { "viewType": this.viewType, "isNodeNotFoundAtLoad": this.query[this.viewType].isNodeNotFoundAtLoad }); + var url = _.isEmpty(this.glossary.selectedItem) ? '#!/glossary' : '#!/glossary/' + this.glossary.selectedItem.guid; Utils.setUrl({ - url: '#!/glossary/' + this.glossary.selectedItem.guid, - urlParams: _.extend({}, _.omit(obj, 'guid', 'model', 'type', 'isNodeNotFoundAtLoad')), - mergeBrowserUrl: false, - trigger: false, - updateTabState: true + "url": url, + "urlParams": _.extend({}, _.omit(obj, 'guid', 'model', 'type', 'isNodeNotFoundAtLoad')), + "mergeBrowserUrl": false, + "trigger": false, + "updateTabState": true }); } }, @@ -615,6 +619,11 @@ define(['require', var url = gId ? '#!/glossary/' + gId : '#!/glossary'; if (gId == null) { that.glossary.selectedItem = {}; + that.value = null; + that.query = { + term: {}, + category: {} + }; that.ui.categoryTree.jstree(true).refresh(); that.ui.termTree.jstree(true).refresh(); } http://git-wip-us.apache.org/repos/asf/atlas/blob/a8fab3e7/dashboardv2/public/js/views/glossary/TermRelationAttributeLayoutView.js ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/views/glossary/TermRelationAttributeLayoutView.js b/dashboardv2/public/js/views/glossary/TermRelationAttributeLayoutView.js index 00738fb..3c22b5f 100644 --- a/dashboardv2/public/js/views/glossary/TermRelationAttributeLayoutView.js +++ b/dashboardv2/public/js/views/glossary/TermRelationAttributeLayoutView.js @@ -22,8 +22,99 @@ define(['require', 'hbs!tmpl/glossary/TermRelationAttributeTable_tmpl', 'utils/Enums', 'utils/Utils', - 'utils/UrlLinks' -], function(require, Backbone, TermRelationAttributeLayoutViewTmpl, TermRelationAttributeTableTmpl, Enums, Utils, UrlLinks) { + 'utils/UrlLinks', + 'modules/Modal' +], function(require, Backbone, TermRelationAttributeLayoutViewTmpl, TermRelationAttributeTableTmpl, Enums, Utils, UrlLinks, Modal) { + + var TermRelationAttributeTable = Backbone.Marionette.LayoutView.extend({ + _viewName: 'TermRelationAttributeTable', + + template: TermRelationAttributeTableTmpl, + + templateHelpers: function() { + return { + attributeValue: this.data[this.selectedTermAttribute], + selectedTermAttribute: this.selectedTermAttribute, + editMode: this.editMode, + attributes: Enums.termRelationAttributeList[this.selectedTermAttribute] + } + }, + /** ui selector cache */ + ui: { + "deleteAttribute": '[data-id="deleteAttribute"]', + "attributeUpdate": '[data-id="attributeUpdate"]' + }, + /** ui events hash */ + events: function() { + var events = {}; + events["click " + this.ui.deleteAttribute] = 'onModalDeleteAttribute'; + events["change " + this.ui.attributeUpdate] = 'onAttributeUpdate'; + return events; + }, + /** + * intialize a new TermRelationAttributeLayoutView Layout + * @constructs + */ + initialize: function(options) { + _.extend(this, _.pick(options, 'glossaryCollection', 'data', 'callback', 'selectedTermAttribute', 'onDeleteAttribute', 'editMode')); + var that = this; + this.updateObj = $.extend(true, {}, this.data); + this.modal = new Modal({ + "title": ((this.editMode ? "Edit attributes" : "Attributes") + " of " + this.selectedTermAttribute), + "content": this, + "okText": (this.editMode ? "Update" : "ok"), + "allowCancel": (this.editMode ? true : false), + "okCloses": true, + "width": "80%", + }); + this.modal.open(); + this.modal.on('closeModal', function() { + that.modal.trigger('cancel'); + }); + this.modal.on('ok', function() { + if (that.editMode) { + that.updateAttributes(); + } + }); + this.bindEvents(); + }, + bindEvents: function() { + this.listenTo(this.glossaryCollection, "data:updated", function(data) { + this.data = data; + this.render() + }, this); + }, + onRender: function() {}, + onModalDeleteAttribute: function(e) { + var that = this; + this.onDeleteAttribute(e); + }, + onAttributeUpdate: function(e) { + var $el = $(e.currentTarget), + termGuid = $el.data('termguid'), + name = $el.data('name'); + _.find(this.updateObj[this.selectedTermAttribute], function(obj) { + if (obj.termGuid == termGuid) { + obj[name] = $el.val(); + } + }); + }, + updateAttributes: function() { + var that = this, + model = new this.glossaryCollection.model(), + ajaxOptions = { + success: function(rModel, response) { + Utils.notifySuccess({ + content: "Attributes updated successfully" + }); + if (that.callback) { + that.callback(); + } + } + }; + model.createEditTerm(_.extend(ajaxOptions, { data: JSON.stringify(this.updateObj) }, { guid: this.updateObj.guid })); + } + }); var TermRelationAttributeLayoutView = Backbone.Marionette.LayoutView.extend( /** @lends TermRelationAttributeLayoutView */ @@ -43,7 +134,7 @@ define(['require', /** ui selector cache */ ui: { - "termAttributeSelect": '[data-id="termAttributeSelect"]', + "showAttribute": '[data-id="showAttribute"]', "addTermRelation": '[data-id="addTermRelation"]', "termAttributeTable": '[data-id="termAttributeTable"]', "deleteAttribute": '[data-id="deleteAttribute"]', @@ -53,7 +144,7 @@ define(['require', var events = {}; events["click " + this.ui.addTermRelation] = 'onAddTermRelation'; events["click " + this.ui.deleteAttribute] = 'onDeleteAttribute'; - events["change " + this.ui.termAttributeSelect] = 'changeTermAttributeSelect'; + events["click " + this.ui.showAttribute] = 'onShowAttribute'; return events; }, /** @@ -61,19 +152,36 @@ define(['require', * @constructs */ initialize: function(options) { - _.extend(this, _.pick(options, 'glossaryCollection', 'data', 'fetchCollection', 'getSelectedTermAttribute', 'setSelectedTermAttribute')); - this.selectedTermAttribute = this.getSelectedTermAttribute(); + _.extend(this, _.pick(options, 'glossaryCollection', 'data', 'fetchCollection')); }, bindEvents: function() {}, + onRender: function() { + this.renderTermAttributeTable(); + }, + onShowAttribute: function(e) { + var that = this, + attributename = $(e.currentTarget).data('attributename'), + view = new TermRelationAttributeTable({ + "data": that.data, + "editMode": ($(e.currentTarget).data('mode') == "edit"), + "selectedTermAttribute": attributename, + "callback": function() { + if (that.fetchCollection) { + that.fetchCollection(); + } + }, + "onDeleteAttribute": that.onDeleteAttribute.bind(that), + "glossaryCollection": that.glossaryCollection + }); + }, onAddTermRelation: function(e) { - var that = this; - this.selectedTermAttribute = this.ui.termAttributeSelect.val(); - this.setSelectedTermAttribute(this.selectedTermAttribute); + var that = this, + attributename = $(e.currentTarget).data('attributename'); require(['views/glossary/AssignTermLayoutView'], function(AssignTermLayoutView) { var view = new AssignTermLayoutView({ "isAttributeRelationView": true, "termData": that.data, - "selectedTermAttribute": that.selectedTermAttribute, + "selectedTermAttribute": attributename, "callback": function() { if (that.fetchCollection) { that.fetchCollection(); @@ -81,12 +189,10 @@ define(['require', }, "glossaryCollection": that.glossaryCollection }); - view.modal.on('ok', function() { - //that.hideLoader(); - }); }); }, onDeleteAttribute: function(e) { + e.stopPropagation(); var that = this, notifyObj = { modal: true, @@ -94,6 +200,7 @@ define(['require', ok: function(argument) { var model = new that.glossaryCollection.model(), selectedGuid = $(e.currentTarget).data('termguid'), + attributename = $(e.currentTarget).data('attributename'), ajaxOptions = { success: function(rModel, response) { Utils.notifySuccess({ @@ -105,7 +212,7 @@ define(['require', } }, data = _.clone(that.data); - data[that.selectedTermAttribute] = _.reject(data[that.selectedTermAttribute], function(obj) { + data[attributename] = _.reject(data[attributename], function(obj) { return obj.termGuid == selectedGuid; }); model.removeTermFromAttributes(_.extend(ajaxOptions, { data: JSON.stringify(data) }, { guid: that.data.guid })); @@ -115,22 +222,27 @@ define(['require', }; Utils.notifyConfirm(notifyObj); }, - changeTermAttributeSelect: function(e, options) { - var $el = $(e.currentTarget); - if (e.type == "change" && $el.select2('data')) { - this.selectedTermAttribute = $el.val(); - this.setSelectedTermAttribute(this.selectedTermAttribute); - this.ui.termAttributeTable.html(TermRelationAttributeTableTmpl({ - attributeValue: this.data[this.selectedTermAttribute], - attributes: Enums.termRelationAttributeList[this.selectedTermAttribute] - })) - } - }, - onRender: function() { - if (this.selectedTermAttribute) { - this.ui.termAttributeSelect.val(this.selectedTermAttribute); - } - this.ui.termAttributeSelect.select2().trigger('change'); + renderTermAttributeTable: function(e, options) { + var that = this; + this.ui.termAttributeTable.html(TermRelationAttributeTableTmpl({ + data: this.data, + attributes: Enums.termRelationAttributeList, + relationTypeTable: true, + getTerms: function(key) { + var terms = _.map(that.data[key], function(obj) { + var name = _.escape(obj.displayText); + return '<span class="btn btn-action btn-sm btn-icon btn-blue" title=' + _.escape(name) + ' data-id="termClick"><span>' + name + '</span><i class="fa fa-close" data-id="deleteAttribute" data-attributename="' + key + '" data-termguid="' + obj.termGuid + '" data-type="term" title="Remove Term"></i></span>'; + }).join(""), + attributeButtons = ""; + if (terms.length) { + attributeButtons = '<div class="btn-inline">' + + '<button type="button" title="View Attribute" class="btn btn-action btn-sm" data-attributename="' + key + '" data-id="showAttribute"><i class="fa fa-eye fa-fw" aria-hidden="true"></i></button>' + + '<button type="button" title="Edit Attribute" class="btn btn-action btn-sm" data-attributename="' + key + '" data-mode="edit" data-id="showAttribute"><i class="fa fa-pencil fa-fw" aria-hidden="true"></i></button>' + + '</div>' + } + return '<td>' + terms + '<button type="button" data-attributename="' + key + '" class="btn btn-action btn-sm" data-id="addTermRelation"><i class="fa fa-plus"></i></button></td><td>' + attributeButtons + '</td>'; + } + })); } }); return TermRelationAttributeLayoutView; http://git-wip-us.apache.org/repos/asf/atlas/blob/a8fab3e7/dashboardv2/public/js/views/search/SearchLayoutView.js ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/views/search/SearchLayoutView.js b/dashboardv2/public/js/views/search/SearchLayoutView.js index d68d2a9..69fd036 100644 --- a/dashboardv2/public/js/views/search/SearchLayoutView.js +++ b/dashboardv2/public/js/views/search/SearchLayoutView.js @@ -680,4 +680,4 @@ define(['require', } }); return SearchLayoutView; -}); +}); \ No newline at end of file http://git-wip-us.apache.org/repos/asf/atlas/blob/a8fab3e7/dashboardv2/public/js/views/search/SearchResultLayoutView.js ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/views/search/SearchResultLayoutView.js b/dashboardv2/public/js/views/search/SearchResultLayoutView.js index cc99ead..ccc147e 100644 --- a/dashboardv2/public/js/views/search/SearchResultLayoutView.js +++ b/dashboardv2/public/js/views/search/SearchResultLayoutView.js @@ -713,7 +713,7 @@ define(['require', }) }; this.getTagCol({ 'col': col, 'columnToShow': columnToShow }); - if (this.fromView != "glossary") { + if ((!_.contains(["classification", "glossary"], this.fromView))) { this.getTermCol({ 'col': col, 'columnToShow': columnToShow }); } @@ -851,7 +851,7 @@ define(['require', formatter: _.extend({}, Backgrid.CellFormatter.prototype, { fromRaw: function(rawValue, model) { var obj = model.toJSON(); - if (!(obj.typeName.startsWith("AtlasGlossary"))) { + if (obj.typeName && !(obj.typeName.startsWith("AtlasGlossary"))) { if (obj.status && Enums.entityStateReadOnly[obj.status]) { return '<div class="readOnly">' + CommonViewFunction.termForTable(obj); + '</div>'; } else { @@ -1089,4 +1089,4 @@ define(['require', } }); return SearchResultLayoutView; -}); +}); \ No newline at end of file