ATLAS-897 : Atlas UI: Feature to associate multiple assets with a term.
Project: http://git-wip-us.apache.org/repos/asf/incubator-atlas/repo Commit: http://git-wip-us.apache.org/repos/asf/incubator-atlas/commit/c0cd9f0a Tree: http://git-wip-us.apache.org/repos/asf/incubator-atlas/tree/c0cd9f0a Diff: http://git-wip-us.apache.org/repos/asf/incubator-atlas/diff/c0cd9f0a Branch: refs/heads/0.7-incubating Commit: c0cd9f0ac8e4417ae47b5ce98f0d20ae2fb910c3 Parents: 59bd56c Author: kalyanikk <[email protected]> Authored: Thu Jun 16 20:23:07 2016 +0530 Committer: Suma Shivaprasad <[email protected]> Committed: Fri Jun 17 18:18:23 2016 -0700 ---------------------------------------------------------------------- dashboardv2/gruntfile.js | 10 +- dashboardv2/package.json | 1 + .../public/css/scss/business-catlog.scss | 4 + dashboardv2/public/css/scss/main.scss | 16 +++ dashboardv2/public/css/scss/tag.scss | 5 + dashboardv2/public/js/main.js | 4 + .../business_catalog/AddTermView_tmpl.html | 2 +- .../schema/SchemaTableLayoutView_tmpl.html | 1 + .../public/js/utils/CommonViewFunction.js | 115 +++++++++++++------ dashboardv2/public/js/utils/Messages.js | 4 +- dashboardv2/public/js/utils/TableLayout.js | 3 +- dashboardv2/public/js/utils/Utils.js | 6 +- .../AddTermToEntityLayoutView.js | 70 ++++++----- .../js/views/business_catalog/TreeLayoutView.js | 6 +- .../views/detail_page/DetailPageLayoutView.js | 4 - .../public/js/views/schema/SchemaLayoutView.js | 111 +++++++++++++++--- .../js/views/search/SearchResultLayoutView.js | 89 +++++++++++--- 17 files changed, 332 insertions(+), 119 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/c0cd9f0a/dashboardv2/gruntfile.js ---------------------------------------------------------------------- diff --git a/dashboardv2/gruntfile.js b/dashboardv2/gruntfile.js index 08000a4..2f30f3b 100644 --- a/dashboardv2/gruntfile.js +++ b/dashboardv2/gruntfile.js @@ -47,7 +47,7 @@ module.exports = function(grunt) { }, css: { files: ['public/**/*.scss', 'public/**/*.css'], - tasks: ['sass', 'copy:dist'] + tasks: ['copy:dist', 'sass'] }, image: { files: ['public/**/*.{ico,gif,png}'], @@ -73,7 +73,7 @@ module.exports = function(grunt) { }, proxies: [{ context: '/api', // the context of the data service - host: '127.0.0.1', // wherever the data service is running + host: '127.0.0.1', port: 21000, // the port that the data service is running on ws: true, changeOrigin: false, @@ -128,7 +128,8 @@ module.exports = function(grunt) { 'noty/js': 'noty/js/noty/packaged/jquery.noty.packaged.min.js', 'dagre-d3': 'dagre-d3/dist/dagre-d3.min.js', 'jstree': 'jstree/dist/jstree.min.js', - 'select2': 'select2/dist/js/select2.min.js' + 'select2': 'select2/dist/js/select2.min.js', + 'backgrid-select-all': 'backgrid-select-all/backgrid-select-all.min.js' } }, css: { @@ -144,7 +145,8 @@ module.exports = function(grunt) { 'backgrid-paginator/css': 'backgrid-paginator/backgrid-paginator.css', 'backgrid-sizeable-columns/css': 'backgrid-sizeable-columns/backgrid-sizeable-columns.css', 'jquery-asBreadcrumbs/css': 'jquery-asBreadcrumbs/css/asBreadcrumbs.css', - 'select2/css': 'select2/dist/css/select2.min.css' + 'select2/css': 'select2/dist/css/select2.min.css', + 'backgrid-select-all': 'backgrid-select-all/backgrid-select-all.min.css' } } http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/c0cd9f0a/dashboardv2/package.json ---------------------------------------------------------------------- diff --git a/dashboardv2/package.json b/dashboardv2/package.json index dc92d3d..9ec4feb 100644 --- a/dashboardv2/package.json +++ b/dashboardv2/package.json @@ -26,6 +26,7 @@ "backgrid-filter": "^0.3.7", "backgrid-orderable-columns": "^0.1.2", "backgrid-paginator": "^0.3.7", + "backgrid-select-all": "^0.3.5", "backgrid-sizeable-columns": "^0.1.1", "bootstrap": "^3.3.5", "d3": "^3.5.16", http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/c0cd9f0a/dashboardv2/public/css/scss/business-catlog.scss ---------------------------------------------------------------------- diff --git a/dashboardv2/public/css/scss/business-catlog.scss b/dashboardv2/public/css/scss/business-catlog.scss index 572c51e..824bf10 100644 --- a/dashboardv2/public/css/scss/business-catlog.scss +++ b/dashboardv2/public/css/scss/business-catlog.scss @@ -84,3 +84,7 @@ ul[data-id=branchList] { .detailLabel { padding-bottom: 10px; } + +.termNote { + padding-top: 10px; +} http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/c0cd9f0a/dashboardv2/public/css/scss/main.scss ---------------------------------------------------------------------- diff --git a/dashboardv2/public/css/scss/main.scss b/dashboardv2/public/css/scss/main.scss index 1311662..c810596 100644 --- a/dashboardv2/public/css/scss/main.scss +++ b/dashboardv2/public/css/scss/main.scss @@ -181,6 +181,22 @@ ul { i { cursor: pointer; } + >div { + display: inline-block; + // padding: 10px 0px; + width: 100%; + } + .hide { + opacity: 0; + overflow: hidden; + height: 0px; + display: block !important; + } + .show { + opacity: 1; + overflow: visible; + height: auto; + } .liContent { /* width: 150px; */ float: left; http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/c0cd9f0a/dashboardv2/public/css/scss/tag.scss ---------------------------------------------------------------------- diff --git a/dashboardv2/public/css/scss/tag.scss b/dashboardv2/public/css/scss/tag.scss index b69fcd2..1a07ce2 100644 --- a/dashboardv2/public/css/scss/tag.scss +++ b/dashboardv2/public/css/scss/tag.scss @@ -256,6 +256,7 @@ form-control .tagInpput { cursor: pointer; background-color: $white; width: 100px; + white-space: nowrap; i.fa { position: relative; right: -5px; @@ -266,3 +267,7 @@ form-control .tagInpput { background-color: $color_mercury_approx; } } + +.multiSelect { + float: right; +} http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/c0cd9f0a/dashboardv2/public/js/main.js ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/main.js b/dashboardv2/public/js/main.js index c615ce9..95f64a1 100644 --- a/dashboardv2/public/js/main.js +++ b/dashboardv2/public/js/main.js @@ -78,6 +78,9 @@ require.config({ 'backgrid-sizeable': { deps: ['backbone', 'backgrid'], }, + 'backgrid-select-all': { + deps: ['backbone', 'backgrid'] + }, hbs: { deps: ['underscore', 'handlebars'] }, @@ -127,6 +130,7 @@ require.config({ 'dagreD3': 'libs/dagre-d3/dagre-d3.min', 'tree': 'libs/jstree/jstree.min', 'select2': 'libs/select2/select2.min', + 'backgrid-select-all': 'libs/backgrid-select-all/backgrid-select-all.min' }, /** http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/c0cd9f0a/dashboardv2/public/js/templates/business_catalog/AddTermView_tmpl.html ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/templates/business_catalog/AddTermView_tmpl.html b/dashboardv2/public/js/templates/business_catalog/AddTermView_tmpl.html index 6c729b5..2c8bf30 100644 --- a/dashboardv2/public/js/templates/business_catalog/AddTermView_tmpl.html +++ b/dashboardv2/public/js/templates/business_catalog/AddTermView_tmpl.html @@ -17,7 +17,7 @@ <form name="tagDefinitionform" class="css-form" onsubmit="return false;"> <!-- <h4 style="margin-bottom:30px">Add Term</h4> --> <div class="form-group"> - <input class="form-control" data-id="termName" placeholder="Add subterm" autofocus> + <input class="form-control" data-id="termName" placeholder="Name(Required)" autofocus> <p class='alertTerm' style='display:none'>Term name should not have spaces</p> </div> <div class="form-group"> http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/c0cd9f0a/dashboardv2/public/js/templates/schema/SchemaTableLayoutView_tmpl.html ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/templates/schema/SchemaTableLayoutView_tmpl.html b/dashboardv2/public/js/templates/schema/SchemaTableLayoutView_tmpl.html index 3033efc..5caa3ea 100644 --- a/dashboardv2/public/js/templates/schema/SchemaTableLayoutView_tmpl.html +++ b/dashboardv2/public/js/templates/schema/SchemaTableLayoutView_tmpl.html @@ -17,4 +17,5 @@ <div class="fontLoader"> <i class="fa fa-refresh fa-spin-custom"></i> </div> +<a href="javascript:void(0)" class="inputAssignTag multiSelect" style="display:none" data-id="addTerm"><i class="fa fa-folder-o"> Assign Term</i></a> <div id="r_tagLayoutView"></div> http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/c0cd9f0a/dashboardv2/public/js/utils/CommonViewFunction.js ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/utils/CommonViewFunction.js b/dashboardv2/public/js/utils/CommonViewFunction.js index be028a4..ffffa1c 100644 --- a/dashboardv2/public/js/utils/CommonViewFunction.js +++ b/dashboardv2/public/js/utils/CommonViewFunction.js @@ -20,19 +20,32 @@ define(['require', 'utils/Utils', 'modules/Modal', 'utils/Messages'], function(r 'use strict'; var CommonViewFunction = {}; - CommonViewFunction.deleteTagModel = function(tagName) { - var msg = "<b>Tag:</b>"; - if (tagName) { + CommonViewFunction.deleteTagModel = function(tagName, AssignTerm) { + var msg = "", + titleMessage = "", + deleteText = ""; + if (tagName && AssignTerm != "assignTerm") { var tagOrTerm = Utils.checkTagOrTerm(tagName); if (tagOrTerm.term) { - msg = "<div class='ellipsis'><b>Term: " + tagName + "</b></div>"; + msg = "<div class='ellipsis'>Delete: " + "<b>" + tagName + "?</b></div>" + + "<p class='termNote'>Assets map to this term will be unclassified</p>"; + titleMessage = Messages.deleteTerm; + deleteText = "Delete"; } else { - msg = "<div class='ellipsis'><b>Tag: " + tagName + "</b></div>"; + msg = "<div class='ellipsis'>Delete: " + "<b>" + tagName + "?</b></div>"; + var titleMessage = Messages.deleteTag; + deleteText = "Delete"; } } + if (AssignTerm == "assignTerm") { + msg = "<div class='ellipsis'>Remove: " + "<b>" + tagName + "?</b></div>" + + "<p class='termNote'>Assets map to this term will be unclassified</p>"; + titleMessage = Messages.RemoveTerm; + deleteText = "Remove"; + } var modal = new Modal({ - title: Messages.deleteTitle, - okText: 'Delete', + title: titleMessage, + okText: deleteText, htmlContent: msg, cancelText: "Cancel", allowCancel: true, @@ -246,6 +259,7 @@ define(['require', 'utils/Utils', 'modules/Modal', 'utils/Messages'], function(r namespace: 'breadcrumb', overflow: "left", dropicon: "fa fa-ellipsis-h", + responsive: false, dropdown: function() { return '<div class=\"dropdown\">' + '<a href=\"javascript:void(0);\" class=\"' + this.namespace + '-toggle\" data-toggle=\"dropdown\"><i class=\"' + this.dropicon + '\"</i></a>' + @@ -271,39 +285,41 @@ define(['require', 'utils/Utils', 'modules/Modal', 'utils/Messages'], function(r CommonViewFunction.termTableBreadcrumbMaker = function(model) { var traits = model.get('$traits$'), url = "", - deleteHtml = ""; + deleteHtml = "", + html = "", + id = model.get('$id$').id, + terms = []; _.keys(traits).map(function(key) { var tagName = Utils.checkTagOrTerm(traits[key].$typeName$); if (tagName.term) { - deleteHtml = '<a class="pull-left" title="Delete Term"><i class="fa fa-trash" data-id="tagClick" data-name="' + traits[key].$typeName$ + '" data-guid="' + model.get('$id$').id + '" ></i></a>'; - url = traits[key].$typeName$.split(".").join("/"); + terms.push({ + deleteHtml: '<a class="pull-left" title="Delete Term"><i class="fa fa-trash" data-id="tagClick" data-name="' + traits[key].$typeName$ + '" data-guid="' + model.get('$id$').id + '" ></i></a>', + url: traits[key].$typeName$.split(".").join("/"), + name: tagName.fullName + }); } }); - if (url.length == 0) { - if (model.get('$id$')) { - return { - html: ' <a href="javascript:void(0)" class="inputAssignTag" data-id="addTerm" data-guid="' + model.get('$id$').id + '"><i class="fa fa-folder-o"><span> Assign Term</span></i></a>' - } - } else { - return { - html: ' <a href="javascript:void(0)" class="inputAssignTag" data-id="addTerm"><i class="fa fa-folder-o"><span> Assign Term</span></i></a>' - } + _.each(terms, function(obj, i) { + var className = ""; + if (i >= 1) { + className += "showHideDiv hide"; } + obj['valueUrl'] = CommonViewFunction.breadcrumbUrlMaker(obj.url); + html += '<div class="' + className + '" dataterm-name="' + obj.name + '"><div class="liContent"></div>' + obj.deleteHtml + '</div>'; + }) + if (terms.length > 1) { + html += '<div><a href="javascript:void(0)" data-id="showMoreLessTerm" class="inputTag inputTagGreen"><span>Show More </span><i class="fa fa-angle-right"></i></a></div>' + } + if (model.get('$id$')) { + html += '<div><a href="javascript:void(0)" class="inputAssignTag" data-id="addTerm" data-guid="' + model.get('$id$').id + '"><i class="fa fa-folder-o">' + " " + 'Assign Term</i></a></div>' } else { - var value = CommonViewFunction.breadcrumbUrlMaker(url), - id = model.get('$id$').id - if (id && value) { - return { - html: '<div class="termTableBreadcrumb" dataTerm-id="' + id + '"><div class="liContent"></div>' + deleteHtml + '</div>', - object: { scopeId: id, value: value } - } - - } else { - return { - html: '<div class="termTableBreadcrumb"></div>' - } - } + html += '<div><a href="javascript:void(0)" class="inputAssignTag" data-id="addTerm"><i class="fa fa-folder-o">' + " " + 'Assign Term</i></a></div>' + } + return { + html: '<div class="termTableBreadcrumb" dataterm-id="' + id + '">' + html + '</div>', + object: { scopeId: id, value: terms } } + } CommonViewFunction.tagForTable = function(model) { var traits = model.get('$traits$'), @@ -333,6 +349,41 @@ define(['require', 'utils/Utils', 'modules/Modal', 'utils/Messages'], function(r return '<div class="tagList">' + atags + addTag + '</div>'; } + CommonViewFunction.saveTermToAsset = function(options) { + require(['models/VCatalog'], function(Vcatalog) { + var VCatalog = new Vcatalog(); + var name = options.termName; + VCatalog.url = function() { + return "api/atlas/v1/entities/" + options.guid + "/tags/" + name; + }; + VCatalog.save(null, { + beforeSend: function() {}, + success: function(data) { + Utils.notifySuccess({ + content: "Term " + name + Messages.addTermToEntitySuccessMessage + }); + if (options.callback) { + options.callback(); + } + if (options.collection) { + options.collection.fetch({ reset: true }); + } + }, + error: function(error, data, status) { + if (data && data.responseText) { + var data = JSON.parse(data.responseText); + Utils.notifyError({ + content: data.message + }); + if (options.callback) { + options.callback(); + } + } + }, + complete: function() {} + }); + }) + } CommonViewFunction.userDataFetch = function(options) { if (options.url) { $.ajax({ http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/c0cd9f0a/dashboardv2/public/js/utils/Messages.js ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/utils/Messages.js b/dashboardv2/public/js/utils/Messages.js index b94df69..f78ec87 100644 --- a/dashboardv2/public/js/utils/Messages.js +++ b/dashboardv2/public/js/utils/Messages.js @@ -23,7 +23,9 @@ define(['require'], function(require) { addSuccessMessage: " has been created successfully", addErrorMessage: " could not be Created", addTermToEntitySuccessMessage: " has been added to entity", - deleteTitle: "Are you sure you want to delete ?", + deleteTerm: "Delete Term", + deleteTag: "Delete Tag", + RemoveTerm: "Remove Term Assignment", deleteSuccessMessage: " has been deleted successfully", deleteErrorMessage: " could not be deleted", addAttributeSuccessMessage: "Tag attribute is added successfully", http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/c0cd9f0a/dashboardv2/public/js/utils/TableLayout.js ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/utils/TableLayout.js b/dashboardv2/public/js/utils/TableLayout.js index e513241..6528193 100644 --- a/dashboardv2/public/js/utils/TableLayout.js +++ b/dashboardv2/public/js/utils/TableLayout.js @@ -25,7 +25,8 @@ define(['require', 'backgrid-filter', 'backgrid-paginator', 'backgrid-sizeable', - 'backgrid-orderable' + 'backgrid-orderable', + 'backgrid-select-all' ], function(require, Backbone, FSTablelayoutTmpl) { 'use strict'; http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/c0cd9f0a/dashboardv2/public/js/utils/Utils.js ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/utils/Utils.js b/dashboardv2/public/js/utils/Utils.js index e867f2b..5e75e59 100644 --- a/dashboardv2/public/js/utils/Utils.js +++ b/dashboardv2/public/js/utils/Utils.js @@ -235,12 +235,14 @@ define(['require', 'utils/Globals'], function(require, Globals) { if (name.length > 1) { return { term: true, - name: name[name.length - 1] + name: name[name.length - 1], + fullName: value } } else { return { term: false, - name: name[name.length - 1] + name: name[name.length - 1], + fullName: value } } } http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/c0cd9f0a/dashboardv2/public/js/views/business_catalog/AddTermToEntityLayoutView.js ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/views/business_catalog/AddTermToEntityLayoutView.js b/dashboardv2/public/js/views/business_catalog/AddTermToEntityLayoutView.js index 0739abc..e35186c 100644 --- a/dashboardv2/public/js/views/business_catalog/AddTermToEntityLayoutView.js +++ b/dashboardv2/public/js/views/business_catalog/AddTermToEntityLayoutView.js @@ -22,8 +22,9 @@ define(['require', 'utils/Utils', 'modules/Modal', 'collection/VCatalogList', + 'utils/CommonViewFunction', 'utils/Messages' -], function(require, Backbone, AddTermToEntityLayoutViewTmpl, Utils, Modal, VCatalogList, Messages) { +], function(require, Backbone, AddTermToEntityLayoutViewTmpl, Utils, Modal, VCatalogList, CommonViewFunction, Messages) { 'use strict'; var AddTermToEntityLayoutView = Backbone.Marionette.LayoutView.extend( @@ -49,18 +50,44 @@ define(['require', * @constructs */ initialize: function(options) { - _.extend(this, _.pick(options, 'guid', 'modalCollection', 'callback')); + _.extend(this, _.pick(options, 'guid', 'modalCollection', 'callback', 'multiple', 'showLoader')); this.vCatalogList = new VCatalogList(); var that = this; this.modal = new Modal({ - title: 'Add Term', + title: 'Assign Term', content: this, - okText: 'Save', + okText: 'Assign', cancelText: "Cancel", allowCancel: true, }).open(); this.on('ok', function() { - that.saveTermToAsset(); + if (that.multiple) { + for (var i = 0; i < that.multiple.length; i++) { + if (i == 0) { + that.showLoader(); + } + var obj = { + termName: this.modal.$el.find('.taxonomyTree li.active a').data('name').split("`").join(""), + guid: that.multiple[i].id.id + } + if (that.multiple.length - 1 == i) { + obj['callback'] = function() { + that.callback(); + } + } + // if (that.multiple[i].model.get("$traits$") && !that.multiple[i].model.get("$traits$")[obj.termName]) { + CommonViewFunction.saveTermToAsset(obj); + // / } + } + } else { + CommonViewFunction.saveTermToAsset({ + termName: this.modal.$el.find('.taxonomyTree li.active a').data('name').split("`").join(""), + guid: this.guid, + callback: function() { + that.callback(); + } + }); + } }); this.on('closeModal', function() { this.modal.trigger('cancel'); @@ -77,40 +104,7 @@ define(['require', viewBased: false })); }); - }, - saveTermToAsset: function() { - var that = this; - var VCatalog = new this.vCatalogList.model(); - var termName = this.modal.$el.find('.taxonomyTree li.active a').data('name').split("`").join(""); - VCatalog.url = function() { - return "api/atlas/v1/entities/" + that.guid + "/tags/" + termName; - }; - VCatalog.save(null, { - beforeSend: function() {}, - success: function(data) { - Utils.notifySuccess({ - content: "Term " + termName + Messages.addTermToEntitySuccessMessage - }); - 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.messages - }); - } - }, - complete: function() {} - }); - } }); return AddTermToEntityLayoutView; - }); http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/c0cd9f0a/dashboardv2/public/js/views/business_catalog/TreeLayoutView.js ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/views/business_catalog/TreeLayoutView.js b/dashboardv2/public/js/views/business_catalog/TreeLayoutView.js index 88f96cd..63eaa3e 100644 --- a/dashboardv2/public/js/views/business_catalog/TreeLayoutView.js +++ b/dashboardv2/public/js/views/business_catalog/TreeLayoutView.js @@ -427,7 +427,7 @@ define(['require', container: this.$el, template: '<div class="popover fixedPopover fade bottom in"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>', content: function() { - var li = "<li class='listTerm'><i class='fa fa-plus'></i> <a href='javascript:void(0)' data-fn='onAddTerm'>Add Subterm</a></li>"; + var li = "<li class='listTerm'><i class='fa fa-plus'></i> <a href='javascript:void(0)' data-fn='onAddTerm'>Create Subterm</a></li>"; /* "<li class='listTerm' ><i class='fa fa-arrow-right'></i> <a href='javascript:void(0)' data-fn='moveTerm'>Move Term</a></li>" + "<li class='listTerm' ><i class='fa fa-edit'></i> <a href='javascript:void(0)' data-fn='onEditTerm'>Edit Term</a></li>" +*/ var termDataURL = Utils.getUrlState.getQueryUrl().hash.split("terms"); @@ -457,12 +457,12 @@ define(['require', model: new that.parentCollection.model() }); var modal = new Modal({ - title: 'Create a new subterm', + title: 'Create Sub-term', content: view, okCloses: true, showFooter: true, allowCancel: true, - okText: 'Add', + okText: 'Create', }).open(); modal.$el.find('button.ok').attr('disabled', true); modal.on('ok', function() { http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/c0cd9f0a/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 04b98af..f2838b1 100644 --- a/dashboardv2/public/js/views/detail_page/DetailPageLayoutView.js +++ b/dashboardv2/public/js/views/detail_page/DetailPageLayoutView.js @@ -198,7 +198,6 @@ define(['require', } 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>'; - that.ui.addTerm.hide(); } }); @@ -206,9 +205,6 @@ define(['require', this.ui.termList.find("span.inputTag").remove(); this.ui.tagList.prepend(tagData); this.ui.termList.prepend(termData); - if (this.ui.termList.find("span.term").length == 0) { - this.ui.addTerm.show(); - } }, saveTagFromList: function(ref) { var that = this; http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/c0cd9f0a/dashboardv2/public/js/views/schema/SchemaLayoutView.js ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/views/schema/SchemaLayoutView.js b/dashboardv2/public/js/views/schema/SchemaLayoutView.js index 1a9e9be..55e7093 100644 --- a/dashboardv2/public/js/views/schema/SchemaLayoutView.js +++ b/dashboardv2/public/js/views/schema/SchemaLayoutView.js @@ -41,14 +41,15 @@ define(['require', tagClick: '[data-id="tagClick"]', addTag: "[data-id='addTag']", addTerm: '[data-id="addTerm"]', - showMoreLess: '[data-id="showMoreLess"]' + showMoreLess: '[data-id="showMoreLess"]', + showMoreLessTerm: '[data-id="showMoreLessTerm"]' }, /** ui events hash */ events: function() { var events = {}; events["click " + this.ui.addTag] = 'addTagModalView'; - events["click " + this.ui.addTerm] = 'addTermModalView'; + events["click " + this.ui.addTerm] = 'checkedValue'; events["click " + this.ui.tagClick] = function(e) { if (e.target.nodeName.toLocaleLowerCase() == "i") { this.onClickTagCross(e); @@ -70,6 +71,15 @@ define(['require', $(e.currentTarget).find('span').text('Show less'); } }; + events["click " + this.ui.showMoreLessTerm] = function(e) { + $(e.currentTarget).find('i').toggleClass('fa fa-angle-right fa fa-angle-up'); + $(e.currentTarget).parents('.searchTerm').find('div.termTableBreadcrumb>div.showHideDiv').toggleClass('hide'); + if ($(e.currentTarget).find('i').hasClass('fa-angle-right')) { + $(e.currentTarget).find('span').text('Show More'); + } else { + $(e.currentTarget).find('span').text('Show less'); + } + }; return events; }, /** @@ -97,6 +107,26 @@ define(['require', this.bradCrumbList = []; }, bindEvents: function() { + this.listenTo(this.schemaCollection, 'backgrid:selected', function(model, checked) { + if (checked === true) { + model.set("isEnable", true); + this.$('.multiSelect').show(); + } else { + model.set("isEnable", false); + this.$('.multiSelect').hide(); + } + this.arr = []; + var that = this; + this.schemaCollection.find(function(item) { + if (item.get('isEnable')) { + var term = []; + that.arr.push({ + id: item.get("$id$"), + model: item + }); + } + }); + }); this.listenTo(this.schemaCollection, "reset", function(value) { this.renderTableLayoutView(); $('.schemaTable').show(); @@ -116,21 +146,47 @@ define(['require', this.schemaCollection.fetch({ reset: true }); }, renderTableLayoutView: function() { - var that = this; + var that = this, + count = 5; require(['utils/TableLayout'], function(TableLayout) { - var cols = new Backgrid.Columns(that.getSchemaTableColumns()); + var columnCollection = Backgrid.Columns.extend({ + sortKey: "position", + comparator: function(item) { + return item.get(this.sortKey) || 999; + }, + setPositions: function() { + _.each(this.models, function(model, index) { + if (model.get('name') == "name") { + model.set("position", 2, { silent: true }); + model.set("label", "Name"); + } else if (model.get('name') == "description") { + model.set("position", 3, { silent: true }); + model.set("label", "Description"); + } else if (model.get('name') == "owner") { + model.set("position", 4, { silent: true }); + model.set("label", "Owner"); + } + }); + return this; + } + }); + var columns = new columnCollection(that.getSchemaTableColumns()); + columns.setPositions().sort(); that.RTagLayoutView.show(new TableLayout(_.extend({}, that.commonTableOptions, { globalVent: that.globalVent, - columns: cols + columns: columns }))); + that.$('.multiSelect').hide(); that.renderBreadcrumb(); }); }, renderBreadcrumb: function() { var that = this; _.each(this.bradCrumbList, function(object) { - var scopeObject = that.$('[dataTerm-id="' + object.scopeId + '"]').find('.liContent'); - CommonViewFunction.breadcrumbMaker({ urlList: object.value, scope: scopeObject }); + _.each(object.value, function(subObj) { + var scopeObject = that.$('[dataterm-id="' + object.scopeId + '"]').find('[dataterm-name="' + subObj.name + '"] .liContent'); + CommonViewFunction.breadcrumbMaker({ urlList: subObj.valueUrl, scope: scopeObject }); + }); }); }, getSchemaTableColumns: function() { @@ -176,6 +232,13 @@ define(['require', }) }; }); + col['Check'] = { + name: "selected", + label: "", + cell: "select-row", + headerCell: "select-all", + position: 1 + }; col['tag'] = { label: "Tags", cell: "Html", @@ -197,7 +260,7 @@ define(['require', className: 'searchTerm', formatter: _.extend({}, Backgrid.CellFormatter.prototype, { fromRaw: function(rawValue, model) { - var returnObject = CommonViewFunction.termTableBreadcrumbMaker(model); + var returnObject = CommonViewFunction.termTableBreadcrumbMaker(model, "schema"); if (returnObject.object) { that.bradCrumbList.push(returnObject.object); } @@ -208,6 +271,19 @@ define(['require', } return this.schemaCollection.constructor.getTableCols(col, this.schemaCollection); }, + checkedValue: function(e) { + if (e) { + e.stopPropagation(); + } + var guid = "", + that = this; + if (this.arr && this.arr.length) { + that.addTermModalView(guid, this.arr); + } else { + guid = that.$(e.currentTarget).data("guid"); + that.addTermModalView(guid); + } + }, addTagModalView: function(e) { if (e) { e.stopPropagation(); @@ -225,27 +301,30 @@ define(['require', // } }); }, - addTermModalView: function(e) { - if (e) { - e.stopPropagation(); - } + addTermModalView: function(guid, multiple) { + var that = this; require([ 'views/business_catalog/AddTermToEntityLayoutView', ], function(AddTermToEntityLayoutView) { var view = new AddTermToEntityLayoutView({ - guid: that.$(e.currentTarget).data("guid"), - callback: function() { + guid: guid, + multiple: multiple, + callback: function(termName) { that.fetchCollection(); + that.arr = []; + }, + showLoader: function() { + that.$('.fontLoader').show(); + that.$('.searchTable').hide(); } }); }); - }, onClickTagCross: function(e) { var tagName = $(e.target).data("name"), that = this, - modal = CommonViewFunction.deleteTagModel(tagName); + modal = CommonViewFunction.deleteTagModel(tagName, "assignTerm"); modal.on('ok', function() { that.deleteTagData(e); }); http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/c0cd9f0a/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 953a539..f792baa 100644 --- a/dashboardv2/public/js/views/search/SearchResultLayoutView.js +++ b/dashboardv2/public/js/views/search/SearchResultLayoutView.js @@ -47,7 +47,8 @@ define(['require', tagClick: '[data-id="tagClick"]', addTag: '[data-id="addTag"]', addTerm: '[data-id="addTerm"]', - showMoreLess: '[data-id="showMoreLess"]' + showMoreLess: '[data-id="showMoreLess"]', + showMoreLessTerm: '[data-id="showMoreLessTerm"]' }, /** ui events hash */ @@ -77,7 +78,7 @@ define(['require', } }; events["click " + this.ui.addTag] = 'addTagModalView'; - events["click " + this.ui.addTerm] = 'addTermModalView'; + events["click " + this.ui.addTerm] = 'checkedValue'; events["click " + this.ui.showMoreLess] = function(e) { $(e.currentTarget).find('i').toggleClass('fa fa-angle-right fa fa-angle-up'); $(e.currentTarget).parents('.searchTag').find('a').toggleClass('hide show'); @@ -87,6 +88,15 @@ define(['require', $(e.currentTarget).find('span').text('Show less'); } }; + events["click " + this.ui.showMoreLessTerm] = function(e) { + $(e.currentTarget).find('i').toggleClass('fa fa-angle-right fa fa-angle-up'); + $(e.currentTarget).parents('.searchTerm').find('div.termTableBreadcrumb>div.showHideDiv').toggleClass('hide'); + if ($(e.currentTarget).find('i').hasClass('fa-angle-right')) { + $(e.currentTarget).find('span').text('Show More'); + } else { + $(e.currentTarget).find('span').text('Show less'); + } + }; return events; }, /** @@ -114,8 +124,29 @@ define(['require', }; this.bindEvents(); this.bradCrumbList = []; + this.arr = []; }, bindEvents: function() { + this.listenTo(this.searchCollection, 'backgrid:selected', function(model, checked) { + if (checked === true) { + model.set("isEnable", true); + this.$('.searchResult').find(".inputAssignTag.multiSelect").show(); + } else { + model.set("isEnable", false); + this.$('.searchResult').find(".inputAssignTag.multiSelect").hide(); + } + this.arr = []; + var that = this; + this.searchCollection.find(function(item) { + if (item.get('isEnable')) { + var term = []; + that.arr.push({ + id: item.get("$id$"), + model: item + }); + } + }); + }); this.listenTo(this.vent, "show:searchResult", function(value) { this.fetchCollection(value); this.REntityTableLayoutView.reset(); @@ -125,7 +156,9 @@ define(['require', this.checkTableFetch(); } this.renderTableLayoutView(); - this.$('.searchResult').html(this.searchCollection.fullCollection.length + ' result for <b>' + this.searchCollection.queryParams.query + '</b>'); + var resultData = this.searchCollection.fullCollection.length + ' result for <b>' + this.searchCollection.queryParams.query + '</b>' + var multiAssignData = '<a href="javascript:void(0)" class="inputAssignTag multiSelect" style="display:none" data-id="addTerm"><i class="fa fa-folder-o">' + " " + 'Assign Term</i></a>' + this.$('.searchResult').html(resultData + multiAssignData); }, this); this.listenTo(this.searchCollection, "error", function(value, responseData) { this.$('.fontLoader').hide(); @@ -169,7 +202,7 @@ define(['require', }, renderTableLayoutView: function() { var that = this, - count = 4; + count = 5; require(['utils/TableLayout'], function(TableLayout) { var columnCollection = Backgrid.Columns.extend({ sortKey: "position", @@ -179,18 +212,15 @@ define(['require', setPositions: function() { _.each(this.models, function(model, index) { if (model.get('name') == "name") { - model.set("position", 1, { silent: true }); + model.set("position", 2, { silent: true }); model.set("label", "Name"); } else if (model.get('name') == "description") { - model.set("position", 2, { silent: true }); + model.set("position", 3, { silent: true }); model.set("label", "Description"); } else if (model.get('name') == "owner") { - model.set("position", 3, { silent: true }); + model.set("position", 4, { silent: true }); model.set("label", "Owner"); } - // } else { - // model.set("position", ++count, { silent: true }); - // } }); return this; } @@ -202,14 +232,17 @@ define(['require', columns: columns, includeOrderAbleColumns: true }))); + that.$('.searchResult').find(".inputAssignTag.multiSelect").hide(); that.renderBreadcrumb(); }); }, renderBreadcrumb: function() { var that = this; _.each(this.bradCrumbList, function(object) { - var scopeObject = that.$('[dataTerm-id="' + object.scopeId + '"]').find('.liContent'); - CommonViewFunction.breadcrumbMaker({ urlList: object.value, scope: scopeObject }); + _.each(object.value, function(subObj) { + var scopeObject = that.$('[dataterm-id="' + object.scopeId + '"]').find('[dataterm-name="' + subObj.name + '"] .liContent'); + CommonViewFunction.breadcrumbMaker({ urlList: subObj.valueUrl, scope: scopeObject }); + }); }); }, checkTableFetch: function() { @@ -227,6 +260,13 @@ define(['require', if (responseData.dataType.attributeDefinitions.length == 2 && responseData.dataType.attributeDefinitions[1].name == "instanceInfo") { return this.getFixedColumn(); } else { + col['Check'] = { + name: "selected", + label: "", + cell: "select-row", + headerCell: "select-all", + position: 1 + }; var modelJSON = this.searchCollection.toJSON()[0]; _.keys(modelJSON).map(function(key) { if (key.indexOf("$") == -1 && typeof modelJSON[key] != "object") { @@ -387,25 +427,40 @@ define(['require', // } }); }, - addTermModalView: function(e) { + checkedValue: function(e) { + var guid = "", + that = this; + if (this.arr && this.arr.length) { + that.addTermModalView(guid, this.arr); + } else { + guid = that.$(e.currentTarget).data("guid"); + that.addTermModalView(guid); + } + }, + addTermModalView: function(guid, multiple) { var that = this; require([ 'views/business_catalog/AddTermToEntityLayoutView', ], function(AddTermToEntityLayoutView) { var view = new AddTermToEntityLayoutView({ - guid: that.$(e.currentTarget).data("guid"), - callback: function() { + guid: guid, + multiple: multiple, + callback: function(termName) { that.fetchCollection(); + that.arr = []; + }, + showLoader: function() { + that.$('.fontLoader').show(); + that.$('.searchTable').hide(); } }); }); - }, onClickTagCross: function(e) { var tagName = $(e.target).data("name"), guid = $(e.target).data("guid"), that = this, - modal = CommonViewFunction.deleteTagModel(tagName); + modal = CommonViewFunction.deleteTagModel(tagName, "assignTerm"); modal.on('ok', function() { that.deleteTagData(e); });
