Refactor test suites to a separate class.
[WebKit-https.git] / PerformanceTests / Animometer / runner / animometer.html
1 <!DOCTYPE html>
2 <html>
3 <head>
4     <link rel="stylesheet" href="resources/animometer.css">
5     <script src="../resources/sampler.js" defer></script>
6     <script src="../resources/extensions.js" defer></script>
7     <script src="resources/tests.js" defer=""></script>
8     <script src="resources/benchmark-runner.js" defer></script>
9     <script src="resources/animometer.js" defer></script>
10     <script src="resources/d3.min.js" defer></script>
11     <script src="resources/graph.js" defer></script>
12 </head>
13 <body>
14     <main>
15         <section id="home" class="selected">
16             <p>
17                 Animometer is a browser benchmark that measures the complexity of an animation for
18                 which a browser can achieve 50 FPS (frame per second). It uses adaptive animations
19                 to tune their complexities to stay close to 50 FPS.
20             </p>
21             <div class="options">
22                 <div id="suites" class="column">
23                 </div>
24                 <div>
25                     <label>Test interval: <input id="test-interval" type="number" value="30"> seconds</label><br>
26                     <label>Frame rate: <input id="frame-rate" type="number" value="50"> fps</label><br>
27                     <label><input id="estimated-frame-rate" type="checkbox" checked> Estimated Frame Rate</label><br>
28                     <label><input id="fix-test-complexity" type="checkbox"> Fix test complexity after warmup</label>
29                     <label><input id="show-running-results" type="checkbox"> Show running results</label>
30                 </div>
31             </div>
32             <div class="buttons">
33                 <button onclick="startTest()">Start Test</button>
34             </div>
35         </section>
36         <section id="running">
37             <div id="testContainer"></div>
38             <div id="progress">
39                 <div id="progress-completed"></div>
40             </div>
41             <div id="record">
42                 <table class="record-table"></table>
43             </div>
44         </section>
45         <section id="results">
46             <h1>Results</h1>
47             <table class="results-table"></table>
48             <div class="buttons">
49                 <button onclick="startTest()">Test Again</button>
50             </div>
51         </section>  
52         <section id="graph">
53             <h1>Graph</h1>
54             <div id="graphContainer"></div>
55             <div class="buttons">
56                 <button onclick="showResults()">Results</button>
57                 <button onclick="startTest()">Test Again</button>        
58             </div>
59         </section>  
60     </main>
61 </body>
62 </html>