var addSorting = (function () {
|
"use strict";
|
var cols,
|
currentSort = {
|
index: 0,
|
desc: false
|
};
|
|
// returns the summary table element
|
function getTable() { return document.querySelector('.coverage-summary table'); }
|
// returns the thead element of the summary table
|
function getTableHeader() { return getTable().querySelector('thead tr'); }
|
// returns the tbody element of the summary table
|
function getTableBody() { return getTable().querySelector('tbody'); }
|
// returns the th element for nth column
|
function getNthColumn(n) { return getTableHeader().querySelectorAll('th')[n]; }
|
|
// loads all columns
|
function loadColumns() {
|
var colNodes = getTableHeader().querySelectorAll('th'),
|
colNode,
|
cols = [],
|
col,
|
i;
|
|
for (i = 0; i < colNodes.length; i += 1) {
|
colNode = colNodes[i];
|
col = {
|
key: colNode.getAttribute('data-col'),
|
sortable: !colNode.getAttribute('data-nosort'),
|
type: colNode.getAttribute('data-type') || 'string'
|
};
|
cols.push(col);
|
if (col.sortable) {
|
col.defaultDescSort = col.type === 'number';
|
colNode.innerHTML = colNode.innerHTML + '<span class="sorter"></span>';
|
}
|
}
|
return cols;
|
}
|
// attaches a data attribute to every tr element with an object
|
// of data values keyed by column name
|
function loadRowData(tableRow) {
|
var tableCols = tableRow.querySelectorAll('td'),
|
colNode,
|
col,
|
data = {},
|
i,
|
val;
|
for (i = 0; i < tableCols.length; i += 1) {
|
colNode = tableCols[i];
|
col = cols[i];
|
val = colNode.getAttribute('data-value');
|
if (col.type === 'number') {
|
val = Number(val);
|
}
|
data[col.key] = val;
|
}
|
return data;
|
}
|
// loads all row data
|
function loadData() {
|
var rows = getTableBody().querySelectorAll('tr'),
|
i;
|
|
for (i = 0; i < rows.length; i += 1) {
|
rows[i].data = loadRowData(rows[i]);
|
}
|
}
|
// sorts the table using the data for the ith column
|
function sortByIndex(index, desc) {
|
var key = cols[index].key,
|
sorter = function (a, b) {
|
a = a.data[key];
|
b = b.data[key];
|
return a < b ? -1 : a > b ? 1 : 0;
|
},
|
finalSorter = sorter,
|
tableBody = document.querySelector('.coverage-summary tbody'),
|
rowNodes = tableBody.querySelectorAll('tr'),
|
rows = [],
|
i;
|
|
if (desc) {
|
finalSorter = function (a, b) {
|
return -1 * sorter(a, b);
|
};
|
}
|
|
for (i = 0; i < rowNodes.length; i += 1) {
|
rows.push(rowNodes[i]);
|
tableBody.removeChild(rowNodes[i]);
|
}
|
|
rows.sort(finalSorter);
|
|
for (i = 0; i < rows.length; i += 1) {
|
tableBody.appendChild(rows[i]);
|
}
|
}
|
// removes sort indicators for current column being sorted
|
function removeSortIndicators() {
|
var col = getNthColumn(currentSort.index),
|
cls = col.className;
|
|
cls = cls.replace(/ sorted$/, '').replace(/ sorted-desc$/, '');
|
col.className = cls;
|
}
|
// adds sort indicators for current column being sorted
|
function addSortIndicators() {
|
getNthColumn(currentSort.index).className += currentSort.desc ? ' sorted-desc' : ' sorted';
|
}
|
// adds event listeners for all sorter widgets
|
function enableUI() {
|
var i,
|
el,
|
ithSorter = function ithSorter(i) {
|
var col = cols[i];
|
|
return function () {
|
var desc = col.defaultDescSort;
|
|
if (currentSort.index === i) {
|
desc = !currentSort.desc;
|
}
|
sortByIndex(i, desc);
|
removeSortIndicators();
|
currentSort.index = i;
|
currentSort.desc = desc;
|
addSortIndicators();
|
};
|
};
|
for (i =0 ; i < cols.length; i += 1) {
|
if (cols[i].sortable) {
|
el = getNthColumn(i).querySelector('.sorter');
|
if (el.addEventListener) {
|
el.addEventListener('click', ithSorter(i));
|
} else {
|
el.attachEvent('onclick', ithSorter(i));
|
}
|
}
|
}
|
}
|
// adds sorting functionality to the UI
|
return function () {
|
if (!getTable()) {
|
return;
|
}
|
cols = loadColumns();
|
loadData(cols);
|
addSortIndicators();
|
enableUI();
|
};
|
})();
|
|
window.addEventListener('load', addSorting);
|
