-
Notifications
You must be signed in to change notification settings - Fork 0
/
racing.main.js
169 lines (136 loc) · 6.57 KB
/
racing.main.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
window.racing = window.racing || {};
window.racing.app = window.racing.app || {};
(function (racing) {
// Formats the lap time for display on the web page.
function formatMs(ms) {
function pad(n) {
return (n < 10 ? '0' : '') + n;
}
var milliseconds = ms % 1000;
var seconds = Math.floor((ms / 1000) % 60);
var minutes = Math.floor((ms / (60 * 1000)) % 60);
return pad(minutes) + ":" + pad(seconds) + "." + milliseconds;
}
// Creates a row in the results table with the appropriate values
function getTableRow(values, type, onClick) {
var row = document.createElement('tr');
values.forEach(function (value) {
var cell = document.createElement(type);
cell.innerText = value;
row.appendChild(cell);
});
if (onClick) {
row.addEventListener('click', onClick);
}
return row;
}
function getTelemetryEntries(data) {
return {
labels: ['Game Time', 'Speed', 'ERS Battery', 'Damage', 'Steering', 'Throttle', 'Brakes', 'ERS', 'Gear'],
data: data.map(function (entry) {
return [entry.GameTime, entry.Speed, entry.ErsBatteryPercent * 100, entry.Damage, (entry.SteeringAngle * 500) + 200, entry.ThrottlePercent * 100, 100 + entry.BrakesPercent * 100, 200 + (entry.HasUsedErs == true ? 100 : 0), entry.Gear * 50];
})
};
}
function renderLapTelemetry(title, data) {
var graphWrapper = document.querySelector('#TelemtryGraphWrapper');
var graphTitle = graphWrapper.querySelector('.title');
var graph = graphWrapper.querySelector('.graph');
var graphData = getTelemetryEntries(data);
graphTitle.innerText = title;
if (graphData.data.length) {
graphWrapper.style.display = 'block';
return new Dygraph(graph, graphData.data, {
labels: graphData.labels,
legend: 'always',
logscale: false
});
} else {
graphWrapper.style.display = 'none';
}
}
function showLapTelemetry(lap, track) {
// ToDo: Add code to retrieve the telemetry data from storage and render a telemetry graph
track.getTelemetryData(function(data) {
var title = lap.PartitionKey + ' by ' + lap.PlayerName;
renderLapTelemetry(title, data);
}, [
'GameTime', 'Speed', 'ErsBatteryPercent', 'Damage', 'SteeringAngle',
'ThrottlePercent', 'BrakesPercent', 'HasUsedErs', 'Gear'
], lap.LapId);
}
// Renders the lap time data in the appropriate table on the results page.
function renderRankingLapTimes(laps, tableSelector, track, mode) {
var table = document.querySelector(tableSelector);
var tableHead = document.createElement('thead');
var tableBody = document.createElement('tbody');
var lapTimeZero = laps && laps.length > 0 ? laps[0].LapTimeMs : 0;
laps.forEach(function (lap, index) {
var lapTimeOffset = lap.LapTimeMs - lapTimeZero;
var cells;
switch (mode) {
case 'Country':
cells = [(index + 1), lap.PlayerName, lap.Location, formatMs(lap.LapTimeMs), formatMs(lapTimeOffset), lap.Damage];
break;
case 'Location':
cells = [(index + 1), lap.PlayerName, formatMs(lap.LapTimeMs), formatMs(lapTimeOffset), lap.Damage];
break;
default:
cells = [(index + 1), lap.PlayerName, lap.Country, lap.Location, formatMs(lap.LapTimeMs), formatMs(lapTimeOffset), lap.Damage];
break;
}
tableBody.appendChild(getTableRow(cells, 'td', function () {
showLapTelemetry(lap, track);
}));
});
table.innerHTML = '';
switch (mode) {
case 'Country':
tableHead.appendChild(getTableRow(['Pos', 'Name', 'Location', 'Laptime', 'Delta', 'Damage'], 'th'));
break;
case 'Location':
tableHead.appendChild(getTableRow(['Pos', 'Name', 'Laptime', 'Delta', 'Damage'], 'th'));
break;
default:
tableHead.appendChild(getTableRow(['Pos', 'Name', 'Country', 'Location', 'Laptime', 'Delta', 'Damage'], 'th'));
break;
}
table.appendChild(tableHead);
table.appendChild(tableBody);
}
// Country Statistics
function initCountryStat(track, selector, countryCode) {
// ToDo: Add code to get the country track data and pass it to the render method
track.getRankingLapTimesByCountry(function(data) {
renderRankingLapTimes(data, '.track-stats-country ' + selector, track, 'Country');
}, ['PartitionKey', 'PlayerName', 'Location', 'LapTimeMs', 'Damage', 'LapId'], countryCode);
}
function initCountryStats(countryCode) {
// ToDo: Add code to initialize the country data for the three tracks
initCountryStat(racing.data.beginnerTrack, '.track-stats-beginner', countryCode);
initCountryStat(racing.data.advancedTrack, '.track-stats-advanced', countryCode);
initCountryStat(racing.data.expertTrack, '.track-stats-expert', countryCode);
}
// Location Statistics
// Get the track data and pass it to the render method
function initLocationStat(track, selector, locationId) {
// ToDo: Add code to get the location track data and pass it to the render method
track.getRankingLapTimesByLocation(function (data) {
renderRankingLapTimes(data, '.track-stats-location ' + selector, track, 'Location');
}, ['PartitionKey', 'PlayerName', 'LapTimeMs', 'Damage', 'LapId'], locationId);
}
// Initialize the data for the tracks.
function initLocationStats(locationId) {
// ToDo: Add code to initialize the location data for the beginner track
initLocationStat(racing.data.beginnerTrack, '.track-stats-beginner', locationId);
// ToDo: Add code to initialize the location data for the advanced and expert tracks
initLocationStat(racing.data.advancedTrack, '.track-stats-advanced', locationId);
initLocationStat(racing.data.expertTrack, '.track-stats-expert', locationId);
}
// ToDo: Set your country code and location ID.
var yourLocationId = '1251';
var yourCountryCode = 'DK';
// Initialize the page with location statistics
initLocationStats(yourLocationId);
initCountryStats(yourCountryCode);
}(window.racing));