From 2a935a28d55d3cfd6d35bce45cfaee311409d9c6 Mon Sep 17 00:00:00 2001 From: LeeWannacott Date: Wed, 31 May 2023 23:24:13 +1200 Subject: [PATCH 1/6] wip input searchbar with text inputed. --- public/table-sort.js | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/public/table-sort.js b/public/table-sort.js index 455c4d2..b0c9cbf 100644 --- a/public/table-sort.js +++ b/public/table-sort.js @@ -49,6 +49,13 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) { return sortableTable.querySelectorAll("tbody"); } } else { + let input = document.createElement('input') + input.style.backgroundColor = "red" + input.setAttribute("type", "text"); + input.setAttribute("id", "fuzzy") + input.addEventListener("input", sortFuzzySearch); + console.log("yo") + sortableTable.insertBefore(input, sortableTable.firstChild); // if or exists below the browser will make return sortableTable.querySelectorAll("tbody"); } @@ -174,6 +181,13 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) { } } + function sortFuzzySearch(e){ + console.log(e.target.value) + + + + } + function sortFileSize(table, column, columnIndex) { let unitToMultiplier = { b: 1, From 90e363ad0a0886a69acbc0e30fffa92d8e4bf286 Mon Sep 17 00:00:00 2001 From: LeeWannacott Date: Thu, 1 Jun 2023 01:03:55 +1200 Subject: [PATCH 2/6] wip 2: start of fuzzy algorithm. --- public/table-sort.js | 48 ++++++++++++++++++++++++++++++-------------- 1 file changed, 33 insertions(+), 15 deletions(-) diff --git a/public/table-sort.js b/public/table-sort.js index b0c9cbf..16db988 100644 --- a/public/table-sort.js +++ b/public/table-sort.js @@ -49,13 +49,6 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) { return sortableTable.querySelectorAll("tbody"); } } else { - let input = document.createElement('input') - input.style.backgroundColor = "red" - input.setAttribute("type", "text"); - input.setAttribute("id", "fuzzy") - input.addEventListener("input", sortFuzzySearch); - console.log("yo") - sortableTable.insertBefore(input, sortableTable.firstChild); // if or exists below the browser will make return sortableTable.querySelectorAll("tbody"); } @@ -123,13 +116,13 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) { rows: [], headers: [], }; + if (table.bodies.item(0) == null) { + return; + } for (let index of table.theads.keys()) { table.headers.push(table.theads.item(index).querySelectorAll("th")); } for (let index of table.bodies.keys()) { - if (table.bodies.item(index) == null) { - return; - } table.rows.push(table.bodies.item(index).querySelectorAll("tr")); } table.hasClass = { @@ -138,6 +131,15 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) { tableArrows: sortableTable.classList.contains("table-arrows"), rememberSort: sortableTable.classList.contains("remember-sort"), }; + + let input = document.createElement("input"); + input.style.backgroundColor = "red"; + input.setAttribute("type", "text"); + input.setAttribute("id", "fuzzy"); + input.tableRows = table.rows; + input.addEventListener("input", sortFuzzySearch); + sortableTable.insertBefore(input, sortableTable.firstChild); + for ( let headerIndex = 0; headerIndex < table.theads.length; @@ -181,11 +183,27 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) { } } - function sortFuzzySearch(e){ - console.log(e.target.value) - - - + function sortFuzzySearch(e) { + console.log(Array.from(e.target.value)); + let columnData = []; + for (let tr of e.target.tableRows[0]) { + let maxScoreForRow = []; + let tds = tr.querySelectorAll("td"); + for (let td of tds) { + let sum = 0; + for (let char of Array.from(e.target.value)){ + if (td.innerText.includes(char)) { + sum += 1; + console.log(td.innerText); + maxScoreForRow.push(sum); + } else { + maxScoreForRow.push(0); + } + } + } + columnData.push(Math.max(...maxScoreForRow)); + } + console.log("col", columnData); } function sortFileSize(table, column, columnIndex) { From 0df5c233fdef11653f2549d257b922367c919feb Mon Sep 17 00:00:00 2001 From: LeeWannacott Date: Thu, 1 Jun 2023 02:25:31 +1200 Subject: [PATCH 3/6] wip 3: divide by length of string. --- public/table-sort.js | 15 ++++++++++----- 1 file changed, 10 insertions(+), 5 deletions(-) diff --git a/public/table-sort.js b/public/table-sort.js index 16db988..1590b4c 100644 --- a/public/table-sort.js +++ b/public/table-sort.js @@ -189,19 +189,24 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) { for (let tr of e.target.tableRows[0]) { let maxScoreForRow = []; let tds = tr.querySelectorAll("td"); + let tdlengths = [] for (let td of tds) { let sum = 0; - for (let char of Array.from(e.target.value)){ + for (let char of Array.from(e.target.value)) { if (td.innerText.includes(char)) { sum += 1; console.log(td.innerText); - maxScoreForRow.push(sum); } else { - maxScoreForRow.push(0); + sum +=0 } + } + maxScoreForRow.push(sum); + tdlengths.push(td.innerText.length) } - } - columnData.push(Math.max(...maxScoreForRow)); + console.log(maxScoreForRow) + let mathMax = Math.max(...maxScoreForRow) + let index = maxScoreForRow.indexOf(mathMax) + columnData.push(Math.max(...maxScoreForRow)/tdlengths[index]); } console.log("col", columnData); } From 63230422beadfb45fddf478353297fa145237012 Mon Sep 17 00:00:00 2001 From: LeeWannacott Date: Thu, 1 Jun 2023 20:33:18 +1200 Subject: [PATCH 4/6] wip 4. --- public/index.html | 2 +- public/table-sort.js | 44 ++++++++++++++++++++++++++++++++------------ 2 files changed, 33 insertions(+), 13 deletions(-) diff --git a/public/index.html b/public/index.html index 0bbd82a..c6bd91a 100644 --- a/public/index.html +++ b/public/index.html @@ -85,7 +85,7 @@

Manual testing of table sort js

Testing table containing colspan and data-sort and multiple tbodies

- +
diff --git a/public/table-sort.js b/public/table-sort.js index 1590b4c..86b5369 100644 --- a/public/table-sort.js +++ b/public/table-sort.js @@ -137,6 +137,7 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) { input.setAttribute("type", "text"); input.setAttribute("id", "fuzzy"); input.tableRows = table.rows; + input.table = table; input.addEventListener("input", sortFuzzySearch); sortableTable.insertBefore(input, sortableTable.firstChild); @@ -186,29 +187,48 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) { function sortFuzzySearch(e) { console.log(Array.from(e.target.value)); let columnData = []; - for (let tr of e.target.tableRows[0]) { + for (let [i, tr] of e.target.tableRows[0].entries()) { let maxScoreForRow = []; let tds = tr.querySelectorAll("td"); - let tdlengths = [] + let tdlengths = []; for (let td of tds) { let sum = 0; for (let char of Array.from(e.target.value)) { if (td.innerText.includes(char)) { sum += 1; - console.log(td.innerText); - } else { - sum +=0 } } - maxScoreForRow.push(sum); - tdlengths.push(td.innerText.length) + maxScoreForRow.push(sum); + tdlengths.push(td.innerText.length); + } + let mathMax = Math.max(...maxScoreForRow); + let index = maxScoreForRow.indexOf(mathMax); + if (!isNaN(mathMax / tdlengths[index])) { + columnData.push(`${mathMax / tdlengths[index]}#${i}`); + columnIndexAndTableRow[`${mathMax / tdlengths[index]}#${i}`] = + cellsOrRows(e.target.table, tr); + } else { + columnData.push(`0#${i}`); + columnIndexAndTableRow[`0#${i}`] = cellsOrRows(e.target.table, tr); + } + } + console.log(columnData); + + columnData.sort().reverse(); + + console.log("reversed", columnData); + + for (let [i, tr] of e.target.tableRows[0].entries()) { + if (e.target.table.hasClass.cellsSort) { + tr.innerHTML = columnIndexAndTableRow[columnData[i]]; + } else { + console.log("i", columnIndexAndTableRow[columnData[i]]); + const template = document.createElement("template"); + template.outerHTML = columnIndexAndTableRow[columnData[i]]; + tr = template.content; + // tr.outerHTML = columnIndexAndTableRow[columnData[i]]; } - console.log(maxScoreForRow) - let mathMax = Math.max(...maxScoreForRow) - let index = maxScoreForRow.indexOf(mathMax) - columnData.push(Math.max(...maxScoreForRow)/tdlengths[index]); } - console.log("col", columnData); } function sortFileSize(table, column, columnIndex) { From 13ff94f0c24ef6c5ac28ba7019c44d80283daee6 Mon Sep 17 00:00:00 2001 From: LeeWannacott Date: Thu, 1 Jun 2023 22:43:26 +1200 Subject: [PATCH 5/6] wip 5. --- public/table-sort.js | 66 ++++++++++++++++++++++++-------------------- 1 file changed, 36 insertions(+), 30 deletions(-) diff --git a/public/table-sort.js b/public/table-sort.js index 86b5369..fa0c98c 100644 --- a/public/table-sort.js +++ b/public/table-sort.js @@ -132,14 +132,19 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) { rememberSort: sortableTable.classList.contains("remember-sort"), }; + let div = document.createElement("div"); let input = document.createElement("input"); - input.style.backgroundColor = "red"; + let label = document.createElement("label"); + div.style.display ="flex" + label.innerHTML = "Search:" input.setAttribute("type", "text"); - input.setAttribute("id", "fuzzy"); + input.setAttribute("id", "fuzzy-search"); input.tableRows = table.rows; input.table = table; input.addEventListener("input", sortFuzzySearch); - sortableTable.insertBefore(input, sortableTable.firstChild); + div.appendChild(label) + div.appendChild(input) + sortableTable.insertBefore(div, sortableTable.firstChild); for ( let headerIndex = 0; @@ -185,50 +190,51 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) { } function sortFuzzySearch(e) { - console.log(Array.from(e.target.value)); - let columnData = []; - for (let [i, tr] of e.target.tableRows[0].entries()) { - let maxScoreForRow = []; - let tds = tr.querySelectorAll("td"); - let tdlengths = []; + for (let bodyIndex = 0; bodyIndex< e.target.tableRows.length;bodyIndex++){ + const columnToBeSorted = []; + for (let [i, tr] of e.target.tableRows[bodyIndex].entries()) { + const maxSimiliarityForRow = []; + const tds = tr.querySelectorAll("td"); + const tdLengths = []; for (let td of tds) { - let sum = 0; - for (let char of Array.from(e.target.value)) { - if (td.innerText.includes(char)) { - sum += 1; + let amountOfCharsInTd = 0; + for (let character of Array.from(e.target.value)) { + if (td.innerText.includes(character)) { + amountOfCharsInTd += 1; } } - maxScoreForRow.push(sum); - tdlengths.push(td.innerText.length); + maxSimiliarityForRow.push(amountOfCharsInTd); + tdLengths.push(td.innerText.length); } - let mathMax = Math.max(...maxScoreForRow); - let index = maxScoreForRow.indexOf(mathMax); - if (!isNaN(mathMax / tdlengths[index])) { - columnData.push(`${mathMax / tdlengths[index]}#${i}`); - columnIndexAndTableRow[`${mathMax / tdlengths[index]}#${i}`] = + let maxSimiliarityInRow = Math.max(...maxSimiliarityForRow); + let index = maxSimiliarityForRow.indexOf(maxSimiliarityInRow); + if (!isNaN(maxSimiliarityInRow / tdLengths[index])) { + columnToBeSorted.push(`${maxSimiliarityInRow / tdLengths[index]}#${i}`); + columnIndexAndTableRow[`${maxSimiliarityInRow / tdLengths[index]}#${i}`] = cellsOrRows(e.target.table, tr); } else { - columnData.push(`0#${i}`); - columnIndexAndTableRow[`0#${i}`] = cellsOrRows(e.target.table, tr); + columnToBeSorted.push(`0#${i}`); + columnIndexAndTableRow[`0#${i}`] = tr.innerHTML } } - console.log(columnData); + console.log(columnToBeSorted); - columnData.sort().reverse(); + columnToBeSorted.sort().reverse(); - console.log("reversed", columnData); + console.log("reversed", columnToBeSorted); - for (let [i, tr] of e.target.tableRows[0].entries()) { + for (let [i, tr] of e.target.tableRows[bodyIndex].entries()) { if (e.target.table.hasClass.cellsSort) { - tr.innerHTML = columnIndexAndTableRow[columnData[i]]; + tr.innerHTML = columnIndexAndTableRow[columnToBeSorted[i]]; } else { - console.log("i", columnIndexAndTableRow[columnData[i]]); + console.log("i", columnIndexAndTableRow[columnToBeSorted[i]]); const template = document.createElement("template"); - template.outerHTML = columnIndexAndTableRow[columnData[i]]; - tr = template.content; + template.outerHTML = columnIndexAndTableRow[columnToBeSorted[i]]; + tr = template.content.firstChild; // tr.outerHTML = columnIndexAndTableRow[columnData[i]]; } } + } } function sortFileSize(table, column, columnIndex) { From 8d6b13c1eada3783fb1f893bbf634a32edcf3c80 Mon Sep 17 00:00:00 2001 From: LeeWannacott Date: Thu, 1 Jun 2023 23:27:20 +1200 Subject: [PATCH 6/6] wip 6. --- public/table-sort.js | 91 ++++++++++++++++++++------------------------ 1 file changed, 41 insertions(+), 50 deletions(-) diff --git a/public/table-sort.js b/public/table-sort.js index fa0c98c..338f6ba 100644 --- a/public/table-sort.js +++ b/public/table-sort.js @@ -135,15 +135,15 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) { let div = document.createElement("div"); let input = document.createElement("input"); let label = document.createElement("label"); - div.style.display ="flex" - label.innerHTML = "Search:" + div.style.display = "flex"; + label.innerHTML = "Search:"; input.setAttribute("type", "text"); input.setAttribute("id", "fuzzy-search"); input.tableRows = table.rows; input.table = table; input.addEventListener("input", sortFuzzySearch); - div.appendChild(label) - div.appendChild(input) + div.appendChild(label); + div.appendChild(input); sortableTable.insertBefore(div, sortableTable.firstChild); for ( @@ -190,51 +190,50 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) { } function sortFuzzySearch(e) { - for (let bodyIndex = 0; bodyIndex< e.target.tableRows.length;bodyIndex++){ + for ( + let bodyIndex = 0; + bodyIndex < e.target.tableRows.length; + bodyIndex++ + ) { const columnToBeSorted = []; - for (let [i, tr] of e.target.tableRows[bodyIndex].entries()) { - const maxSimiliarityForRow = []; - const tds = tr.querySelectorAll("td"); - const tdLengths = []; - for (let td of tds) { - let amountOfCharsInTd = 0; - for (let character of Array.from(e.target.value)) { - if (td.innerText.includes(character)) { - amountOfCharsInTd += 1; + for (let [i, tr] of e.target.tableRows[bodyIndex].entries()) { + const charMatchesInRow = []; + const tds = tr.querySelectorAll("td"); + const tdLengths = []; + for (let td of tds) { + let amountOfCharsInTd = 0; + for (let character of Array.from(e.target.value)) { + if (td.innerText.includes(character)) { + amountOfCharsInTd += 1; + } } + charMatchesInRow.push(amountOfCharsInTd); + tdLengths.push(td.innerText.length); } - maxSimiliarityForRow.push(amountOfCharsInTd); - tdLengths.push(td.innerText.length); - } - let maxSimiliarityInRow = Math.max(...maxSimiliarityForRow); - let index = maxSimiliarityForRow.indexOf(maxSimiliarityInRow); - if (!isNaN(maxSimiliarityInRow / tdLengths[index])) { - columnToBeSorted.push(`${maxSimiliarityInRow / tdLengths[index]}#${i}`); - columnIndexAndTableRow[`${maxSimiliarityInRow / tdLengths[index]}#${i}`] = - cellsOrRows(e.target.table, tr); - } else { - columnToBeSorted.push(`0#${i}`); - columnIndexAndTableRow[`0#${i}`] = tr.innerHTML - } - } - console.log(columnToBeSorted); + let tdWithMaxCharMatch = Math.max(...charMatchesInRow); + let index = charMatchesInRow.indexOf(tdWithMaxCharMatch); + if (!isNaN(tdWithMaxCharMatch / tdLengths[index])) { + columnToBeSorted.push( + `${tdWithMaxCharMatch / tdLengths[index]}#${i}` + ); + columnIndexAndTableRow[ + `${tdWithMaxCharMatch / tdLengths[index]}#${i}` + ] = cellsOrRows(e.target.table, tr); + } else { + columnToBeSorted.push(`0#${i}`); + columnIndexAndTableRow[`0#${i}`] = cellsOrRows(e.target.table, tr); + } + } columnToBeSorted.sort().reverse(); - - console.log("reversed", columnToBeSorted); - - for (let [i, tr] of e.target.tableRows[bodyIndex].entries()) { - if (e.target.table.hasClass.cellsSort) { - tr.innerHTML = columnIndexAndTableRow[columnToBeSorted[i]]; - } else { - console.log("i", columnIndexAndTableRow[columnToBeSorted[i]]); - const template = document.createElement("template"); - template.outerHTML = columnIndexAndTableRow[columnToBeSorted[i]]; - tr = template.content.firstChild; - // tr.outerHTML = columnIndexAndTableRow[columnData[i]]; + for (let [i, tr] of e.target.tableRows[bodyIndex].entries()) { + if (e.target.table.hasClass.cellsSort) { + tr.innerHTML = columnIndexAndTableRow[columnToBeSorted[i]]; + } else { + tr.outerHTML = columnIndexAndTableRow[columnToBeSorted[i]]; + } } } - } } function sortFileSize(table, column, columnIndex) { @@ -264,7 +263,6 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) { } function sortDates(datesFormat, table, column) { - try { for (let [i, tr] of table.visibleRows.entries()) { let columnOfTd, datesRegex; if (datesFormat === "mdy" || datesFormat === "dmy") { @@ -300,13 +298,9 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) { column.toBeSorted.push(`${numberToSort}#${i}`); columnIndexAndTableRow[column.toBeSorted[i]] = cellsOrRows(table, tr); } - } catch (e) { - console.log(e); - } } function sortByRuntime(table, column) { - try { for (let [i, tr] of table.visibleRows.entries()) { const regexMinutesAndSeconds = /^(\d+h)?\s?(\d+m)?\s?(\d+s)?$/i; let columnOfTd = ""; @@ -336,9 +330,6 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) { column.toBeSorted.push(`${timeinSeconds}#${i}`); columnIndexAndTableRow[column.toBeSorted[i]] = cellsOrRows(table, tr); } - } catch (e) { - console.log(e); - } } function getTableData(tableProperties, timesClickedColumn) {