AMBARI-5157. Problems with pop-ups on Job page and Job Details page Firefox Browser (alexantonenko)

ambari-web/app/controllers/main/jobs_controller.js

@@ -255,8 +255,6 @@ App.MainJobsController = Em.ArrayController.extend({
           + ":" + yarnService.get('ahsWebPort') + "/ws/v1/timeline/HIVE_QUERY_ID" + filtersLink;
       App.HttpClient.get(hiveQueriesUrl, App.hiveJobsMapper, {
         complete : function(jqXHR, textStatus) {
-          self.set('loading', false);
-          self.set('loaded', true);
           var sortColumn = self.get('sortingColumn');
           if(sortColumn && sortColumn.get('status')){
             var sortColumnStatus = sortColumn.get('status');
@@ -265,6 +263,8 @@ App.MainJobsController = Em.ArrayController.extend({
             sortColumn.set('status', sortColumnStatus);
             self.set('content',sortColumn.get('parentView').get('content'));
           }
+          self.set('loading', false);
+          self.set('loaded', true);
         }
       }, function (jqXHR, textStatus) {
         App.hiveJobsMapper.map({entities : []});

ambari-web/app/views/main/jobs/hive_job_details_tez_dag_view.js

@@ -671,8 +671,8 @@ App.MainHiveJobDetailsTezDagView = Em.View.extend({
         }).on('mouseover', function(op) {
           var operatorPlanObj = self.createOperationPlanObj(n.name, op);
           var template = App.HoverOpTable.create({content: operatorPlanObj}) ;
-          $(event.currentTarget).find('.svg-tooltip').attr('title', template.renderToBuffer().string()).tooltip('fixTitle').tooltip('show');
-        })
+          $(this).find('.svg-tooltip').attr('title', template.renderToBuffer().string()).tooltip('fixTitle').tooltip('show');
+          })
 
         opGroups.append("rect").attr("class", "operation svg-tooltip ").attr("width", "50").attr("height", "16");
         opGroups.append("text").attr("x", "2").attr("dy", "1em").text(function(op) {
@@ -703,6 +703,30 @@ App.MainHiveJobDetailsTezDagView = Em.View.extend({
       return "translate(" + d.x + "," + d.y + ") scale("+d.scale+") ";
     });
     this.vertexMetricsUpdated();
+    $('.svg-tooltip').each(function() {
+      var item = $(this);
+      if (item.prop('tagName') == 'path') {
+        item.hover(function(e) {
+          var offset = $(this).offset();
+          item.prop('offsetWidth', function() {
+            return 2 * (e.pageX - offset.left);
+          });
+          item.prop('offsetHeight', function() {
+            return 2 * (e.pageY - offset.top);
+          });
+        });
+      };
+      if (item.prop('offsetWidth') == undefined) {
+        item.prop('offsetWidth', function() {
+          return item.width();
+        });
+      };
+      if (item.prop('offsetHeight') == undefined) {
+        item.prop('offsetHeight', function() {
+          return item.height();
+        });
+      };
+    });
     $('.svg-tooltip').tooltip({
       placement : 'left'
     });

ambari-web/app/views/main/jobs_view.js

@@ -167,15 +167,33 @@ App.MainJobsView = App.TableView.extend({
   }.property('content.length', 'filteredContent.length', 'controller.totalOfJobs'),
 
   pageContentObserver: function () {
-    Ember.run.later(this, function() {
-      $('.job-link').tooltip({
-        template: '<div class="tooltip jobs-tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>'
+    if (!$.browser.mozilla) {
+      $('.job-link').on('mouseleave', function() {
+        $('.tooltip').remove();
       });
-    }, 1000);
-  }.observes('pageContent', 'pageContent.length', 'pageContent.@each.id'),
+    };
+    if (!this.get('controller.loading')) {
+      if ($('.tooltip').length) {
+        Ember.run.later(this, function() {
+          if ($('.tooltip').length > 1) {
+            $('.tooltip').first().remove();
+          };
+        }, 500);
+      };
+    };
+  }.observes('controller.loading'),
+
+  init: function() {
+    this._super();
+    App.tooltip($('body'), {
+      selector: '[rel="tooltip"]',
+      template: '<div class="tooltip jobs-tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>',
+      placement: 'bottom'
+    });
+  },
 
   willDestroyElement : function() {
-    $('.job-link').tooltip('destroy');
+    $('.tooltip').remove();
   },
 
   /**