Fixed performance issue

Modified colors

Author: sarutak

core/src/main/resources/org/apache/spark/ui/static/timeline-view.css

@@ -50,31 +50,38 @@ div#application-timeline, div#job-timeline {
 }
 
 rect.scheduler-delay-proportion {
-  fill: #F6D76B;
+  fill: #80B1D3;
+  stroke: #6B94B0;
 }
 
 rect.deserialization-time-proportion {
-  fill: #FFBDD8;
+  fill: #FB8072;
+  stroke: #D26B5F;
 }
 
 rect.shuffle-read-time-proportion {
-  fill: #8AC7DE;
+  fill: #FDB462;
+  stroke: #D39651;
 }
 
 rect.executor-runtime-proportion {
-  fill: #D9EB52;
+  fill: #B3DE69;
+  stroke: #95B957;
 }
 
 rect.shuffle-write-time-proportion {
-  fill: #87796F;
+  fill: #FFED6F;
+  stroke: #D5C65C;
 }
 
 rect.serialization-time-proportion {
-  fill: #93DFB8;
+  fill: #BC80BD;
+  stroke: #9D6B9E;
 }
 
 rect.getting-result-time-proportion {
-  fill: #FF9036;
+  fill: #8DD3C7;
+  stroke: #75B0A6;
 }
 
 .vis.timeline {

core/src/main/resources/org/apache/spark/ui/static/timeline-view.js

@@ -161,33 +161,6 @@ function drawTaskAssignmentTimeline(groupArray, eventObjArray, minLaunchTime, zo
   taskTimeline.setWindow(minLaunchTime, curEnd);
   setupZoomable('#task-assignment-timeline-zoom-lock', taskTimeline);
 
-  function setupTaskEventAction() {
-    $(".item.range.task.task-assignment-timeline-object").each(function() {
-      var getSelectorForTaskEntry = function(baseElem) {
-        var taskIdxText = $(baseElem).find(".task-assignment-timeline-content").attr("data-title");
-        var taskIdx = taskIdxText.match("Task (\\d+)\\(")[1];
-        return "#task-" + taskIdx;
-      };
-
-      $(this).hover(
-        function() {
-          $(getSelectorForTaskEntry(this)).addClass("corresponding-item-hover");
-          $($(this).find("div.task-assignment-timeline-content")[0]).tooltip("show");
-        },
-        function() {
-          $(getSelectorForTaskEntry(this)).removeClass("corresponding-item-hover");
-          $($(this).find("div.task-assignment-timeline-content")[0])
-          .tooltip("hide");
-        }
-      );
-    });
-  }
-
-  setupTaskEventAction();
-  taskTimeline.on("rangechanged", function(properties) {
-    setupTaskEventAction();
-  });
-
   $("span.expand-task-assignment-timeline").click(function() {
     $("#task-assignment-timeline").toggleClass('collapsed');
 
@@ -197,6 +170,16 @@ function drawTaskAssignmentTimeline(groupArray, eventObjArray, minLaunchTime, zo
   });
 }
 
+function setupTaskEventActionOnMouseOver(taskIdAndAttempt) {
+  $("#task-" + taskIdAndAttempt).addClass("corresponding-item-hover");
+  $("#task-event-" + taskIdAndAttempt).tooltip("show");
+}
+
+function setupTaskEventActionOnMouseOut(taskIdAndAttempt) {
+  $("#task-" + taskIdAndAttempt).removeClass("corresponding-item-hover");
+  $("#task-" + taskIdAndAttempt).tooltip("hide");
+}
+
 function setupExecutorEventAction() {
   $(".item.box.executor").each(function () {
     $(this).hover(
@@ -211,15 +194,15 @@ function setupExecutorEventAction() {
 }
 
 function setupZoomable(id, timeline) {
-  $(id + '>input[type="checkbox"]').click(function() {
+  $(id + '> input[type="checkbox"]').click(function() {
     if (this.checked) {
       timeline.setOptions({zoomable: true});
     } else {
       timeline.setOptions({zoomable: false});
     }
   });
 
-  $(id + ">span").click(function() {
+  $(id + "> span").click(function() {
     $(this).parent().find('input:checkbox').trigger('click');
   });
 }