JSFiddle - React, Tailwind, and code Playground

by makfruit

HTML

<label>Days after release:</label> <input type="number" id="span" value="7" /><br/>

<label>Release dates:</label> <textarea id="releases" rows="8">
2014-08-20</textarea>
<br /><br />
<div id="result"></div>

CSS

label {
    width: 150px;
    display: inline-block;
    vertical-align: top;
}

JavaScript

var downloads = undefined;

$.getJSON('https://api.wordpress.org/stats/plugin/1.0/downloads.php?slug=ecwid-shopping-cart&limit=300&callback=?', function(data) {
    downloads = data;
    calculate();
});

function calculate()
{
    $('#result').html(' ');
        var releases = $('#releases').text().split("\n");
    for (var i in releases) {
        var counter = -1;
        var sum = 0;
        for (var j in downloads) {
            if (i-1 != releases.length && j == releases[parseInt(i) + 1]) {
                break;
            }
            if (j == releases[i]) {
                var counter = parseInt($('#span').val()) - 1;
                var releaseDate = releases[i];
            }
            if (counter != -1) {
                counter --;
                sum += parseInt(downloads[j]);
                if (counter == -1) {
                    break;
                }
            }
        }
        notFullNote = '';
        if (counter != -1) {
            notFullNote = ' (' + (parseInt($('#span').val()) - parseInt(counter) - 1) + ' days)'
        }
        $('#result').html($('#result').html() + releaseDate + ' ' + sum + notFullNote + '<br />');
    }
}

$('#span').change(function() {calculate(); });