JSFiddle - React, Tailwind, and code Playground

by PiereDome

HTML

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<div ng-app>
    <div ng-controller='test'>
<div id='drop_zone'>Drop Files Here</div>
<output id="list"></output>
        <div ng-repeat='company in companies'>
            <span>{{company.id}}- {{company.percent}}%, {{company.fails.snap}} snaps, {{company.fails.mount}} mounts, rep {{company.fails.rep}}, {{company.notes}}</span>
        </div>
        <div ng-click='push()'>Upload</div>
    </div>
</div>

CSS

#drop_zone{
    width: 50%;
    height: 100px;
    background: grey;
}

JavaScript

//File Upload --drag and drop

function parseCSV(rawData) {
    var companies = [];
    var lines = rawData.split('\n');
    if (lines[0].match(/Companies/)) {
        for (var i = 1; i < lines.length; i++) {
            cols = lines[i].split(',');
            companies.push({
                id: cols[0],
                percent: cols[1],
                fails: {
                    snap: cols[2],
                    mount: cols[3],
                    rep: cols[4]
                },
                notes: cols[5]
            });
        }
        return companies;
    } else {
        lines[12] = lines[12].concat(lines.splice(13, 2));
        for (var i = 0; i < lines.length; i++) {
            lines[i] = lines[i].split(',');
        }
        var serverCount = 0,
            snaps = 0,
            snapFails = 0,
            vits = 0,
            mounts = 0,
            sqls = 0,
            rep = 0;
        for (var i = 13; lines[i][1].length > 1; i++) {
            line = lines[i];
            //parseData
            snaps += parseInt(line[2]);
            snapFails += parseInt(line[3]);
            vits += parseInt(line[5]);
            mounts += parseInt(line[7]);
            sqls += parseInt(line[9]);
            rep += parseInt(line[13]);
            //Count how many server
            serverCount++;
        }
        var id = lines[3][0].match(/[\w]+$/)[0];
        company = {
            id: id,
            percent: Math.round(snaps / (24 * serverCount) * 100),
            fails: {
                snap: snapFails,
                mount: mounts,
                rep: rep
            },
            notes: ''
        };
        return company;
    }
}

function test($scope) {
    $scope.companies = [];
    var reader = new FileReader();
    reader.onloadend = function(evt) {
        if (evt.target.readyState == FileReader.DONE) {
            fileData = evt.target.result;
            parsedData = parseCSV(fileData);
            if (parsedData instanceof...