let grandprix_blocks;
let races;

function positionToScore(i) {
    switch(i) {
        case 0:
            return 4;
        case 1:
            return 2;
        case 2:
            return 1;
        default:
            return 0;
    }
}

function supertuxkartScoreUpdate() {
    d3.json("/dynamic/supertuxkartscore.json").then((data) => {
        grandprix_blocks = d3.select('#supertuxkart-results')
            .selectAll('div.grandprix-div')
            .data(data)
            .join(
                (enter) => {
                    const e = enter.append('div')
                        .classed('grandprix-div', true);
                    e.append('h3')
                        .text((d, i) => 'Grand prix ' + (i+1));
                    e.append('div').classed('races', true);
                    return e;
                },
                (update) => {
                    update.select('h3')
                        .text((d, i) => 'Grand prix ' + (i+1));
                    return update;
                },
                (exit) => {
                    exit.remove();
                }
            );

        races = grandprix_blocks.select('div.races')
            .selectAll('table')
            .data((d) => {
                return d.races.map((x) => {
                    x["total"] = d.total_races;
                    return x;
                });
            })
            .join(
                (enter) => {
                    const table = enter.append('table')
                        .classed('table', true);
                    let thead = table.append('thead');
                    thead.append('tr')
                        .append('th')
                        .attr('colspan', 4)
                        .text((d, i) => {
                            return "Race " + (i+1) + " out of " + d.total + " on " + d.track;
                        });
                    let headerrows = thead.append('tr');
                    ["Rank", "Name", "Time", "Points"].forEach((col) => {
                        headerrows.append('th').text(col);
                    });
                    table.append('tbody')
                        .classed('grandprix-tbody', true);
                    return table;
                },
                (update) => {
                    const u = update;
                    update.select('th[colspan="4"]')
                        .text((d, i) => {
                            return "Race " + (i+1) + " out of " + d.total + " on " + d.track;
                        });
                    return u;
                },
                (exit) => {
                    exit.remove();
                }
            );

        let tbodies = races.select('tbody.grandprix-tbody')
            .selectAll('tr')
            .data((d) => d.players)
            .join(
                (enter) => {
                    let e = enter.append('tr');
                    e.append('td')
                        .text((d,i) => (i+1) + '.');
                    e.append('td')
                        .text((d,i) => d.name);
                    e.append('td')
                        .text((d,i) => d.time);
                    e.append('td')
                        .text((d,i) => positionToScore(i));
                    return e;
                },
                (update) => {
                    update.select('td:nth-child(1)')
                        .text((d,i) => {console.log(d); return (i+1) + '.'});
                    update.select('td:nth-child(2)')
                        .text((d,i) => d.name);
                    update.select('td:nth-child(3)')
                        .text((d,i) => d.time);
                    update.select('td:nth-child(4)')
                        .text((d,i) => positionToScore(i));
                    return update;
                },
                (exit) => exit.remove()
            )
    });
}