| OLD | NEW |
| 1 // Copyright (c) 2015 The Chromium Authors. All rights reserved. | 1 // Copyright (c) 2015 The Chromium Authors. All rights reserved. |
| 2 // Use of this source code is governed by a BSD-style license that can be | 2 // Use of this source code is governed by a BSD-style license that can be |
| 3 // found in the LICENSE file. | 3 // found in the LICENSE file. |
| 4 | 4 |
| 5 /** | 5 /** |
| 6 * @constructor | 6 * @constructor |
| 7 * @param {number} width | 7 * @param {number} width |
| 8 * @param {number} height | 8 * @param {number} height |
| 9 * @param {number} marginTop | 9 * @param {number} marginTop |
| 10 * @param {number} controlPointRadius | 10 * @param {number} controlPointRadius |
| 11 * @param {boolean} linearLine | 11 * @param {boolean} linearLine |
| 12 */ | 12 */ |
| 13 WebInspector.BezierUI = function(width, height, marginTop, controlPointRadius, l
inearLine) | 13 WebInspector.BezierUI = function(width, height, marginTop, controlPointRadius, l
inearLine) |
| 14 { | 14 { |
| 15 this.width = width; | 15 this.width = width; |
| 16 this.height = height; | 16 this.height = height; |
| 17 this.marginTop = marginTop; | 17 this.marginTop = marginTop; |
| 18 this.radius = controlPointRadius; | 18 this.radius = controlPointRadius; |
| 19 this.linearLine = linearLine; | 19 this.linearLine = linearLine; |
| 20 } | 20 }; |
| 21 | 21 |
| 22 WebInspector.BezierUI.prototype = { | 22 WebInspector.BezierUI.prototype = { |
| 23 /** | 23 /** |
| 24 * @return {number} | 24 * @return {number} |
| 25 */ | 25 */ |
| 26 curveWidth: function() | 26 curveWidth: function() |
| 27 { | 27 { |
| 28 return this.width - this.radius * 2; | 28 return this.width - this.radius * 2; |
| 29 }, | 29 }, |
| 30 | 30 |
| (...skipping 60 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 91 var curvePoints = [ | 91 var curvePoints = [ |
| 92 new WebInspector.Geometry.Point(bezier.controlPoints[0].x * width +
this.radius, (1 - bezier.controlPoints[0].y) * height + this.radius + this.margi
nTop), | 92 new WebInspector.Geometry.Point(bezier.controlPoints[0].x * width +
this.radius, (1 - bezier.controlPoints[0].y) * height + this.radius + this.margi
nTop), |
| 93 new WebInspector.Geometry.Point(bezier.controlPoints[1].x * width +
this.radius, (1 - bezier.controlPoints[1].y) * height + this.radius + this.margi
nTop), | 93 new WebInspector.Geometry.Point(bezier.controlPoints[1].x * width +
this.radius, (1 - bezier.controlPoints[1].y) * height + this.radius + this.margi
nTop), |
| 94 new WebInspector.Geometry.Point(width + this.radius, this.marginTop
+ this.radius) | 94 new WebInspector.Geometry.Point(width + this.radius, this.marginTop
+ this.radius) |
| 95 ]; | 95 ]; |
| 96 curve.setAttribute("d", "M" + this.radius + "," + (height + this.radius
+ this.marginTop) + " C" + curvePoints.join(" ")); | 96 curve.setAttribute("d", "M" + this.radius + "," + (height + this.radius
+ this.marginTop) + " C" + curvePoints.join(" ")); |
| 97 | 97 |
| 98 this._drawControlPoints(group, 0, height, bezier.controlPoints[0].x * wi
dth, (1 - bezier.controlPoints[0].y) * height); | 98 this._drawControlPoints(group, 0, height, bezier.controlPoints[0].x * wi
dth, (1 - bezier.controlPoints[0].y) * height); |
| 99 this._drawControlPoints(group, width, 0, bezier.controlPoints[1].x * wid
th, (1 - bezier.controlPoints[1].y) * height); | 99 this._drawControlPoints(group, width, 0, bezier.controlPoints[1].x * wid
th, (1 - bezier.controlPoints[1].y) * height); |
| 100 } | 100 } |
| 101 } | 101 }; |
| 102 | 102 |
| 103 WebInspector.BezierUI.Height = 26; | 103 WebInspector.BezierUI.Height = 26; |
| 104 | 104 |
| 105 /** | 105 /** |
| 106 * @param {!WebInspector.Geometry.CubicBezier} bezier | 106 * @param {!WebInspector.Geometry.CubicBezier} bezier |
| 107 * @param {!Element} path | 107 * @param {!Element} path |
| 108 * @param {number} width | 108 * @param {number} width |
| 109 */ | 109 */ |
| 110 WebInspector.BezierUI.drawVelocityChart = function(bezier, path, width) | 110 WebInspector.BezierUI.drawVelocityChart = function(bezier, path, width) |
| 111 { | 111 { |
| 112 var height = WebInspector.BezierUI.Height; | 112 var height = WebInspector.BezierUI.Height; |
| 113 var pathBuilder = ["M", 0, height]; | 113 var pathBuilder = ["M", 0, height]; |
| 114 /** @const */ var sampleSize = 1 / 40; | 114 /** @const */ var sampleSize = 1 / 40; |
| 115 | 115 |
| 116 var prev = bezier.evaluateAt(0); | 116 var prev = bezier.evaluateAt(0); |
| 117 for (var t = sampleSize; t < 1 + sampleSize; t += sampleSize) { | 117 for (var t = sampleSize; t < 1 + sampleSize; t += sampleSize) { |
| 118 var current = bezier.evaluateAt(t); | 118 var current = bezier.evaluateAt(t); |
| 119 var slope = (current.y - prev.y) / (current.x - prev.x); | 119 var slope = (current.y - prev.y) / (current.x - prev.x); |
| 120 var weightedX = prev.x * (1 - t) + current.x * t; | 120 var weightedX = prev.x * (1 - t) + current.x * t; |
| 121 slope = Math.tanh(slope / 1.5); // Normalise slope | 121 slope = Math.tanh(slope / 1.5); // Normalise slope |
| 122 pathBuilder = pathBuilder.concat(["L", (weightedX * width).toFixed(2), (
height - slope * height).toFixed(2) ]); | 122 pathBuilder = pathBuilder.concat(["L", (weightedX * width).toFixed(2), (
height - slope * height).toFixed(2) ]); |
| 123 prev = current; | 123 prev = current; |
| 124 } | 124 } |
| 125 pathBuilder = pathBuilder.concat(["L", width.toFixed(2), height, "Z"]); | 125 pathBuilder = pathBuilder.concat(["L", width.toFixed(2), height, "Z"]); |
| 126 path.setAttribute("d", pathBuilder.join(" ")); | 126 path.setAttribute("d", pathBuilder.join(" ")); |
| 127 } | 127 }; |
| OLD | NEW |