You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@atlas.apache.org by kb...@apache.org on 2016/08/05 11:05:54 UTC

incubator-atlas git commit: ATLAS-1090 : UI: Multi-Select Tagging. (Kalyanikashikar via kevalbhatt)

Repository: incubator-atlas
Updated Branches:
  refs/heads/master d1940ba75 -> d671b1276


ATLAS-1090 : UI: Multi-Select Tagging. (Kalyanikashikar via kevalbhatt)


Project: http://git-wip-us.apache.org/repos/asf/incubator-atlas/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-atlas/commit/d671b127
Tree: http://git-wip-us.apache.org/repos/asf/incubator-atlas/tree/d671b127
Diff: http://git-wip-us.apache.org/repos/asf/incubator-atlas/diff/d671b127

Branch: refs/heads/master
Commit: d671b12768b19d9d2b4e84c3528db1bec43388de
Parents: d1940ba
Author: kalyanikk <ka...@freestoneinfotech.com>
Authored: Fri Aug 5 12:45:15 2016 +0530
Committer: Keval Bhatt <kb...@apache.org>
Committed: Fri Aug 5 16:34:40 2016 +0530

----------------------------------------------------------------------
 dashboardv2/public/css/scss/tag.scss            |  4 +
 .../schema/SchemaTableLayoutView_tmpl.html      |  3 +-
 .../search/SearchResultLayoutView_tmpl.html     |  2 +-
 .../public/js/utils/CommonViewFunction.js       |  6 +-
 .../public/js/views/schema/SchemaLayoutView.js  | 81 ++++++++++++--------
 .../js/views/search/SearchResultLayoutView.js   | 61 ++++++++++-----
 .../public/js/views/tag/addTagModalView.js      | 54 +++++++++----
 release-log.txt                                 |  1 +
 8 files changed, 143 insertions(+), 69 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/d671b127/dashboardv2/public/css/scss/tag.scss
----------------------------------------------------------------------
diff --git a/dashboardv2/public/css/scss/tag.scss b/dashboardv2/public/css/scss/tag.scss
index faae3d1..fa194fa 100644
--- a/dashboardv2/public/css/scss/tag.scss
+++ b/dashboardv2/public/css/scss/tag.scss
@@ -315,6 +315,10 @@ form-control .tagInpput {
     float: right;
 }
 
+.multiSelectTerm {
+    float: right;
+}
+
 .multiSelectTag {
     float: right;
 }

http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/d671b127/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 43447d9..7eb14b3 100644
--- a/dashboardv2/public/js/templates/schema/SchemaTableLayoutView_tmpl.html
+++ b/dashboardv2/public/js/templates/schema/SchemaTableLayoutView_tmpl.html
@@ -14,5 +14,6 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
 -->
-<a href="javascript:void(0)" class="inputAssignTag multiSelect" style="display:none" data-id="addTerm"><i class="fa fa-folder-o"></i> Assign Term</a>
+<a href="javascript:void(0)" class="inputAssignTag multiSelectTerm" style="display:none" data-id="addTerm"><i class="fa fa-folder-o"></i> Assign Term</a>
+<a href="javascript:void(0)" class="inputAssignTag multiSelectTag assignTag" style="display:none" data-id="addAssignTag"><i class="fa fa-plus"></i> Assign Tag</a>
 <div id="r_tagLayoutView"></div>

http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/d671b127/dashboardv2/public/js/templates/search/SearchResultLayoutView_tmpl.html
----------------------------------------------------------------------
diff --git a/dashboardv2/public/js/templates/search/SearchResultLayoutView_tmpl.html b/dashboardv2/public/js/templates/search/SearchResultLayoutView_tmpl.html
index 1ea6189..609ec23 100644
--- a/dashboardv2/public/js/templates/search/SearchResultLayoutView_tmpl.html
+++ b/dashboardv2/public/js/templates/search/SearchResultLayoutView_tmpl.html
@@ -21,7 +21,7 @@
     <div class="ellipsis"><span class="searchResult" style=" font-size: 16px;"></span></div>
     <div class="searchTable">
         <span class="labelShowRecord pull-left" data-id="pageRecordText"></span>
