Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(512)

Side by Side Diff: third_party/WebKit/Source/devtools/front_end/inline_editor/BezierUI.js

Issue 2626143004: DevTools: move from Common module - Geometry and CSSShadowModel (Closed)
Patch Set: minimize test diff Created 3 years, 11 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
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 * @unrestricted 5 * @unrestricted
6 */ 6 */
7 InlineEditor.BezierUI = class { 7 InlineEditor.BezierUI = class {
8 /** 8 /**
9 * @param {number} width 9 * @param {number} width
10 * @param {number} height 10 * @param {number} height
11 * @param {number} marginTop 11 * @param {number} marginTop
12 * @param {number} controlPointRadius 12 * @param {number} controlPointRadius
13 * @param {boolean} linearLine 13 * @param {boolean} linearLine
14 */ 14 */
15 constructor(width, height, marginTop, controlPointRadius, linearLine) { 15 constructor(width, height, marginTop, controlPointRadius, linearLine) {
16 this.width = width; 16 this.width = width;
17 this.height = height; 17 this.height = height;
18 this.marginTop = marginTop; 18 this.marginTop = marginTop;
19 this.radius = controlPointRadius; 19 this.radius = controlPointRadius;
20 this.linearLine = linearLine; 20 this.linearLine = linearLine;
21 } 21 }
22 22
23 /** 23 /**
24 * @param {!Common.Geometry.CubicBezier} bezier 24 * @param {!UI.Geometry.CubicBezier} bezier
25 * @param {!Element} path 25 * @param {!Element} path
26 * @param {number} width 26 * @param {number} width
27 */ 27 */
28 static drawVelocityChart(bezier, path, width) { 28 static drawVelocityChart(bezier, path, width) {
29 var height = InlineEditor.BezierUI.Height; 29 var height = InlineEditor.BezierUI.Height;
30 var pathBuilder = ['M', 0, height]; 30 var pathBuilder = ['M', 0, height];
31 /** @const */ var sampleSize = 1 / 40; 31 /** @const */ var sampleSize = 1 / 40;
32 32
33 var prev = bezier.evaluateAt(0); 33 var prev = bezier.evaluateAt(0);
34 for (var t = sampleSize; t < 1 + sampleSize; t += sampleSize) { 34 for (var t = sampleSize; t < 1 + sampleSize; t += sampleSize) {
(...skipping 47 matching lines...) Expand 10 before | Expand all | Expand 10 after
82 */ 82 */
83 _drawControlPoints(parentElement, startX, startY, controlX, controlY) { 83 _drawControlPoints(parentElement, startX, startY, controlX, controlY) {
84 this._drawLine(parentElement, 'bezier-control-line', startX, startY, control X, controlY); 84 this._drawLine(parentElement, 'bezier-control-line', startX, startY, control X, controlY);
85 var circle = parentElement.createSVGChild('circle', 'bezier-control-circle') ; 85 var circle = parentElement.createSVGChild('circle', 'bezier-control-circle') ;
86 circle.setAttribute('cx', controlX + this.radius); 86 circle.setAttribute('cx', controlX + this.radius);
87 circle.setAttribute('cy', controlY + this.radius + this.marginTop); 87 circle.setAttribute('cy', controlY + this.radius + this.marginTop);
88 circle.setAttribute('r', this.radius); 88 circle.setAttribute('r', this.radius);
89 } 89 }
90 90
91 /** 91 /**
92 * @param {?Common.Geometry.CubicBezier} bezier 92 * @param {?UI.Geometry.CubicBezier} bezier
93 * @param {!Element} svg 93 * @param {!Element} svg
94 */ 94 */
95 drawCurve(bezier, svg) { 95 drawCurve(bezier, svg) {
96 if (!bezier) 96 if (!bezier)
97 return; 97 return;
98 var width = this.curveWidth(); 98 var width = this.curveWidth();
99 var height = this.curveHeight(); 99 var height = this.curveHeight();
100 svg.setAttribute('width', this.width); 100 svg.setAttribute('width', this.width);
101 svg.setAttribute('height', this.height); 101 svg.setAttribute('height', this.height);
102 svg.removeChildren(); 102 svg.removeChildren();
103 var group = svg.createSVGChild('g'); 103 var group = svg.createSVGChild('g');
104 104
105 if (this.linearLine) 105 if (this.linearLine)
106 this._drawLine(group, 'linear-line', 0, height, width, 0); 106 this._drawLine(group, 'linear-line', 0, height, width, 0);
107 107
108 var curve = group.createSVGChild('path', 'bezier-path'); 108 var curve = group.createSVGChild('path', 'bezier-path');
109 var curvePoints = [ 109 var curvePoints = [
110 new Common.Geometry.Point( 110 new UI.Geometry.Point(
111 bezier.controlPoints[0].x * width + this.radius, 111 bezier.controlPoints[0].x * width + this.radius,
112 (1 - bezier.controlPoints[0].y) * height + this.radius + this.marginTo p), 112 (1 - bezier.controlPoints[0].y) * height + this.radius + this.marginTo p),
113 new Common.Geometry.Point( 113 new UI.Geometry.Point(
114 bezier.controlPoints[1].x * width + this.radius, 114 bezier.controlPoints[1].x * width + this.radius,
115 (1 - bezier.controlPoints[1].y) * height + this.radius + this.marginTo p), 115 (1 - bezier.controlPoints[1].y) * height + this.radius + this.marginTo p),
116 new Common.Geometry.Point(width + this.radius, this.marginTop + this.radiu s) 116 new UI.Geometry.Point(width + this.radius, this.marginTop + this.radius)
117 ]; 117 ];
118 curve.setAttribute( 118 curve.setAttribute(
119 'd', 'M' + this.radius + ',' + (height + this.radius + this.marginTop) + ' C' + curvePoints.join(' ')); 119 'd', 'M' + this.radius + ',' + (height + this.radius + this.marginTop) + ' C' + curvePoints.join(' '));
120 120
121 this._drawControlPoints( 121 this._drawControlPoints(
122 group, 0, height, bezier.controlPoints[0].x * width, (1 - bezier.control Points[0].y) * height); 122 group, 0, height, bezier.controlPoints[0].x * width, (1 - bezier.control Points[0].y) * height);
123 this._drawControlPoints( 123 this._drawControlPoints(
124 group, width, 0, bezier.controlPoints[1].x * width, (1 - bezier.controlP oints[1].y) * height); 124 group, width, 0, bezier.controlPoints[1].x * width, (1 - bezier.controlP oints[1].y) * height);
125 } 125 }
126 }; 126 };
127 127
128 InlineEditor.BezierUI.Height = 26; 128 InlineEditor.BezierUI.Height = 26;
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698