function getHighestRow() {
    var i = 1;
    while (document.getElementById('row' + i) !== null) {
        ++i;
    }
    return i - 1;
}

function deleteARow() {
    let row = parseInt(this.id.substring(6));
    document.getElementById('row' + row).remove();
    // Adjust row numbers
    let allRows = document.querySelectorAll('#dataTable tr');
    let rowIndex = 1;
    let firstTime = true;
    for (let row of allRows) {
        if (firstTime) {
            firstTime = false;
            continue;
        }
        row.id = 'row' + rowIndex;
        row.querySelector('.expected').id = 'expected' + rowIndex;
        row.querySelector('.actual').id = 'actual' + rowIndex;
        row.querySelector('.delete').id = 'delete' + rowIndex;
        ++rowIndex;
    };
    // Hide delete buttons if necessary
    if (getHighestRow() <= 2) {
        for (let deleteButtons of document.querySelectorAll('.delete')) {
            deleteButtons.style.display = 'none';
        }
    }
}

document.addEventListener('DOMContentLoaded', event => {
    document.getElementById('addRowButton').onclick = function() {
        var i = getHighestRow() + 1;
        var row = document.createElement('tr');
        row.id = 'row' + i;
        var expected = document.createElement('td');
        expected.innerHTML = '<input type="text" class="expected" id="expected' + i + '" value="100">';
        row.appendChild(expected);
        var actual = document.createElement('td');
        actual.innerHTML = '<input type="text" class="actual" id="actual' + i + '" value="10">';
        row.appendChild(actual);
        var deleteButton = document.createElement('td');
        deleteButton.innerHTML = '<input type="button" value="Delete row" class="delete" id="delete' + i + '">';
        deleteButton.querySelector('.delete').onclick = deleteARow;
        row.appendChild(deleteButton);
        document.getElementById('dataTable').appendChild(row);

        for (let deleteButton of document.querySelectorAll('.delete')) {
            deleteButton.style.display = 'inline';
        }
    };
    for (let deleteButton of document.querySelectorAll('.delete')) {
        deleteButton.onclick = deleteARow;
    }

    document.getElementById('doBinomial').onclick = function() {
        let percentages = [];
        let nums = [];
        let i = 1;
        while (document.getElementById('expected' + i) !== null) {
            percentages.push(parseFloat(document.getElementById('expected' + i).value));
            nums.push(parseFloat(document.getElementById('actual' + i).value));
            ++i;
        }
        var total = 0.0;
        for (let p of percentages) {
            total += p;
        }
        var factor = 100.0/total;
        percentages = percentages.map(p => factor * p);
        fetch(statScriptName + '?percentages=' + percentages.join(',') + '&nums=' + nums.join(','))
            .then(response => response.json())
            .then(doBinomialSuccess)
            .catch(doBinomialError);
    }
});

function doBinomialSuccess(data) {
    let prob = parseFloat(data['prob']);
    let html, dataClass;
    if (prob < 0.05) {
        html = 'Yes';
        dataClass = 'sig';
    } else {
        html = 'No';
        dataClass = 'notSig';
    }
    html += ' (chi-squared p=' + prob.toFixed(3) + ' ' + (prob < 0.05 ? '<' : '>') + ' 0.05)';
    const binomialResult = document.getElementById('binomialResult');
    const binomialAuxData = document.getElementById('binomialAuxData');
    binomialResult.innerHTML = html;
    binomialResult.classList.remove('sig');
    binomialResult.classList.remove('notSig');
    binomialResult.classList.add(dataClass);
    binomialAuxData.innerHTML = '(variance is ' + data['variance'].toFixed(3) + ' with ' + data['degreesOfFreedom'] + ' degree' + (data['degreesOfFreedom'] == 1 ? '' : 's') + ' of freedom)';
}

function doBinomialError(data) {
    const binomialResult = document.getElementById('binomialResult');
    const binomialAuxData = document.getElementById('binomialAuxData');
    binomialResult.innerHTML = '<b>Error!</b>';
    binomialAuxData.innerHTML = '';
}