-        <div data-id="paginationDiv">
+        <div data-id="paginationDiv" style="display:none">
             <ul class="pager pull-right">
                 <li>
                     <button class="btn" data-id="previousData" disabled=true>Previous</button>

http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/d671b127/dashboardv2/public/js/utils/CommonViewFunction.js
----------------------------------------------------------------------
diff --git a/dashboardv2/public/js/utils/CommonViewFunction.js b/dashboardv2/public/js/utils/CommonViewFunction.js
index 79e50b7..b8c8dea 100644
--- a/dashboardv2/public/js/utils/CommonViewFunction.js
+++ b/dashboardv2/public/js/utils/CommonViewFunction.js
@@ -449,12 +449,12 @@ define(['require', 'utils/Utils', 'modules/Modal', 'utils/Messages', 'utils/Glob
             }
         });
         if (model.get('$id$')) {
-            addTag += '<a href="javascript:void(0)" data-id="addTag" class="inputTagAdd" data-guid="' + model.get('$id$').id + '" ><i class="fa fa-plus"></i></a>';
+            addTag += '<a href="javascript:void(0)" data-id="addTag" class="inputTagAdd assignTag" data-guid="' + model.get('$id$').id + '" ><i class="fa fa-plus"></i></a>';
         } else {
-            addTag += '<a href="javascript:void(0)" data-id="addTag" class="inputTagAdd"><i style="right:0" class="fa fa-plus"></i></a>';
+            addTag += '<a href="javascript:void(0)" data-id="addTag" class="inputTagAdd assignTag"><i style="right:0" class="fa fa-plus"></i></a>';
         }
         if (count > 1) {
-            addTag += '<div data-id="showMoreLess" class="inputTagAdd tagDetailPopover"><i class="fa fa-ellipsis-h" aria-hidden="true"></i></div>'
+            addTag += '<div data-id="showMoreLess" class="inputTagAdd assignTag tagDetailPopover"><i class="fa fa-ellipsis-h" aria-hidden="true"></i></div>'
         }
         return '<div class="tagList">' + atags + addTag + '<div class="popover popoverTag bottom" style="display:none"><div class="arrow"></div><div class="popover-content popoverContainer">' + popTag + '</div></div></div>';
     }

