Stop using area_keys

See servo/internal-wpt-dashboard#62

Signed-off-by: Oriol Brufau <[email protected]>

Author: Loirooriol

assets/js/load-chart.js

@@ -117,9 +117,8 @@ function setupChart () {
 
     function update_chart () {
         if (!all_scores) throw new Error('scores not loaded')
-        const chosen_area = area_dropdown.value
+        const area_index = +area_dropdown.value
         const chosen_period = period_dropdown.value
-        const area_index = all_scores.area_keys.indexOf(chosen_area)
         const table = new google.visualization.DataTable()
         options.series = []
         const monthsToSubtract = periodRanges[chosen_period]
@@ -164,10 +163,10 @@ function setupChart () {
                 options.hAxis.format = 'MMM YYYY'
             }
 
-            for (const area of scores.area_keys) {
+            for (const [index, area] of scores.focus_areas.entries()) {
                 const selector = document.createElement('option')
-                selector.value = area
-                selector.textContent = scores.focus_areas[area]
+                selector.value = index
+                selector.textContent = area
                 area_dropdown.appendChild(selector)
             }
 
@@ -193,7 +192,7 @@ function setupChart () {
                     update_chart()
                 })
             }
-            area_dropdown.value = scores.area_keys[0]
+            area_dropdown.value = 0
             period_dropdown.value = Object.keys(periodRanges)[4]
             update_chart()
         })

assets/js/load-table.js

@@ -13,14 +13,14 @@ function update_table (scores) {
     const score_table = document.getElementById('score-table-body')
     removeChildren(score_table)
 
-    for (const [idx, area] of scores.area_keys.entries()) {
+    for (const [idx, area] of scores.focus_areas.entries()) {
         const area_score = scores.scores_last_run[idx + AREA_SCORE_OFFSET]
         const score = Math.floor(1000 * area_score.total_score / area_score.total_tests) / 10
         const subtests = Math.floor(1000 * area_score.total_subtests_passed / area_score.total_subtests) / 10
         score_table.insertAdjacentHTML(
             'beforeend',
             `<tr class="${idx % 2 ? 'odd' : 'even'}">
-                <td>${scores.focus_areas[area]}</td>
+                <td>${area}</td>
                 <td class="score">${String(score).padEnd(4, '.0')}%</td>
                 <td class="score">(${new Intl.NumberFormat().format(area_score.total_subtests_passed)}/${new Intl.NumberFormat().format(area_score.total_subtests)}) ${String(subtests).padEnd(4, '.0')}%</td>
             </tr>`