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

Side by Side Diff: PerformanceTests/Animation/api-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 | « no previous file | PerformanceTests/Animation/api-set-current-time-balls-keyframe-animations.html » ('j') | 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 59 matching lines...) Expand 10 before | Expand all | Expand 10 after
70 var particles = []; 70 var particles = [];
71 var allParticleKeyframes = []; 71 var allParticleKeyframes = [];
72 72
73 window.onload = function () { 73 window.onload = function () {
74 PerfTestRunner.prepareToMeasureValuesAsync({done: onCompletedRun, unit: 'fps '}); 74 PerfTestRunner.prepareToMeasureValuesAsync({done: onCompletedRun, unit: 'fps '});
75 75
76 // Create the particles 76 // Create the particles
77 for (var i = 0; i < maxParticles; i++) { 77 for (var i = 0; i < maxParticles; i++) {
78 generateParticleKeyframes(i); 78 generateParticleKeyframes(i);
79 var particle = new Particle(i); 79 var particle = new Particle(i);
80 particle.start();
80 particles.push(particle); 81 particles.push(particle);
81 } 82 }
82 for (var i = 0; i < maxParticles; i++)
83 particles[i].start();
84 83
85 startTrackingFrameRate(); 84 startTrackingFrameRate();
86 } 85 }
87 86
88 function generateParticleKeyframes(index) { 87 function generateParticleKeyframes(index) {
89 allParticleKeyframes[index] = []; 88 allParticleKeyframes[index] = [];
90 89
91 var angle = Math.PI * 2 * PerfTestRunner.random(); 90 var angle = Math.PI * 2 * PerfTestRunner.random();
92 var velocity = minVelocity + ((maxVelocity - minVelocity) * PerfTestRunner.r andom()); 91 var velocity = minVelocity + ((maxVelocity - minVelocity) * PerfTestRunner.r andom());
93 var x = stageWidth / 2 - particleRadius; 92 var x = stageWidth / 2 - particleRadius;
(...skipping 32 matching lines...) Expand 10 before | Expand all | Expand 10 after
126 y += dy * dt; 125 y += dy * dt;
127 } else { 126 } else {
128 t += collision.dt; 127 t += collision.dt;
129 x = collision.x; 128 x = collision.x;
130 y = collision.y; 129 y = collision.y;
131 dx = collision.dx; 130 dx = collision.dx;
132 dy = collision.dy; 131 dy = collision.dy;
133 } 132 }
134 allParticleKeyframes[index].push(generateKeyframe(t, x, y)); 133 allParticleKeyframes[index].push(generateKeyframe(t, x, y));
135 } 134 }
136
137 return keyframes;
138 } 135 }
139 136
140 function generateKeyframe(t, x, y) { 137 function generateKeyframe(t, x, y) {
141 return {left: x + "px", top: y + "px", offset: t / animationDuration }; 138 return {left: x + "px", top: y + "px", offset: t / animationDuration };
142 } 139 }
143 140
144 function Particle(index) 141 function Particle(index)
145 { 142 {
146 // Create visual element for the particle. 143 // Create visual element for the particle.
147 var domNode = document.createElement('span'); 144 var domNode = document.createElement('span');
148 document.body.appendChild(domNode); 145 document.body.appendChild(domNode);
149 146
150 // Set colour of element. 147 // Set colour of element.
151 domNode.style.backgroundColor = colors[Math.floor(Math.random() * colors.len gth)]; 148 domNode.style.backgroundColor = colors[Math.floor(Math.random() * colors.len gth)];
152 149
153 function start() { 150 function start() {
154 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});
155 } 152 }
156 153
157 function destroy() 154 function destroy()
158 { 155 {
159 document.body.removeChild(domNode); 156 document.body.removeChild(domNode);
160 } 157 }
161 158
162 this.start = start; 159 this.start = start;
163 this.destroy = destroy; 160 this.destroy = destroy;
164 } 161 }
165 162
166 function onCompletedRun() { 163 function onCompletedRun() {
167 testRunning = false; 164 testRunning = false;
168 stopTrackingFrameRate(); 165 stopTrackingFrameRate();
169 166
170 for (var i = 0; i < particles.length; i++) 167 for (var i = 0; i < particles.length; i++)
171 particles[i].destroy(); 168 particles[i].destroy();
172 particles = []; 169 particles = [];
173 } 170 }
174 </script> 171 </script>
175 <style id="keyframes"></style> 172 <style id="keyframes"></style>
176 </head> 173 </head>
177 </html> 174 </html>
OLDNEW
« no previous file with comments | « no previous file | PerformanceTests/Animation/api-set-current-time-balls-keyframe-animations.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698