@andypf/json-viewer/coverage/lcov-report/sorter.js

A javascript library to visualize json nicely

/* eslint-disable */
var addSorting = (function () {
  "use strict"
  var cols,
    currentSort = {
      index: 0,
      desc: false,
    }

  // returns the summary table element
  function getTable() {
    return document.querySelector(".coverage-summary")
  }
  // 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]
  }

  function onFilterInput() {
    const searchValue = document.getElementById("fileSearch").value
    const rows = document.getElementsByTagName("tbody")[0].children
    for (let i = 0; i < rows.length; i++) {
      const row = rows[i]
      if (row.textContent.toLowerCase().includes(searchValue.toLowerCase())) {
        row.style.display = ""
      } else {
        row.style.display = "none"
      }
    }
  }

  // loads the search box
  function addSearchBox() {
    var template = document.getElementById("filterTemplate")
    var templateClone = template.content.cloneNode(true)
    templateClone.getElementById("fileSearch").oninput = onFilterInput
    template.parentElement.appendChild(templateClone)
  }

  // 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) {
        // add the click event handler on the th so users
        // dont have to click on those tiny arrows
        el = getNthColumn(i).querySelector(".sorter").parentElement
        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()
    addSearchBox()
    addSortIndicators()
    enableUI()
  }
})()

window.addEventListener("load", addSorting)