ATLAS-3159 : UI : Add Reset button for Lienage

dashboardv2/public/js/templates/graph/LineageLayoutView_tmpl.html

@@ -90,7 +90,12 @@
     </div>
     <div class="graph-button-group pull-right">
         <div>
-            <button data-id="saveSvg" class="disabled btn btn-action btn-gray btn-sm" title="Export to PNG">
+            <button data-id="resetLineage" class="btn btn-action btn-gray btn-sm" title="Realign Lineage">
+                <i class="fa fa-retweet"></i>
+            </button>
+        </div>
+        <div>
+            <button data-id="saveSvg" class="btn btn-action btn-gray btn-sm" title="Export to PNG">
                 <i class="fa fa-camera"></i>
             </button>
         </div>
@@ -133,9 +138,9 @@
         <i class="fa fa-refresh fa-spin-custom"></i>
     </div>
     <div class="legends pull-left" style="height: 25px; padding: 2px;">
-        <span style="margin-right: 8px; color:#fb4200;"><i class="fa fa-circle-o fa-fw" aria-hidden="true"></i>Current Entity</span>
-        <span style="margin-right: 8px; color:#df9b00;"><i class="fa fa-long-arrow-right fa-fw" aria-hidden="true"></i>Lineage</span>
-        <span style="margin-right: 8px; color:#fb4200;"><i class="fa fa-long-arrow-right fa-fw" aria-hidden="true"></i>Impact</span>
+        <span style="margin-right: 8px; color:#fb4200;"><i class="fa fa-circle-o fa-fw"></i>Current Entity</span>
+        <span style="margin-right: 8px; color:#df9b00;"><i class="fa fa-long-arrow-right fa-fw"></i>Lineage</span>
+        <span style="margin-right: 8px; color:#fb4200;"><i class="fa fa-long-arrow-right fa-fw"></i>Impact</span>
     </div>
     <svg width="{{width}}" height="{{height}}" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"></svg>
 </div>

dashboardv2/public/js/views/graph/LineageLayoutView.js

@@ -65,6 +65,7 @@ define(['require',
                 showOnlyHoverPath: '[data-id="showOnlyHoverPath"]',
                 showTooltip: '[data-id="showTooltip"]',
                 saveSvg: '[data-id="saveSvg"]',
+                resetLineage: '[data-id="resetLineage"]'
             },
             templateHelpers: function() {
                 return {
@@ -84,6 +85,7 @@ define(['require',
                 events["click " + this.ui.lineageFullscreenToggler] = 'onClickLineageFullscreenToggler';
                 events["click " + this.ui.searchToggler] = 'onClickSearchToggler';
                 events["click " + this.ui.saveSvg] = 'onClickSaveSvg';
+                events["click " + this.ui.resetLineage] = 'onClickResetLineage';
                 return events;
             },
 
@@ -97,7 +99,6 @@ define(['require',
                 this.lineageData = null;
                 this.typeMap = {};
                 this.apiGuid = {};
-                this.asyncFetchCounter = 0;
                 this.edgeCall;
                 this.filterObj = {
                     isProcessHideCheck: false,
@@ -207,6 +208,9 @@ define(['require',
                 this.fromToNodeData = {};
                 this.$('.fontLoader').show();
                 this.$('svg>g').hide();
+                this.toggleDisableState({
+                    "el": that.$(".graph-button-group button,select[data-id='selectDepth']")
+                });
                 this.collection.getLineage(this.guid, {
                     skipDefaultError: true,
                     queryParam: queryParam,
@@ -219,9 +223,13 @@ define(['require',
                                 that.renderLineageTypeSearch();
                             }
                             that.generateData({ "relationshipMap": that.relationshipMap, "guidEntityMap": that.guidEntityMap });
+                            that.toggleDisableState({
+                                "el": that.$(".graph-button-group button,select[data-id='selectDepth']")
+                            });
                         } else {
                             that.noLineage();
                             that.hideCheckForProcess();
+
                         }
                     },
                     cust_error: function(model, response) {
@@ -434,9 +442,7 @@ define(['require',
                     this.fromToNodeData[this.guid]['isLineage'] = false;
                     this.findImpactNodeAndUpdateData({ "relationshipMap": filterRelationshipMap, "guid": this.guid, "getStyleObjStr": getStyleObjStr });
                 }
-                if (this.asyncFetchCounter == 0) {
-                    this.createGraph();
-                }
+                this.createGraph();
             },
             findImpactNodeAndUpdateData: function(options) {
                 var that = this,
@@ -807,7 +813,6 @@ define(['require',
                     g: this.g,
                     guid: this.guid
                 }).init();
-                this.$el.find('[data-id="saveSvg"]').removeClass('disabled')
             },
             renderLineageTypeSearch: function() {
                 var that = this;
@@ -1008,6 +1013,15 @@ define(['require',
                     (element).removeClass("fa-spin-custom fa-refresh").addClass('fa-camera');
                 }
             },
+            onClickResetLineage: function() {
+                this.createGraph()
+            },
+            toggleDisableState: function(options) {
+                var el = options.el;
+                if (el && el.prop) {
+                    el.prop("disabled", !el.prop("disabled"));
+                }
+            }
         });
     return LineageLayoutView;
 });
\ No newline at end of file