table-sort-js - npm Package Compare versions

Comparing version 1.4.7 to 1.5.8

package.json

 {
 "name": "table-sort-js",
-"version": "1.4.7",
+"version": "1.5.8",
 "description": "A JavaScript client-side HTML table sorting library with no dependencies required.",
   "license": "MIT",
-  "repository": "LeeWannacott/TABLE-SORT-JS",
+  "repository": "LeeWannacott/table-sort-js",
   "main": "table-sort.js",
@@ -8,0 +8,0 @@ "keywords": [

README.md

 ![table-sort-js](https://img.shields.io/npm/v/table-sort-js)
-![table-sort-js](https://img.shields.io/npm/dt/table-sort-js)
+![table-sort-js](https://img.shields.io/npm/dm/table-sort-js)
 ![table-sort-js](https://img.shields.io/github/repo-size/leewannacott/table-sort-js)
@@ -15,5 +15,5 @@ ![table-sort-js](https://img.shields.io/github/license/LeeWannacott/table-sort-js)
 - [npm package.](https://www.npmjs.com/package/table-sort-js)
-## Install instructions - pick one option.
+## Install instructions.
 
-1. Install from npm: ` npm install table-sort-js` 
+<b>Option 1.</b> Install from npm: ` npm install table-sort-js` 
 
@@ -26,3 +26,3 @@ ```javascript
 
-2. [Download table-sort.js](https://leewannacott.github.io/table-sort-js/table-sort.js) (Select save as.)
+<b>Option 2.</b> [Download table-sort.js](https://leewannacott.github.io/table-sort-js/table-sort.js) (Select save as.)
 
@@ -34,8 +34,10 @@ Then add the following script before your HTML table:
 Refer to the documenation for examples how to use table-sort-js with [HTML.](https://leewannacott.github.io/table-sort-js/docs/html5.html)
-#### To make a table sortable: 
-- Add `class="table-sort"` to HTML &lt;table&gt; tags. Click on the columns heads to sort.
+#### To make tables sortable: 
 
+- Add `class="table-sort"` to HTML &lt;table&gt; tags.
+- Click on table headers to sort columns.
+
 #### Classes:
 
-| table classes  | Description                                                                             |
+| &lt;table&gt; classes   | Description                                                                             |
 | -------------- | ------------------------------------------------                                        |
@@ -46,3 +48,3 @@ | "table-sort"   | Make the table sortable! (Words, numbers, dates)                                        |
 
-| th classes      | Description                                                 |
+| &lt;th&gt; classes      | Description                                                 |
 | --------------- | ----------------------------------------------------------- |
@@ -53,8 +55,3 @@ | "order-by-desc" | Order by descending on first click. (default is aescending) |
 
-#### Notes:
-
-- Makes use of natural sorting to sort numerical values correctly.
-- If `<thead>` does not exist it will be created by using data from first row. `<tbody>` is optional.
-
 #### Development:
 If you wish to contribute, install instructions can be found [here.](https://leewannacott.github.io/table-sort-js/docs/development.html)

table-sort.js

@@ -19,14 +19,12 @@ /*
 function tableSortJs(test = false, domDocumentWindow = document) {
-  function checkIfTesting() {
+  function getHTMLTables() {
     if (test === true) {
       const getTagTable = domDocumentWindow.getElementsByTagName("table");
-      const createTableHead = domDocumentWindow.createElement("thead");
-      return [getTagTable, createTableHead];
+      return [getTagTable];
     } else {
       const getTagTable = document.getElementsByTagName("table");
-      const createTableHead = document.createElement("thead");
-      return [getTagTable, createTableHead];
+      return [getTagTable];
     }
   }
-  const [getTagTable, createTableHead] = checkIfTesting();
+  const [getTagTable] = getHTMLTables();
   const columnIndexAndTableRow = {};
@@ -41,10 +39,22 @@ const fileSizeColumnTextAndRow = {};
   function makeTableSortable(sortableTable) {
+    let createTableHead;
+    let tableBody;
     if (sortableTable.getElementsByTagName("thead").length === 0) {
-      createTableHead;
-      the.appendChild(sortableTable.rows[0]);
-      sortableTable.insertBefore(the, sortableTable.firstChild);
+      if (test === true) {
+        createTableHead = domDocumentWindow.createElement("thead");
+      } else {
+        createTableHead = document.createElement("thead");
+      }
+      createTableHead.appendChild(sortableTable.rows[0]);
+      sortableTable.insertBefore(createTableHead, sortableTable.firstChild);
+      if (sortableTable.querySelectorAll("tbody").length > 1) {
+        tableBody = sortableTable.querySelectorAll("tbody")[1];
+      } else {
+        tableBody = sortableTable.querySelector("tbody");
+      }
+    } else {
+      tableBody = sortableTable.querySelector("tbody");
     }
 
     const tableHead = sortableTable.querySelector("thead");
-    const tableBody = sortableTable.querySelector("tbody");
     const tableHeadHeaders = tableHead.querySelectorAll("th");
@@ -56,3 +66,13 @@ tableHead.style.cursor = "pointer";
       let timesClickedColumn = 0;
+      let desc = th.classList.contains("order-by-desc");
+      let tableArrows = sortableTable.classList.contains("table-arrows");
+      let arrowUp = " ▲";
+      let arrowDown = " ▼";
 
+      if (desc && tableArrows) {
+        th.insertAdjacentText("beforeend", arrowDown);
+      } else if (tableArrows){
+        th.insertAdjacentText("beforeend", arrowUp);
+      }
+
       th.addEventListener("click", function () {
@@ -63,6 +83,7 @@ const tableRows = tableBody.querySelectorAll("tr");
         let isDataAttribute = th.classList.contains("data-sort");
-        if(isDataAttribute){
+        if (isDataAttribute) {
           for (let [i, tr] of tableRows.entries()) {
-            const dataAttributeTd = tr.querySelectorAll("td").item(columnIndex).dataset.sort
-            columnData.push(`${dataAttributeTd}#${i}`)
+            const dataAttributeTd = tr.querySelectorAll("td").item(columnIndex)
+              .dataset.sort;
+            columnData.push(`${dataAttributeTd}#${i}`);
             columnIndexAndTableRow[columnData[i]] = tr.innerHTML;
@@ -74,3 +95,4 @@ }
         if (isDayOfWeek) {
-          const day = /(Monday|Tuesday|Wednesday|Thursday|Friday|Saturday|Sunday|Mon|Tue|Wed|Thur|Fri|Sat|Sun)/i;
+          const day =
+            /(Monday|Tuesday|Wednesday|Thursday|Friday|Saturday|Sunday|Mon|Tue|Wed|Thur|Fri|Sat|Sun)/i;
           const dayOfWeek = {
@@ -86,4 +108,5 @@ Monday: 1,
           for (let [i, tr] of tableRows.entries()) {
-            const dayOfWeekTd = tr.querySelectorAll("td").item(columnIndex)
-              .textContent;
+            const dayOfWeekTd = tr
+              .querySelectorAll("td")
+              .item(columnIndex).textContent;
             if (dayOfWeekTd.match(day)) {
@@ -114,4 +137,6 @@ if (dayOfWeekTd.match(/Monday|Mon/i)) {
         if (isFileSize) {
-          const numberWithUnitType = /[.0-9]+(\s?B|\s?KB|\s?KiB|\s?MB|\s?MiB|\s?GB|\s?GiB|T\s?B|\s?TiB)/i;
-          const unitType = /(\s?B|\s?KB|\s?KiB|\s?MB|\s?MiB|\s?GB|G\s?iB|\s?TB|\s?TiB)/i;
+          const numberWithUnitType =
+            /[.0-9]+(\s?B|\s?KB|\s?KiB|\s?MB|\s?MiB|\s?GB|\s?GiB|T\s?B|\s?TiB)/i;
+          const unitType =
+            /(\s?B|\s?KB|\s?KiB|\s?MB|\s?MiB|\s?GB|G\s?iB|\s?TB|\s?TiB)/i;
           const fileSizes = {
@@ -139,28 +164,53 @@ Kibibyte: 1024,
           for (let [i, tr] of tableRows.entries()) {
-            let fileSizeTd = tr.querySelectorAll("td").item(columnIndex)
-              .textContent;
+            let fileSizeTd = tr
+              .querySelectorAll("td")
+              .item(columnIndex).textContent;
             if (fileSizeTd.match(numberWithUnitType)) {
               if (fileSizeTd.match(/\s?KB/i)) {
-                fileSizeTd = removeUnitTypeConvertToBytes(fileSizeTd, 'Kilobyte')
+                fileSizeTd = removeUnitTypeConvertToBytes(
+                  fileSizeTd,
+                  "Kilobyte"
+                );
                 columnData.push(`${fileSizeTd}#${i}`);
               } else if (fileSizeTd.match(/\s?KiB/i)) {
-                fileSizeTd = removeUnitTypeConvertToBytes(fileSizeTd, 'Kibibyte')
+                fileSizeTd = removeUnitTypeConvertToBytes(
+                  fileSizeTd,
+                  "Kibibyte"
+                );
                 columnData.push(`${fileSizeTd}#${i}`);
               } else if (fileSizeTd.match(/\s?MB/i)) {
-                fileSizeTd = removeUnitTypeConvertToBytes(fileSizeTd, 'Megabyte')
+                fileSizeTd = removeUnitTypeConvertToBytes(
+                  fileSizeTd,
+                  "Megabyte"
+                );
                 columnData.push(`${fileSizeTd}#${i}`);
               } else if (fileSizeTd.match(/\s?MiB/i)) {
-                fileSizeTd = removeUnitTypeConvertToBytes(fileSizeTd, 'Mebibyte')
+                fileSizeTd = removeUnitTypeConvertToBytes(
+                  fileSizeTd,
+                  "Mebibyte"
+                );
                 columnData.push(`${fileSizeTd}#${i}`);
               } else if (fileSizeTd.match(/\s?GB/i)) {
-                fileSizeTd = removeUnitTypeConvertToBytes(fileSizeTd, 'Gigabyte')
+                fileSizeTd = removeUnitTypeConvertToBytes(
+                  fileSizeTd,
+                  "Gigabyte"
+                );
                 columnData.push(`${fileSizeTd}#${i}`);
               } else if (fileSizeTd.match(/\s?GiB/i)) {
-                fileSizeTd = removeUnitTypeConvertToBytes(fileSizeTd, 'Gibibyte')
+                fileSizeTd = removeUnitTypeConvertToBytes(
+                  fileSizeTd,
+                  "Gibibyte"
+                );
                 columnData.push(`${fileSizeTd}#${i}`);
               } else if (fileSizeTd.match(/\s?TB/i)) {
-                fileSizeTd = removeUnitTypeConvertToBytes(fileSizeTd, 'Terabyte')
+                fileSizeTd = removeUnitTypeConvertToBytes(
+                  fileSizeTd,
+                  "Terabyte"
+                );
                 columnData.push(`${fileSizeTd}#${i}`);
               } else if (fileSizeTd.match(/\s?TiB/i)) {
-                fileSizeTd = removeUnitTypeConvertToBytes(fileSizeTd, 'Tebibyte')
+                fileSizeTd = removeUnitTypeConvertToBytes(
+                  fileSizeTd,
+                  "Tebibyte"
+                );
                 columnData.push(`${fileSizeTd}#${i}`);
@@ -260,5 +310,4 @@ } else if (fileSizeTd.match(/\s?B/i)) {
               }
-              tr
-                .querySelectorAll("td")
-                .item(columnIndex).innerHTML = fileSizeInBytesHTML;
+              tr.querySelectorAll("td").item(columnIndex).innerHTML =
+                fileSizeInBytesHTML;
             } else if (!isFileSize) {
@@ -273,4 +322,5 @@ tr.innerHTML = columnIndexAndTableRow[columnData[i]];
             // inner text for column we click on
-            let tdTextContent = tr.querySelectorAll("td").item(columnIndex)
-              .textContent;
+            let tdTextContent = tr
+              .querySelectorAll("td")
+              .item(columnIndex).textContent;
             if (tdTextContent.length === 0) {
@@ -320,5 +370,2 @@ tdTextContent = "";
 
-          let arrowUp = " ▲";
-          let arrowDown = " ▼";
-
           // Sort naturally; default aescending unless th contains 'order-by-desc' as className.
@@ -329,5 +376,2 @@ if (columnData[0] === undefined) {
 
-          let desc = th.classList.contains("order-by-desc");
-          let tableArrows = sortableTable.classList.contains("table-arrows");
-
           if (timesClickedColumn === 1) {
@@ -334,0 +378,0 @@ if (desc) {

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

21480

increased by3.8%

Lines of code

394

increased by12.89%

Worsened metrics

Number of lines in readme file

53

decreased by-5.36%

No dependency changes