diff --git a/README.md b/README.md index 3275780..3b51799 100644 --- a/README.md +++ b/README.md @@ -41,11 +41,12 @@ Refer to the documenation for examples on how to use table-sort-js with [HTML](h #### Classes: -| <table> classes | Description | -| --------------------- | ----------------------------------------------------------------------- | -| "table-sort" | Make the table sortable! (Words, numbers, dates) | -| "table-arrows" | Display ascending or descending triangles. | -| "remember-sort" | If clicking on different columns remembers sort of the original column. | +| <table> classes | Description | +| --------------------- | --------------------------------------------------------------------------------------------| +| "table-sort" | Make the table sortable! (Words, numbers)... | +| "table-arrows" | Display ascending or descending triangles. | +| "no-class-infer" | Turns off inference for adding sort classes automatically (file-size-sort and runtime-sort).| +| "remember-sort" | If clicking on different columns remembers sort of the original column. | | <th> classes | Description | | ------------------ | --------------------------------------------------------------------------------------------------------------------------------------- | diff --git a/deploy.sh b/deploy.sh index 41458ce..993416c 100755 --- a/deploy.sh +++ b/deploy.sh @@ -1,4 +1,5 @@ cp public/table-sort.js npm/table-sort.js +cp public/table-sort.js browser-extension/table-sort.js cp README.md npm/README.md cp LICENSE npm/LICENSE cp Contributors.md npm/Contributors.md diff --git a/public/index.html b/public/index.html index 1ebc88e..2b3c974 100644 --- a/public/index.html +++ b/public/index.html @@ -1,20 +1,22 @@ - +
- +

Testing table sort js

- + + + @@ -23,6 +25,8 @@

Testing table sort js

+ + @@ -30,6 +34,8 @@

Testing table sort js

+ + @@ -37,6 +43,8 @@

Testing table sort js

+ + @@ -44,6 +52,8 @@

Testing table sort js

+ + @@ -52,6 +62,8 @@

Testing table sort js

+ +
Last NameLast Name First Name Birth Date Employee ID DepartmentRuntimeFile Size
1706,1,17 k-level1h 1m 17s10b
da Vinci 1452.4.15 1m 45s192038998987021b
Statham 1967-7-26 HR11m 40s134809b
Micheal 1958/8/21 54 Marketing29s30980980b
1994/9/23 134 Marketing41s902938402398b
diff --git a/public/table-sort.js b/public/table-sort.js index 274eebd..fecf815 100644 --- a/public/table-sort.js +++ b/public/table-sort.js @@ -59,10 +59,64 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) { } } + function addInferredClass(th, columnLength, currentCount, classToAdd) { + const threshold = columnLength / 2; + if (currentCount >= threshold) { + th.classList.add(classToAdd); + } + } + + function inferSortClasses(tableRows, tableHeadHeaders) { + for (let [columnIndex, th] of tableHeadHeaders.entries()) { + const regexMinutesAndSeconds = /^(\d+h)?\s?(\d+m)?\s?(\d+s)?$/i; + const regexFileSizeSort = /^([.0-9]+)\s?(B|KB|KiB|MB|MiB|GB|GiB|TB|TiB)/i; + let runtimeSortCounter = 0, + fileSizeSortCounter = 0; + + let tableColumnLength = th.parentElement.childElementCount; + for (let tr of tableRows) { + let runtimeSortMatch, fileSizeSortMatch; + const tableColumn = tr.querySelectorAll("td").item(columnIndex); + if (tableColumn.innerText) { + runtimeSortMatch = tableColumn.innerText.match( + regexMinutesAndSeconds + ); + fileSizeSortMatch = tableColumn.innerText.match(regexFileSizeSort); + } + if (runtimeSortMatch) { + runtimeSortCounter++; + } + if (fileSizeSortMatch) { + fileSizeSortCounter++; + } + } + // TODO: refactor this into one function called addInferredClasses that loops over sort classes and counters + addInferredClass( + th, + tableColumnLength, + runtimeSortCounter, + "runtime-sort" + ); + addInferredClass( + th, + tableColumnLength, + fileSizeSortCounter, + "file-size-sort" + ); + } + } + function makeTableSortable(sortableTable) { const tableBody = getTableBody(sortableTable); const tableHead = sortableTable.querySelector("thead"); const tableHeadHeaders = tableHead.querySelectorAll("th"); + const tableRows = tableBody.querySelectorAll("tr"); + + const isNoSortClassInference = + sortableTable.classList.contains("no-class-infer"); + if (!isNoSortClassInference) { + inferSortClasses(tableRows, tableHeadHeaders); + } for (let [columnIndex, th] of tableHeadHeaders.entries()) { if (!th.classList.contains("disable-sort")) { @@ -124,24 +178,26 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) { function sortByRuntime(tableRows, columnData) { for (let [i, tr] of tableRows.entries()) { - const regexMinutesAndSeconds = /^(\d+m)\s?(\d+s)$/i; + const regexMinutesAndSeconds = /^(\d+h)?\s?(\d+m)?\s?(\d+s)?$/i; let columnOfTd = tr .querySelectorAll("td") .item(columnIndex).textContent; let match = columnOfTd.match(regexMinutesAndSeconds); - let minutesInSeconds, - seconds, - timeinSeconds = [0, 0, 0]; + let [minutesInSeconds, hours, seconds, timeinSeconds] = [0, 0, 0, 0]; if (match) { - const regexMinutes = match[1]; + const regexHours = match[1]; + if (regexHours) { + hours = Number(regexHours.replace("h", "")) * 60 * 60; + } + const regexMinutes = match[2]; if (regexMinutes) { minutesInSeconds = Number(regexMinutes.replace("m", "")) * 60; } - const regexSeconds = match[2]; + const regexSeconds = match[3]; if (regexSeconds) { seconds = Number(regexSeconds.replace("s", "")); } - timeinSeconds = minutesInSeconds + seconds; + timeinSeconds = hours + minutesInSeconds + seconds; } columnData.push(`${timeinSeconds}#${i}`); columnIndexAndTableRow[columnData[i]] = tr.innerHTML; diff --git a/src/test-table.js b/src/test-table.js index 97b6e14..9dd8342 100644 --- a/src/test-table.js +++ b/src/test-table.js @@ -92,8 +92,8 @@ export class App extends Component { Forks Open issues Watchers - Stars - Size (MB) + Sktars + Size (MB) @@ -114,7 +114,7 @@ export class App extends Component { {repo.open_issues} {repo.watchers} {repo.stargazers_count} - {Math.round(repo.size / 1000)} + {repo.size * 1000 + "B"} ))} diff --git a/test/table.js b/test/table.js index 104bf51..f62f44e 100644 --- a/test/table.js +++ b/test/table.js @@ -7,7 +7,7 @@ const tableSortJs = require("../public/table-sort"); function createTestTable( testTableData, thAttributes = { classTags: "", colspan: "" }, - props = { colsToClick: [], invisibleIndex: [] } + props = { colsToClick: [], invisibleIndex: [] ,tableTags:""} ) { const numberOfTableColumns = Object.keys(testTableData).length; let testTableHeaders = ""; diff --git a/test/table.test.js b/test/table.test.js index 53e1f2b..74cd6f9 100644 --- a/test/table.test.js +++ b/test/table.test.js @@ -257,10 +257,13 @@ test("time-sort class", () => { { col0: [ "2m 52s", + "1h 20m 10s", "3s", + "11h 10m 10s", "7s", "11m 40s", "36s", + "1h 10m 10s", "9m 44s", "1m 36s", "41s", @@ -274,6 +277,18 @@ test("time-sort class", () => { } ) ).toStrictEqual({ - col0: ["3s", "7s", "36s", "41s", "1m 36s", "2m 52s", "9m 44s", "11m 40s"], + col0: [ + "3s", + "7s", + "36s", + "41s", + "1m 36s", + "2m 52s", + "9m 44s", + "11m 40s", + "1h 10m 10s", + "1h 20m 10s", + "11h 10m 10s", + ], }); });