Timeline: nuke flow events experiment

third_party/WebKit/Source/devtools/front_end/ui_lazy/FlameChart.js

 /**
  * Copyright (C) 2013 Google Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions are
  * met:
  *
  *     * Redistributions of source code must retain the above copyright
  * notice, this list of conditions and the following disclaimer.
  *     * Redistributions in binary form must reproduce the above
@@ skipping 640 matching lines @@
       var unclippedBarX = this._timeToPosition(entryStartTime);
       if (this._dataProvider.decorateEntry(
               entryIndex, context, text, barX, barY, barWidth, barHeight, unclippedBarX, this._timeToPixel))
         continue;
       if (!text || !text.length)
         continue;
       context.fillStyle = this._dataProvider.textColor(entryIndex);
       context.fillText(text, barX + textPadding, barY + textBaseHeight);
     }
 
-    this._drawFlowEvents(context, width, height);
-
     context.restore();
 
     UI.TimelineGrid.drawCanvasGrid(context, this._calculator, 3);
     this._drawMarkers();
     this._drawGroupHeaders(width, height);
 
     this._updateElementPosition(this._highlightElement, this._highlightedEntryIndex);
     this._updateElementPosition(this._selectedElement, this._selectedEntryIndex);
     this._updateMarkerHighlight();
   }
@@ skipping 207 matching lines @@
     /**
      * @param {!Common.Segment} a
      * @param {!Common.Segment} b
      * @return {?Common.Segment}
      */
     function mergeCallback(a, b) {
       return a.data === b.data && a.end + 0.4 > b.end ? a : null;
     }
   }
 
-  /**
-   * @param {!CanvasRenderingContext2D} context
-   * @param {number} height
-   * @param {number} width
-   */
-  _drawFlowEvents(context, width, height) {
-    var timelineData = this._timelineData();
-    var timeWindowRight = this._timeWindowRight;
-    var timeWindowLeft = this._timeWindowLeft;
-    var flowStartTimes = timelineData.flowStartTimes;
-    var flowEndTimes = timelineData.flowEndTimes;
-    var flowStartLevels = timelineData.flowStartLevels;
-    var flowEndLevels = timelineData.flowEndLevels;
-    var flowCount = flowStartTimes.length;
-    var endIndex = flowStartTimes.lowerBound(timeWindowRight);
-
-    var color = [];
-    var fadeColorsCount = 8;
-    for (var i = 0; i <= fadeColorsCount; ++i)
-      color[i] = 'rgba(128, 0, 0, ' + i / fadeColorsCount + ')';
-    var fadeColorsRange = color.length;
-    var minimumFlowDistancePx = 15;
-    var flowArcHeight = 4 * this._barHeight;
-    var colorIndex = 0;
-    context.lineWidth = 0.5;
-    for (var i = 0; i < endIndex; ++i) {
-      if (flowEndTimes[i] < timeWindowLeft)
-        continue;
-      var startX = this._timeToPosition(flowStartTimes[i]);
-      var endX = this._timeToPosition(flowEndTimes[i]);
-      if (endX - startX < minimumFlowDistancePx)
-        continue;
-      if (startX < -minimumFlowDistancePx && endX > width + minimumFlowDistancePx)
-        continue;
-      // Assign a trasparent color if the flow is small enough or if the previous color was a transparent color.
-      if (endX - startX < minimumFlowDistancePx + fadeColorsRange || colorIndex !== color.length - 1) {
-        colorIndex = Math.min(fadeColorsRange - 1, Math.floor(endX - startX - minimumFlowDistancePx));
-        context.strokeStyle = color[colorIndex];
-      }
-      var startY = this._levelToHeight(flowStartLevels[i]) + this._barHeight;
-      var endY = this._levelToHeight(flowEndLevels[i]);
-      context.beginPath();
-      context.moveTo(startX, startY);
-      var arcHeight = Math.max(Math.sqrt(Math.abs(startY - endY)), flowArcHeight) + 5;
-      context.bezierCurveTo(startX, startY + arcHeight, endX, endY + arcHeight, endX, endY + this._barHeight);
-      context.stroke();
-    }
-  }
-
   _drawMarkers() {
     var markers = this._timelineData().markers;
     var left = this._markerIndexBeforeTime(this._calculator.minimumBoundary());
     var rightBoundary = this._calculator.maximumBoundary();
 
     var context = /** @type {!CanvasRenderingContext2D} */ (this._canvas.getContext('2d'));
     context.save();
     var ratio = window.devicePixelRatio;
     context.scale(ratio, ratio);
     var height = UI.FlameChart.DividersBarHeight - 1;
@@ skipping 298 matching lines @@
    * @param {!Array<number>|!Float64Array} entryStartTimes
    * @param {?Array<!UI.FlameChart.Group>} groups
    */
   constructor(entryLevels, entryTotalTimes, entryStartTimes, groups) {
     this.entryLevels = entryLevels;
     this.entryTotalTimes = entryTotalTimes;
     this.entryStartTimes = entryStartTimes;
     this.groups = groups;
     /** @type {!Array.<!UI.FlameChartMarker>} */
     this.markers = [];
-    this.flowStartTimes = [];
-    this.flowStartLevels = [];
-    this.flowEndTimes = [];
-    this.flowEndLevels = [];
   }
 };
 
 UI.FlameChartDataProvider.prototype = {
   /**
    * @return {number}
    */
   barHeight: function() {},
 
   /**
@@ skipping 275 matching lines @@
   }
 
   /**
    * @override
    * @return {number}
    */
   boundarySpan() {
     return this._maximumBoundaries - this._minimumBoundaries;
   }
 };