| <!-- |
| Copyright (c) 2012 Cameron Adams. All rights reserved. |
| Copyright (c) 2012 Code Aurora Forum. All rights reserved. |
| Copyright (C) 2013 Google Inc. All rights reserved. |
| Copyright (C) 2013 Intel Inc. All rights reserved. |
| |
| Redistribution and use in source and binary forms, with or without |
| modification, are permitted provided that the following conditions are |
| met: |
| * Redistributions of source code must retain the above copyright |
| notice, this list of conditions and the following disclaimer. |
| * Redistributions in binary form must reproduce the above |
| copyright notice, this list of conditions and the following disclaimer |
| in the documentation and/or other materials provided with the |
| distribution. |
| * Neither the name of Code Aurora Forum Inc., Google Inc. nor the |
| names of its contributors may be used to endorse or promote products |
| derived from this software without specific prior written permission. |
| |
| THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS |
| "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT |
| LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR |
| A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT |
| OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, |
| SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT |
| LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, |
| DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY |
| THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT |
| (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE |
| OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. |
| |
| This test is based on code written by Cameron Adams and imported from |
| http://themaninblue.com/experiment/AnimationBenchmark/html |
| --> |
| |
| <!doctype html> |
| <head> |
| <title>Benchmark - Overlay background-color Animation using CSS Transitions</title> |
| <style> |
| html { |
| height: 100%; |
| } |
| |
| body { |
| width: 100%; |
| height: 100%; |
| overflow: hidden; |
| margin: 0; |
| padding: 0; |
| } |
| |
| .overlay { |
| position: absolute; |
| width: 600px; |
| height: 600px; |
| transform: translateZ(0); |
| transition: background-color 1s linear; |
| } |
| </style> |
| <script src="resources/perf_test_helper.js"></script> |
| <script> |
| window.measurementReady = false; |
| var maxOverlays = 500; |
| var colors = ["rgba(204, 0, 0, 0.5)", "rgba(255, 204, 0, 0.5)", "rgba(170, 255, 0, 0.5)" |
| , "rgba(0, 153, 204, 0.5)", "rgba(25, 76, 153, 0.5)", "rgba(102, 25, 153, 0.5)"]; |
| |
| var testRunning = true; |
| var overlays = []; |
| |
| window.onload = function () { |
| // Create the overlays |
| for (var i = 0; i < maxOverlays; i++) { |
| var overlay = new Overlay(); |
| overlay.start(); |
| overlays.push(overlay); |
| } |
| |
| window.measurementReady = true; |
| } |
| |
| function Overlay() |
| { |
| // Create visual element for the overlay |
| var domNode = document.createElement('div'); |
| domNode.classList.add('overlay'); |
| document.body.appendChild(domNode); |
| |
| // Set color of element |
| domNode.style.backgroundColor = colors[Math.floor(PerfTestHelper.random() * colors.length)]; |
| |
| function destroy() |
| { |
| document.body.removeChild(domNode); |
| } |
| |
| function changeBackgroundColor() { |
| if (!testRunning) |
| return; |
| domNode.style.backgroundColor = colors[Math.floor(PerfTestHelper.random() * colors.length)]; |
| setTimeout(changeBackgroundColor, 1000); |
| } |
| |
| function start() { |
| // Set timeout is used to ensure the transition-property value gets a chance to register on the element. |
| setTimeout(changeBackgroundColor, 0); |
| } |
| |
| this.start = start; |
| this.destroy = destroy; |
| } |
| </script> |
| </head> |
| </html> |