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

Side by Side Diff: tracing/tracing/ui/timeline_display_transform_animations.html

Issue 2771723003: [tracing] Move math utilities from base into their own subdirectory (attempt 2) (Closed)
Patch Set: rebase Created 3 years, 9 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 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <!-- 2 <!--
3 Copyright (c) 2013 The Chromium Authors. All rights reserved. 3 Copyright (c) 2013 The Chromium Authors. All rights reserved.
4 Use of this source code is governed by a BSD-style license that can be 4 Use of this source code is governed by a BSD-style license that can be
5 found in the LICENSE file. 5 found in the LICENSE file.
6 --> 6 -->
7 <link rel="import" href="/tracing/base/utils.html"> 7 <link rel="import" href="/tracing/base/utils.html">
8 <link rel="import" href="/tracing/ui/base/animation.html"> 8 <link rel="import" href="/tracing/ui/base/animation.html">
9 9
10 <script> 10 <script>
11 'use strict'; 11 'use strict';
12 12
13 tr.exportTo('tr.ui', function() { 13 tr.exportTo('tr.ui', function() {
14 var kDefaultPanAnimationDurationMs = 100.0; 14 var kDefaultPanAnimationDurationMs = 100.0;
15 const lerp = tr.b.math.lerp;
15 16
16 /** 17 /**
17 * Pans a TimelineDisplayTransform by a given amount. 18 * Pans a TimelineDisplayTransform by a given amount.
18 * @constructor 19 * @constructor
19 * @extends {tr.ui.b.Animation} 20 * @extends {tr.ui.b.Animation}
20 * @param {Number} deltaX The total amount of change to the transform's panX. 21 * @param {Number} deltaX The total amount of change to the transform's panX.
21 * @param {Number} deltaY The total amount of change to the transform's panY. 22 * @param {Number} deltaY The total amount of change to the transform's panY.
22 * @param {Number=} opt_durationMs How long the pan animation should run. 23 * @param {Number=} opt_durationMs How long the pan animation should run.
23 * Defaults to kDefaultPanAnimationDurationMs. 24 * Defaults to kDefaultPanAnimationDurationMs.
24 */ 25 */
(...skipping 35 matching lines...) Expand 10 before | Expand all | Expand 10 after
60 }, 61 },
61 62
62 start: function(timestamp, target) { 63 start: function(timestamp, target) {
63 this.startTimeMs = timestamp; 64 this.startTimeMs = timestamp;
64 this.startPanX = target.panX; 65 this.startPanX = target.panX;
65 this.startPanY = target.panY; 66 this.startPanY = target.panY;
66 }, 67 },
67 68
68 tick: function(timestamp, target) { 69 tick: function(timestamp, target) {
69 var percentDone = (timestamp - this.startTimeMs) / this.durationMs; 70 var percentDone = (timestamp - this.startTimeMs) / this.durationMs;
70 percentDone = tr.b.clamp(percentDone, 0, 1); 71 percentDone = tr.b.math.clamp(percentDone, 0, 1);
71 72
72 target.panX = tr.b.lerp(percentDone, this.startPanX, this.goalPanX); 73 target.panX = lerp(percentDone, this.startPanX, this.goalPanX);
73 if (this.affectsPanY) 74 if (this.affectsPanY) {
74 target.panY = tr.b.lerp(percentDone, this.startPanY, this.goalPanY); 75 target.panY = lerp(percentDone, this.startPanY, this.goalPanY);
76 }
75 return timestamp >= this.startTimeMs + this.durationMs; 77 return timestamp >= this.startTimeMs + this.durationMs;
76 }, 78 },
77 79
78 get goalPanX() { 80 get goalPanX() {
79 return this.startPanX + this.deltaX; 81 return this.startPanX + this.deltaX;
80 }, 82 },
81 83
82 get goalPanY() { 84 get goalPanY() {
83 return this.startPanY + this.deltaY; 85 return this.startPanY + this.deltaY;
84 } 86 }
(...skipping 58 matching lines...) Expand 10 before | Expand all | Expand 10 after
143 145
144 start: function(timestamp, target) { 146 start: function(timestamp, target) {
145 this.startTimeMs = timestamp; 147 this.startTimeMs = timestamp;
146 this.startScaleX = target.scaleX; 148 this.startScaleX = target.scaleX;
147 this.goalScaleX = this.zoomInRatioX * target.scaleX; 149 this.goalScaleX = this.zoomInRatioX * target.scaleX;
148 this.startPanY = target.panY; 150 this.startPanY = target.panY;
149 }, 151 },
150 152
151 tick: function(timestamp, target) { 153 tick: function(timestamp, target) {
152 var percentDone = (timestamp - this.startTimeMs) / this.durationMs; 154 var percentDone = (timestamp - this.startTimeMs) / this.durationMs;
153 percentDone = tr.b.clamp(percentDone, 0, 1); 155 percentDone = tr.b.math.clamp(percentDone, 0, 1);
154 156
155 target.scaleX = tr.b.lerp(percentDone, this.startScaleX, this.goalScaleX); 157 target.scaleX = lerp(percentDone, this.startScaleX, this.goalScaleX);
156 if (this.affectsPanY) { 158 if (this.affectsPanY) {
157 target.panY = tr.b.lerp( 159 target.panY = lerp(percentDone, this.startPanY, this.goalFocalPointY);
158 percentDone, this.startPanY, this.goalFocalPointY);
159 } 160 }
160 161
161 target.xPanWorldPosToViewPos( 162 target.xPanWorldPosToViewPos(
162 this.goalFocalPointXWorld, this.goalFocalPointXView); 163 this.goalFocalPointXWorld, this.goalFocalPointXView);
163 return timestamp >= this.startTimeMs + this.durationMs; 164 return timestamp >= this.startTimeMs + this.durationMs;
164 } 165 }
165 }; 166 };
166 167
167 return { 168 return {
168 TimelineDisplayTransformPanAnimation: 169 TimelineDisplayTransformPanAnimation:
169 TimelineDisplayTransformPanAnimation, 170 TimelineDisplayTransformPanAnimation,
170 TimelineDisplayTransformZoomToAnimation: 171 TimelineDisplayTransformZoomToAnimation:
171 TimelineDisplayTransformZoomToAnimation 172 TimelineDisplayTransformZoomToAnimation
172 }; 173 };
173 }); 174 });
174 </script> 175 </script>
OLDNEW
« no previous file with comments | « tracing/tracing/ui/side_panel/side_panel_container.html ('k') | tracing/tracing/ui/timeline_interest_range.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698