JSFiddle - React, Tailwind, and code Playground

by Brad Christie

HTML

<pre id="log_file">
Fri May 27 12:43:48 PDT 2011      user1 command1 1 2 3
Fri May 27 12:43:50 PDT 2011      user1 command2 abcdef   12  11
Fri May 27 12:44:00 PDT 2011      user1 command3
Fri May 27 12:45:12 PDT 2011      user1 command4
</pre>

CSS

table,td { border: 1px solid black; }

JavaScript

String.prototype.toTable = function(){
    var table = $('<table>');
    $('<tr>').append(
        $('<th>').text('Date')
    ).append(
        $('<th>').text('User')
    ).append(
        $('<th>').text('Command')
    ).appendTo(table);
    
    var lines = this.split(/[\r\n]/);
    for (var l = 0; l < lines.length; l++){
        var info = lines[l].match(/(\w+ \w+ \d+ \d+:\d+:\d+ \w+ \d+)\s*(\w+)\s*(.*)/);
        if (info == null) continue;
        $('<tr>').append(
            $('<td>').text(info[1])
        ).append(
            $('<td>').text(info[2])
        ).append(
            $('<td>').text(info[3])
        ).appendTo(table);
    }
    
    return table;
};

$('#log_file').text().toTable().appendTo('body');