http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/d671b127/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 13896ab..228ef7d 100644
--- a/dashboardv2/public/js/views/schema/SchemaLayoutView.js
+++ b/dashboardv2/public/js/views/schema/SchemaLayoutView.js
@@ -44,13 +44,15 @@ define(['require',
                 addTag: "[data-id='addTag']",
                 addTerm: '[data-id="addTerm"]',
                 showMoreLess: '[data-id="showMoreLess"]',
-                showMoreLessTerm: '[data-id="showMoreLessTerm"]'
+                showMoreLessTerm: '[data-id="showMoreLessTerm"]',
+                addAssignTag: "[data-id='addAssignTag']"
             },
             /** ui events hash */
             events: function() {
                 var events = {};
-                events["click " + this.ui.addTag] = 'addTagModalView';
+                events["click " + this.ui.addTag] = 'checkedValue';
                 events["click " + this.ui.addTerm] = 'checkedValue';
+                events["click " + this.ui.addAssignTag] = 'checkedValue';
                 events["click " + this.ui.tagClick] = function(e) {
                     if (e.target.nodeName.toLocaleLowerCase() == "i") {
                         this.onClickTagCross(e);
@@ -110,10 +112,14 @@ define(['require',
                 this.listenTo(this.schemaCollection, 'backgrid:selected', function(model, checked) {
                     if (checked === true) {
                         model.set("isEnable", true);
-                        this.$('.multiSelect').show();
+                        if (Globals.taxonomy) {
+                            this.$('.multiSelectTerm').show();
+                        }
+                        this.$('.multiSelectTag').show();
                     } else {
                         model.set("isEnable", false);
-                        this.$('.multiSelect').hide();
+                        this.$('.multiSelectTerm').hide();
+                        this.$('.multiSelectTag').hide();
                     }
                     this.arr = [];
                     var that = this;
@@ -127,11 +133,6 @@ define(['require',
                         }
                     });
                 });
-                this.listenTo(this.schemaCollection, "reset", function(value) {
-                    this.renderTableLayoutView();
-                    $('.schemaTable').show();
-                    this.$('.fontLoader').hide();
-                }, this);
                 this.listenTo(this.schemaCollection, "error", function(value) {
                     $('.schemaTable').hide();
                     this.$('.fontLoader').hide();
@@ -139,7 +140,7 @@ define(['require',
             },
             onRender: function() {
                 var that = this;
-                this.schemaCollection.fetch({ reset: true });
+                this.fetchCollection();
                 this.renderTableLayoutView();
                 $('body').click(function(e) {
                     var iconEvnt = e.target.nodeName;
@@ -152,8 +153,16 @@ define(['require',
                 });
             },
             fetchCollection: function() {
+                var that = this;
                 this.$('.fontLoader').show();
-                this.schemaCollection.fetch({ reset: true });
+                this.schemaCollection.fetch({
+                    success: function() {
+                        that.renderTableLayoutView();
+                        $('.schemaTable').show();
+                        that.$('.fontLoader').hide();
+                    },
+                    silent: true
+                });
             },
             renderTableLayoutView: function() {
                 var that = this,
@@ -170,7 +179,8 @@ define(['require',
                         globalVent: that.globalVent,
                         columns: columns
                     })));
-                    that.$('.multiSelect').hide();
+                    that.$('.multiSelectTerm').hide();
+                    that.$('.multiSelectTag').hide();
                     that.renderBreadcrumb();
                 });
             },
@@ -226,15 +236,13 @@ define(['require',
                             })
                         };
                     });
-                    if (Globals.taxonomy) {
-                        col['Check'] = {
-                            name: "selected",
-                            label: "",
-                            cell: "select-row",
-                            headerCell: "select-all",
-                            position: 1
-                        };
-                    }
+                    col['Check'] = {
+                        name: "selected",
+                        label: "",
+                        cell: "select-row",
+                        headerCell: "select-all",
+                        position: 1
+                    };
                     col['tag'] = {
                         label: "Tags",
                         cell: "Html",
@@ -275,23 +283,36 @@ define(['require',
                 }
                 var guid = "",
                     that = this;
-                if (this.arr && this.arr.length) {
-                    that.addTermModalView(guid, this.arr);
+                var multiSelectTag = $(e.currentTarget).hasClass('assignTag');
+                if (multiSelectTag) {
+                    if (this.arr && this.arr.length && multiSelectTag) {
+                        that.addTagModalView(guid, this.arr);
+                    } else {
+                        guid = that.$(e.currentTarget).data("guid");
+                        that.addTagModalView(guid);
+                    }
                 } else {
-                    guid = that.$(e.currentTarget).data("guid");
-                    that.addTermModalView(guid);
+                    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();
-                }
+            addTagModalView: function(guid, multiple) {
                 var that = this;
                 require(['views/tag/addTagModalView'], function(AddTagModalView) {
                     var view = new AddTagModalView({
-                        guid: that.$(e.currentTarget).data("guid"),
+                        guid: guid,
+                        multiple: multiple,
                         callback: function() {
                             that.fetchCollection();
+                            that.arr = [];
+                        },
+                        showLoader: function() {
+                            that.$('.fontLoader').show();
+                            that.$('.searchTable').hide();
                         }
                     });
                     // view.saveTagData = function() {

http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/d671b127/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 6510585..4b3a8e1 100644
--- a/dashboardv2/public/js/views/search/SearchResultLayoutView.js
+++ b/dashboardv2/public/js/views/search/SearchResultLayoutView.js
@@ -54,7 +54,8 @@ define(['require',
                 paginationDiv: '[data-id="paginationDiv"]',
                 previousData: "[data-id='previousData']",
                 nextData: "[data-id='nextData']",
-                pageRecordText: "[data-id='pageRecordText']"
+                pageRecordText: "[data-id='pageRecordText']",
+                addAssignTag: "[data-id='addAssignTag']"
             },
 
             /** ui events hash */
@@ -82,8 +83,9 @@ define(['require',
                         }
                     }
                 };
-                events["click " + this.ui.addTag] = 'addTagModalView';
+                events["click " + this.ui.addTag] = 'checkedValue';
                 events["click " + this.ui.addTerm] = 'checkedValue';
+                events["click " + this.ui.addAssignTag] = 'checkedValue';
                 events["click " + this.ui.showMoreLess] = function(e) {
                     $(e.currentTarget).parents('tr').siblings().find("div.popover.popoverTag").hide();
                     $(e.currentTarget).parent().find("div.popover").toggle();
@@ -142,9 +144,11 @@ define(['require',
                     if (checked === true) {
                         model.set("isEnable", true);
                         this.$('.searchResult').find(".inputAssignTag.multiSelect").show();
+                        this.$('.searchResult').find(".inputAssignTag.multiSelectTag").show();
                     } else {
                         model.set("isEnable", false);
                         this.$('.searchResult').find(".inputAssignTag.multiSelect").hide();
+                        this.$('.searchResult').find(".inputAssignTag.multiSelectTag").hide();
                     }
                     this.arr = [];
                     this.searchCollection.find(function(item) {
@@ -259,8 +263,14 @@ define(['require',
                             that.startRenderTableProcess();
                         }
                         var resultData = 'Results for <b>' + that.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"></i>' + " " + 'Assign Term</a>'
-                        that.$('.searchResult').html(resultData + multiAssignData);
+                        var multiAssignDataTag = '<a href="javascript:void(0)" class="inputAssignTag multiSelectTag assignTag" style="display:none" data-id="addAssignTag"><i class="fa fa-plus"></i>' + " " + 'Assign Tag</a>'
+                        if (Globals.taxonomy) {
+                            var multiAssignDataTerm = '<a href="javascript:void(0)" class="inputAssignTag multiSelect" style="display:none" data-id="addTerm"><i class="fa fa-folder-o"></i>' + " " + 'Assign Term</a>'
+                            that.$('.searchResult').html(resultData + multiAssignDataTerm + multiAssignDataTag);
+                        } else {
+                            that.$('.searchResult').html(resultData + multiAssignDataTag);
+                        }
+
                     },
                     silent: true
                 });
@@ -277,6 +287,7 @@ define(['require',
                         globalVent: that.globalVent,
                         columns: columns
                     })));
+                    that.ui.paginationDiv.show();
                     that.$('.searchResult').find(".inputAssignTag.multiSelect").hide();
                     that.renderBreadcrumb();
                 });
@@ -401,14 +412,12 @@ define(['require',
                         that.searchCollection.remove(model);
                     }
                 }
-                if (Globals.taxonomy) {
-                    col['Check'] = {
-                        name: "selected",
-                        label: "",
-                        cell: "select-row",
-                        headerCell: "select-all"
-                    };
-                }
+                col['Check'] = {
+                    name: "selected",
+                    label: "",
+                    cell: "select-row",
+                    headerCell: "select-all"
+                };
                 if (nameCheck > 0) {
                     col['name'] = {
                         label: "Name",
@@ -535,13 +544,19 @@ define(['require',
                 that.checkTableFetch();
                 return this.searchCollection.constructor.getTableCols(col, this.searchCollection);
             },
-            addTagModalView: function(e) {
+            addTagModalView: function(guid, multiple) {
                 var that = this;
                 require(['views/tag/addTagModalView'], function(AddTagModalView) {
                     var view = new AddTagModalView({
-                        guid: that.$(e.currentTarget).data("guid"),
+                        guid: guid,
+                        multiple: multiple,
                         callback: function() {
                             that.fetchCollection();
+                            that.arr = [];
+                        },
+                        showLoader: function() {
+                            that.$('.fontLoader').show();
+                            that.$('.searchTable').hide();
                         }
                     });
                     // view.saveTagData = function() {
@@ -552,11 +567,21 @@ define(['require',
             checkedValue: function(e) {
                 var guid = "",
                     that = this;
-                if (this.arr && this.arr.length) {
-                    that.addTermModalView(guid, this.arr);
+                var multiSelectTag = $(e.currentTarget).hasClass('assignTag');
+                if (multiSelectTag) {
+                    if (this.arr && this.arr.length && multiSelectTag) {
+                        that.addTagModalView(guid, this.arr);
+                    } else {
+                        guid = that.$(e.currentTarget).data("guid");
+                        that.addTagModalView(guid);
+                    }
                 } else {
-                    guid = that.$(e.currentTarget).data("guid");
-                    that.addTermModalView(guid);
+                    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) {

http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/d671b127/dashboardv2/public/js/views/tag/addTagModalView.js
----------------------------------------------------------------------
diff --git a/dashboardv2/public/js/views/tag/addTagModalView.js b/dashboardv2/public/js/views/tag/addTagModalView.js
index 877c64d..c29ad25 100644
--- a/dashboardv2/public/js/views/tag/addTagModalView.js
+++ b/dashboardv2/public/js/views/tag/addTagModalView.js
@@ -45,7 +45,7 @@ define(['require',
          */
         initialize: function(options) {
             var that = this;
-            _.extend(this, _.pick(options, 'vent', 'modalCollection', 'guid', 'callback'));
+            _.extend(this, _.pick(options, 'vent', 'modalCollection', 'guid', 'callback', 'multiple', 'showLoader'));
             this.collection = new VTagList();
             this.commonCollection = new VCommonList();
             this.modal = new Modal({
@@ -55,10 +55,33 @@ define(['require',
                 cancelText: "Cancel",
                 allowCancel: true,
             }).open();
-            // var saveBtn = this.modal.$el.find('.btn-atlas');
-            // saveBtn[0].setAttribute('disabled', true);
             this.on('ok', function() {
-                that.saveTagData();
+                if (that.multiple) {
+                    for (var i = 0; i < that.multiple.length; i++) {
+                        if (i == 0) {
+                            that.showLoader();
+                        }
+                        var obj = {
+                            tagName: this.ui.addTagOptions.val(),
+                            guid: that.multiple[i].id.id
+                        }
+                        if (that.multiple.length - 1 == i) {
+                            obj['callback'] = function() {
+                                that.callback();
+                            }
+                        }
+
+                        that.saveTagData(obj);
+                    }
+                } else {
+                    that.saveTagData({
+                        tagName: that.ui.addTagOptions.val(),
+                        guid: that.guid,
+                        callback: function() {
+                            that.callback();
+                        }
+                    });
+                }
             });
             this.on('closeModal', function() {
                 this.modal.trigger('cancel');
@@ -120,32 +143,28 @@ define(['require',
                 }
             }
         },
-        saveTagData: function() {
+        saveTagData: function(options) {
             var that = this,
                 values = {};
             this.entityModel = new VEntity();
-            var names = this.$(".attrName");
-            names.each(function(i, item) {
-                var selection = $(item).data("key");
-                values[selection] = $(item).val();
-            });
+            var name = options.tagName;
             var tagName = this.ui.addTagOptions.val();
             var json = {
                 "jsonClass": "org.apache.atlas.typesystem.json.InstanceSerialization$_Struct",
-                "typeName": tagName,
+                "typeName": name,
                 "values": values
             };
-            that.entityModel.saveEntity(that.guid, {
+            that.entityModel.saveEntity(options.guid, {
                 data: JSON.stringify(json),
                 success: function(data) {
                     Utils.notifySuccess({
                         content: "Tag " + tagName + " has been added to entity"
                     });
-                    if (that.callback) {
-                        that.callback();
+                    if (options.callback) {
+                        options.callback();
                     }
-                    if (that.modalCollection) {
-                        that.modalCollection.fetch({ reset: true });
+                    if (options.modalCollection) {
+                        options.modalCollection.fetch({ reset: true });
                     }
                 },
                 error: function(error, data, status) {
@@ -157,6 +176,9 @@ define(['require',
                     Utils.notifyError({
                         content: message
                     });
+                    if (options.callback) {
+                        options.callback();
+                    }
                 },
                 complete: function() {}
             });

http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/d671b127/release-log.txt
----------------------------------------------------------------------
diff --git a/release-log.txt b/release-log.txt
index e4aac5e..102ca16 100644
--- a/release-log.txt
+++ b/release-log.txt
@@ -6,6 +6,7 @@ INCOMPATIBLE CHANGES:
 
 
 ALL CHANGES:
+ATLAS-1090 UI: Multi-Select Tagging. (Kalyanikashikar via kevalbhatt)
 ATLAS-1092 Add Table.CreateTime to process qualified Name for all hive_process (sumasai via shwethags)
 ATLAS-1096 Modify HveMetaStoreBridge.import to use getEntity instead of DSL (sumasai via shwethags)
 ATLAS-1091 Improvement in DSL search functionality. (kevalbhatt)