JavaScript Table Sorter - Combined with Blogger JSON

http://www.dte.web.id

by Taufik Nurrohman

HTML

<div id="toc-container">Memuat...</div>

CSS

body {
    margin:0;
    padding:10px;
    background-color:aliceblue;
}
.table-sortable {
    border-collapse:collapse;
    table-layout:fixed;
    width:100%;
    font:normal normal 13px/1.4 Arial, Sans-Serif;
    color:black;
    background-color:white;
}
.table-sortable th, .table-sortable td {
    margin:0;
    padding:5px 8px;
    border:none;
    vertical-align:top;
    text-align:left;
}
.table-sortable th {
    font-weight:bold;
    background-color:slategray;
    color:white;
    border-color:white;
}
.table-sortable tbody tr:nth-child(even) {
    background-color:whitesmoke
}
.table-sortable th {
    cursor:pointer
}
th.asc, th.desc {
    background-color:lightslategray
}
th.asc:before, th.desc:before {
    content:"";
    display:block;
    float:right;
    width:0;
    height:0;
    border:.4em solid transparent;
}
th.asc:before {
    border-bottom-color:inherit;
    border-top-width:0;
    margin-top:.4em;
}
th.desc:before {
    border-top-color:inherit;
    border-bottom-width:0;
    margin-top:.5em;
}
.table-sortable a {
    color:teal;
    text-decoration:none;
    font-weight:bold;
}
.table-sortable a:hover {
    text-decoration:underline
}

JavaScript

// Original code: http://stackoverflow.com/a/14268260/1163000
// Usage: `makeSortable(elem);`
(function () {
    function sortTable(table, col, reverse) {
        var tb = table.tBodies[0], // Use `<tbody>` to ignore `<thead>` and `<tfoot>` rows
            tr = Array.prototype.slice.call(tb.rows, 0); // Put rows into array
        reverse = -((+reverse) || -1);
        tr = tr.sort(function (a, b) { // Sort rows
            return reverse * (a.cells[col].textContent.trim().localeCompare(b.cells[col].textContent.trim()));
        });
        for (var i = 0, len = tr.length; i < len; ++i) {
            tb.appendChild(tr[i]); // Append each row in order
        }
    }

    function makeSortable(table) {
        var th = table.tHead,
            i;
        th && (th = th.rows[0]) && (th = th.cells);
        if (th) {
            i = th.length;
        } else {
            return; // If no `<thead>` then do nothing
        }
        while (--i >= 0)(function (i) {
            var dir = 1;
            th[i].onmousedown = function () {
                for (var j = 0, jen = th.length; j < jen; ++j) {
                    th[j].className = th[j].className.replace(/(^| )desc|asc( |$)/g, "$1$2");
                }
                sortTable(table, i, (dir = 1 - dir));
                this.className += dir === 1 ? " desc" : " asc";
                return false;
            };
        }(i));
    }
    window.makeSortable = makeSortable;
})();

// Fungsi untuk membuat Tabel Konten dengan JSON Blogger
function generateTOC(json) {
    var a = json.feed.entry,
        b, c, d, e, f = '<table class="table-sortable"><thead><tr><th>Judul Posting</th><th>Tanggal Terbit</th><th>Jumlah Komentar</th></tr></thead><tbody>',
        g = document.getElementById('toc-container');
    for (var i = 0, len = a.length; i < len; ++i) {
        for (var j = 0, jen = a[i].link.length; j < jen; ++j) {
            if (a[i].link[j].rel == "alternate") {
                b = a[i].link[j].href;
         ...