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

Side by Side Diff: PerformanceTests/Animation/api-set-current-time-balls-keyframe-animations.html

Issue 433423003: Animations: Make perf tests for web animations animate properly. (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: Created 6 years, 4 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
« no previous file with comments | « PerformanceTests/Animation/api-balls-keyframe-animations.html ('k') | no next file » | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!-- 1 <!--
2 Copyright (c) 2012 Cameron Adams. All rights reserved. 2 Copyright (c) 2012 Cameron Adams. All rights reserved.
3 Copyright (c) 2012 Code Aurora Forum. All rights reserved. 3 Copyright (c) 2012 Code Aurora Forum. All rights reserved.
4 Copyright (C) 2013 Google Inc. All rights reserved. 4 Copyright (C) 2013 Google Inc. All rights reserved.
5 5
6 Redistribution and use in source and binary forms, with or without 6 Redistribution and use in source and binary forms, with or without
7 modification, are permitted provided that the following conditions are 7 modification, are permitted provided that the following conditions are
8 met: 8 met:
9 * Redistributions of source code must retain the above copyright 9 * Redistributions of source code must retain the above copyright
10 notice, this list of conditions and the following disclaimer. 10 notice, this list of conditions and the following disclaimer.
(...skipping 114 matching lines...) Expand 10 before | Expand all | Expand 10 after
125 y += dy * dt; 125 y += dy * dt;
126 } else { 126 } else {
127 t += collision.dt; 127 t += collision.dt;
128 x = collision.x; 128 x = collision.x;
129 y = collision.y; 129 y = collision.y;
130 dx = collision.dx; 130 dx = collision.dx;
131 dy = collision.dy; 131 dy = collision.dy;
132 } 132 }
133 allParticleKeyframes[index].push(generateKeyframe(t, x, y)); 133 allParticleKeyframes[index].push(generateKeyframe(t, x, y));
134 } 134 }
135
136 return keyframes;
137 } 135 }
138 136
139 function generateKeyframe(t, x, y) { 137 function generateKeyframe(t, x, y) {
140 return {left: x + "px", top: y + "px", offset: t / animationDuration }; 138 return {left: x + "px", top: y + "px", offset: t / animationDuration };
141 } 139 }
142 140
143 function Particle(index) 141 function Particle(index)
144 { 142 {
145 // Create visual element for the particle. 143 // Create visual element for the particle.
146 var domNode = document.createElement('span'); 144 var domNode = document.createElement('span');
147 document.body.appendChild(domNode); 145 document.body.appendChild(domNode);
148 146
149 // Set colour of element. 147 // Set colour of element.
150 domNode.style.backgroundColor = colors[Math.floor(Math.random() * colors.len gth)]; 148 domNode.style.backgroundColor = colors[Math.floor(Math.random() * colors.len gth)];
151 149
152 function start() { 150 function start() {
153 var player = domNode.animate(allParticleKeyframes[index], {easing: "line ar", iterations: Infinity, direction: "alternate", duration: animationDuration}) ; 151 var player = domNode.animate(allParticleKeyframes[index], {easing: "line ar", iterations: Infinity, direction: "alternate", duration: animationDuration * 1000});
154 player.pause(); 152 player.pause();
155 this.player = player; 153 this.player = player;
156 } 154 }
157 155
158 function destroy() 156 function destroy()
159 { 157 {
160 document.body.removeChild(domNode); 158 document.body.removeChild(domNode);
161 } 159 }
162 160
163 this.start = start; 161 this.start = start;
164 this.destroy = destroy; 162 this.destroy = destroy;
165 } 163 }
166 164
167 var start = null; 165 var start = null;
168 166
169 function advance(timestamp) 167 function advance(timestamp)
170 { 168 {
171 if (start == null) 169 if (start == null)
172 start = timestamp; 170 start = timestamp;
173 for (var x in particles) { 171 for (var x in particles) {
174 particles[x].player.currentTime = (timestamp - start) / 1000; 172 particles[x].player.currentTime = timestamp - start;
175 } 173 }
176 if (particles.length !== 0) 174 if (particles.length !== 0)
177 requestAnimationFrame(advance); 175 requestAnimationFrame(advance);
178 } 176 }
179 177
180 requestAnimationFrame(advance); 178 requestAnimationFrame(advance);
181 179
182 function onCompletedRun() { 180 function onCompletedRun() {
183 testRunning = false; 181 testRunning = false;
184 stopTrackingFrameRate(); 182 stopTrackingFrameRate();
185 183
186 for (var i = 0; i < particles.length; i++) 184 for (var i = 0; i < particles.length; i++)
187 particles[i].destroy(); 185 particles[i].destroy();
188 particles = []; 186 particles = [];
189 } 187 }
190 </script> 188 </script>
191 <style id="keyframes"></style> 189 <style id="keyframes"></style>
192 </head> 190 </head>
193 </html> 191 </html>
OLDNEW
« no previous file with comments | « PerformanceTests/Animation/api-balls-keyframe-animations.html ('k') | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698