Fix some minor typos: psuedo -> pseudo
[WebKit.git] / PerformanceTests / Speedometer / resources / main.js
1 window.benchmarkClient = {
2     iterationCount: 20,
3     testsCount: null,
4     suitesCount: null,
5     _timeValues: [],
6     _finishedTestCount: 0,
7     _progressCompleted: null,
8     willAddTestFrame: function (frame) {
9         var main = document.querySelector('main');
10         var style = getComputedStyle(main);
11         frame.style.left = main.offsetLeft + parseInt(style.borderLeftWidth) + parseInt(style.paddingLeft) + 'px';
12         frame.style.top = main.offsetTop + parseInt(style.borderTopWidth) + parseInt(style.paddingTop) + 'px';
13     },
14     willRunTest: function (suite, test) {
15         document.getElementById('info').textContent = suite.name + ' ( ' + this._finishedTestCount + ' / ' + this.testsCount + ' )';
16     },
17     didRunTest: function () {
18         this._finishedTestCount++;
19         this._progressCompleted.style.width = (this._finishedTestCount * 100 / this.testsCount) + '%';
20     },
21     didRunSuites: function (measuredValues) {
22         this._timeValues.push(measuredValues.total);
23     },
24     willStartFirstIteration: function () {
25         this._timeValues = [];
26         this._finishedTestCount = 0;
27         this._progressCompleted = document.getElementById('progress-completed');
28         document.getElementById('logo-link').onclick = function (event) { event.preventDefault(); return false; }
29     },
30     didFinishLastIteration: function () {
31         document.getElementById('logo-link').onclick = null;
32
33         var displayUnit = location.search == '?ms' || location.hash == '#ms' ? 'ms' : 'runs/min';
34         var results = this._computeResults(this._timeValues, displayUnit);
35
36         this._updateGaugeNeedle(results.mean);
37         document.getElementById('result-number').textContent = results.formattedMean;
38         if (results.formattedDelta)
39             document.getElementById('confidence-number').textContent = '\u00b1 ' + results.formattedDelta;
40
41         this._populateDetailedResults(results.formattedValues);
42         document.getElementById('results-with-statistics').textContent = results.formattedMeanAndDelta;
43
44         if (displayUnit == 'ms') {
45             document.getElementById('show-summary').style.display = 'none';
46             showResultDetails();
47         } else
48             showResultsSummary();
49     },
50     _computeResults: function (timeValues, displayUnit) {
51         var suitesCount = this.suitesCount;
52         function totalTimeInDisplayUnit(time) {
53             if (displayUnit == 'ms')
54                 return time;
55             return 60 * 1000 * suitesCount / time;
56         }
57
58         function sigFigFromPercentDelta(percentDelta) {
59             return Math.ceil(-Math.log(percentDelta)/Math.log(10)) + 3;
60         }
61
62         function toSigFigPrecision(number, sigFig) {
63             var nonDecimalDigitCount = number < 1 ? 0 : (Math.floor(Math.log(number)/Math.log(10)) + 1);
64             return number.toPrecision(Math.max(nonDecimalDigitCount, Math.min(6, sigFig)));
65         }
66
67         var values = timeValues.map(totalTimeInDisplayUnit);
68         var sum = values.reduce(function (a, b) { return a + b; }, 0);
69         var arithmeticMean = sum / values.length;
70         var meanSigFig = 4;
71         var formattedDelta;
72         var formattedPercentDelta;
73         if (window.Statistics) {
74             var delta = Statistics.confidenceIntervalDelta(0.95, values.length, sum, Statistics.squareSum(values));
75             if (!isNaN(delta)) {
76                 var percentDelta = delta * 100 / arithmeticMean;
77                 meanSigFig = sigFigFromPercentDelta(percentDelta);
78                 formattedDelta = toSigFigPrecision(delta, 2);
79                 formattedPercentDelta = toSigFigPrecision(percentDelta, 2) + '%';
80             }
81         }
82
83         var formattedMean = toSigFigPrecision(arithmeticMean, Math.max(meanSigFig, 3));
84
85         return {
86             formattedValues: timeValues.map(function (time) {
87                 return toSigFigPrecision(totalTimeInDisplayUnit(time), 4) + ' ' + displayUnit;
88             }),
89             mean: arithmeticMean,
90             formattedMean: formattedMean,
91             formattedDelta: formattedDelta,
92             formattedMeanAndDelta: formattedMean + (formattedDelta ? ' \xb1 ' + formattedDelta + ' (' + formattedPercentDelta + ')' : ''),
93         };
94     },
95     _addDetailedResultsRow: function (table, iterationNumber, value) {
96         var row = document.createElement('tr');
97         var th = document.createElement('th');
98         th.textContent = 'Iteration ' + (iterationNumber + 1);
99         var td = document.createElement('td');
100         td.textContent = value;
101         row.appendChild(th);
102         row.appendChild(td);
103         table.appendChild(row);
104     },
105     _updateGaugeNeedle: function (rpm) {
106         var needleAngle = Math.max(0, Math.min(rpm, 140)) - 70;
107         var needleRotationValue = 'rotate(' + needleAngle + 'deg)';
108
109         var gaugeNeedleElement = document.querySelector('#summarized-results > .gauge .needle');
110         gaugeNeedleElement.style.setProperty('-webkit-transform', needleRotationValue);
111         gaugeNeedleElement.style.setProperty('-moz-transform', needleRotationValue);
112         gaugeNeedleElement.style.setProperty('-ms-transform', needleRotationValue);
113         gaugeNeedleElement.style.setProperty('transform', needleRotationValue);
114     },
115     _populateDetailedResults: function (formattedValues) {
116         var resultsTables = document.querySelectorAll('.results-table');
117         var i = 0;
118         resultsTables[0].innerHTML = '';
119         for (; i < Math.ceil(formattedValues.length / 2); i++)
120             this._addDetailedResultsRow(resultsTables[0], i, formattedValues[i]);
121         resultsTables[1].innerHTML = '';
122         for (; i < formattedValues.length; i++)
123             this._addDetailedResultsRow(resultsTables[1], i, formattedValues[i]);
124     },
125     prepareUI: function () {
126         window.addEventListener('popstate', function (event) {
127             if (event.state) {
128                 var sectionToShow = event.state.section;
129                 if (sectionToShow) {
130                     var sections = document.querySelectorAll('main > section');
131                     for (var i = 0; i < sections.length; i++) {
132                         if (sections[i].id === sectionToShow)
133                             return showSection(sectionToShow, false);
134                     }
135                 }
136             }
137             return showSection('home', false);
138         }, false);
139
140         function updateScreenSize() {
141             // FIXME: Detect when the window size changes during the test.
142             var screenIsTooSmall = window.innerWidth < 850 || window.innerHeight < 650;
143             document.getElementById('screen-size').textContent = window.innerWidth + 'px by ' + window.innerHeight + 'px';
144             document.getElementById('screen-size-warning').style.display = screenIsTooSmall ? null : 'none';
145         }
146
147         window.addEventListener('resize', updateScreenSize);
148         updateScreenSize();
149     }
150 }
151
152 function startBenchmark() {
153     var enabledSuites = Suites.filter(function (suite) { return !suite.disabled });
154     var totalSubtestCount = enabledSuites.reduce(function (testsCount, suite) { return testsCount + suite.tests.length; }, 0);
155     benchmarkClient.testsCount = benchmarkClient.iterationCount * totalSubtestCount;
156     benchmarkClient.suitesCount = enabledSuites.length;
157     var runner = new BenchmarkRunner(Suites, benchmarkClient);
158     runner.runMultipleIterations(benchmarkClient.iterationCount);
159 }
160
161 function showSection(sectionIdentifier, pushState) {
162     var currentSectionElement = document.querySelector('section.selected');
163     console.assert(currentSectionElement);
164
165     var newSectionElement = document.getElementById(sectionIdentifier);
166     console.assert(newSectionElement);
167
168     currentSectionElement.classList.remove('selected');
169     newSectionElement.classList.add('selected');
170
171     if (pushState)
172         history.pushState({section: sectionIdentifier}, document.title);
173 }
174
175 function showHome() {
176     showSection('home', true);
177 }
178
179 function startTest() {
180     showSection('running');
181     startBenchmark();
182 }
183
184 function showResultsSummary() {
185     showSection('summarized-results', true);
186 }
187
188 function showResultDetails() {
189     showSection('detailed-results', true);
190 }
191
192 function showAbout() {
193     showSection('about', true);
194 }
195
196 window.addEventListener('DOMContentLoaded', function () {
197     if (benchmarkClient.prepareUI)
198         benchmarkClient.prepareUI();
199 });