Skip to content

Commit 4e0e104

Browse files
kyle-wannacottkyle-wannacott
committed
NPM version 1.15.2; Fix colspans on non default sorts like data-sort.
1 parent e1ac549 commit 4e0e104

File tree

9 files changed

+276
-249
lines changed

9 files changed

+276
-249
lines changed

‎browser-extensions/chrome/manifest.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"manifest_version": 3,
33
"author": "Lee Wannacott",
44
"name": "table-sort-js",
5-
"version": "1.15.1",
5+
"version": "1.15.2",
66
"description": "Makes tables sortable using table-sort-js: https://github.com/LeeWannacott/table-sort-js",
77
"icons": { "48": "icons/t.png" },
88
"browser_action": {

‎browser-extensions/chrome/table-sort-js.zip

60 Bytes
Binary file not shown.

‎browser-extensions/chrome/table-sort.js

+63-56
Original file line numberDiff line numberDiff line change
@@ -136,16 +136,16 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) {
136136
th.insertAdjacentText("beforeend", arrowUp);
137137
}
138138

139-
function sortDataAttributes(tableRows, columnData) {
139+
function sortDataAttributes(tableRows, column) {
140140
for (let [i, tr] of tableRows.entries()) {
141-
const dataAttributeTd = tr.querySelectorAll("td").item(columnIndex)
142-
.dataset.sort;
143-
columnData.push(`${dataAttributeTd}#${i}`);
144-
columnIndexAndTableRow[columnData[i]] = tr.outerHTML;
141+
let dataAttributeTd = getColumn(tr, column.spanSum, column.span).dataset
142+
.sort;
143+
column.toBeSorted.push(`${dataAttributeTd}#${i}`);
144+
columnIndexAndTableRow[column.toBeSorted[i]] = tr.outerHTML;
145145
}
146146
}
147147

148-
function sortFileSize(tableRows, columnData) {
148+
function sortFileSize(tableRows, column) {
149149
let unitToMultiplier = {
150150
b: 1,
151151
kb: 1000,
@@ -167,25 +167,23 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) {
167167
let number = parseFloat(match[1]);
168168
let unit = match[2].toLowerCase();
169169
let multiplier = unitToMultiplier[unit];
170-
columnData.push(`${number * multiplier}#${i}`);
170+
column.toBeSorted.push(`${number * multiplier}#${i}`);
171171
} else {
172-
columnData.push(`${fillValue}#${i}`);
172+
column.toBeSorted.push(`${fillValue}#${i}`);
173173
}
174174
}
175175
}
176176

177-
function sortByRuntime(tableRows, columnData) {
177+
function sortByRuntime(tableRows, column) {
178178
try {
179179
for (let [i, tr] of tableRows.entries()) {
180180
const regexMinutesAndSeconds = /^(\d+h)?\s?(\d+m)?\s?(\d+s)?$/i;
181181
let columnOfTd = "";
182182
// TODO: github actions runtime didn't like textContent, tests didn't like innerText?
183183
if (testingTableSortJS) {
184-
columnOfTd = tr
185-
.querySelectorAll("td")
186-
.item(columnIndex).textContent;
184+
columnOfTd = getColumn(tr, column.spanSum, column.span).textContent;
187185
} else {
188-
columnOfTd = tr.querySelectorAll("td").item(columnIndex).innerText;
186+
columnOfTd = getColumn(tr, column.spanSum, column.span).innerText;
189187
}
190188
let match = columnOfTd.match(regexMinutesAndSeconds);
191189
let [minutesInSeconds, hours, seconds] = [0, 0, 0];
@@ -205,15 +203,15 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) {
205203
}
206204
timeinSeconds = hours + minutesInSeconds + seconds;
207205
}
208-
columnData.push(`${timeinSeconds}#${i}`);
209-
columnIndexAndTableRow[columnData[i]] = tr.outerHTML;
206+
column.toBeSorted.push(`${timeinSeconds}#${i}`);
207+
columnIndexAndTableRow[column.toBeSorted[i]] = tr.outerHTML;
210208
}
211209
} catch (e) {
212210
console.log(e);
213211
}
214212
}
215213

216-
function sortDates(datesFormat, tableRows, columnData) {
214+
function sortDates(datesFormat, tableRows, column) {
217215
try {
218216
for (let [i, tr] of tableRows.entries()) {
219217
let columnOfTd, datesRegex;
@@ -222,7 +220,7 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) {
222220
} else if (datesFormat === "ymd") {
223221
datesRegex = /^(\d\d\d\d)[./-](\d\d?)[./-](\d\d?)/;
224222
}
225-
columnOfTd = tr.querySelectorAll("td").item(columnIndex).textContent;
223+
columnOfTd = getColumn(tr, column.spanSum, column.span).textContent;
226224
let match = columnOfTd.match(datesRegex);
227225
let [years, days, months] = [0, 0, 0];
228226
let numberToSort = columnOfTd;
@@ -243,8 +241,8 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) {
243241
String(days).padStart(2, "0")
244242
);
245243
}
246-
columnData.push(`${numberToSort}#${i}`);
247-
columnIndexAndTableRow[columnData[i]] = tr.outerHTML;
244+
column.toBeSorted.push(`${numberToSort}#${i}`);
245+
columnIndexAndTableRow[column.toBeSorted[i]] = tr.outerHTML;
248246
}
249247
} catch (e) {
250248
console.log(e);
@@ -268,41 +266,47 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) {
268266
}
269267
}
270268

271-
function getColSpanData(sortableTable, colSpanData, colSpanSum) {
269+
function getColSpanData(sortableTable, column) {
272270
sortableTable.querySelectorAll("th").forEach((th, index) => {
273-
colSpanData[index] = th.colSpan;
274-
if (index === 0) colSpanSum[index] = th.colSpan;
275-
else colSpanSum[index] = colSpanSum[index - 1] + th.colSpan;
271+
column.span[index] = th.colSpan;
272+
if (index === 0) column.spanSum[index] = th.colSpan;
273+
else column.spanSum[index] = column.spanSum[index - 1] + th.colSpan;
276274
});
277275
}
278276

277+
function getColumn(tr, colSpanSum, colSpanData) {
278+
return tr
279+
.querySelectorAll("td")
280+
.item(
281+
colSpanData[columnIndex] === 1
282+
? colSpanSum[columnIndex] - 1
283+
: colSpanSum[columnIndex] - colSpanData[columnIndex]
284+
);
285+
}
286+
279287
function getTableData(tableProperties) {
280288
const {
281289
tableRows,
282-
columnData,
290+
column,
283291
isFileSize,
284292
isTimeSort,
285293
isSortDateDayMonthYear,
286294
isSortDateMonthDayYear,
287295
isSortDateYearMonthDay,
288296
isDataAttribute,
289-
colSpanData,
290-
colSpanSum,
291297
} = tableProperties;
292298
for (let [i, tr] of tableRows.entries()) {
293-
let tdTextContent = tr
294-
.querySelectorAll("td")
295-
.item(
296-
colSpanData[columnIndex] === 1
297-
? colSpanSum[columnIndex] - 1
298-
: colSpanSum[columnIndex] - colSpanData[columnIndex]
299-
).textContent;
299+
let tdTextContent = getColumn(
300+
tr,
301+
column.spanSum,
302+
column.span
303+
).textContent;
300304
if (tdTextContent.length === 0) {
301305
tdTextContent = "";
302306
}
303307
if (tdTextContent.trim() !== "") {
304308
if (isFileSize) {
305-
fileSizeColumnTextAndRow[columnData[i]] = tr.outerHTML;
309+
fileSizeColumnTextAndRow[column.toBeSorted[i]] = tr.outerHTML;
306310
}
307311
// These classes already handle pushing to column and setting the tr html.
308312
if (
@@ -313,12 +317,12 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) {
313317
!isSortDateYearMonthDay &&
314318
!isSortDateMonthDayYear
315319
) {
316-
columnData.push(`${tdTextContent}#${i}`);
320+
column.toBeSorted.push(`${tdTextContent}#${i}`);
317321
columnIndexAndTableRow[`${tdTextContent}#${i}`] = tr.outerHTML;
318322
}
319323
} else {
320324
// Fill in blank table cells dict key with filler value.
321-
columnData.push(`${fillValue}#${i}`);
325+
column.toBeSorted.push(`${fillValue}#${i}`);
322326
columnIndexAndTableRow[`${fillValue}#${i}`] = tr.outerHTML;
323327
}
324328
}
@@ -348,7 +352,7 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) {
348352
th.innerHTML = th.innerHTML.replace(arrowDown, "");
349353
}
350354

351-
if (columnData[0] === undefined) {
355+
if (column.toBeSorted[0] === undefined) {
352356
return;
353357
}
354358

@@ -360,7 +364,7 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) {
360364
}
361365

362366
function sortColumn(sortDirection) {
363-
columnData.sort(sortDirection, {
367+
column.toBeSorted.sort(sortDirection, {
364368
numeric: !isAlphaSort,
365369
ignorePunctuation: !isPunctSort,
366370
});
@@ -387,19 +391,19 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) {
387391
}
388392

389393
function updateTable(tableProperties) {
390-
const { tableRows, columnData, isFileSize } = tableProperties;
394+
const { tableRows, column, isFileSize } = tableProperties;
391395
for (let [i, tr] of tableRows.entries()) {
392396
if (isFileSize) {
393-
tr.innerHTML = fileSizeColumnTextAndRow[columnData[i]];
397+
tr.innerHTML = fileSizeColumnTextAndRow[column.toBeSorted[i]];
394398
let fileSizeInBytesHTML = tr
395399
.querySelectorAll("td")
396400
.item(columnIndex).innerHTML;
397401
const fileSizeInBytesText = tr
398402
.querySelectorAll("td")
399403
.item(columnIndex).textContent;
400404
// Remove the unique identifyer for duplicate values(#number).
401-
columnData[i] = columnData[i].replace(/#[0-9]*/, "");
402-
const fileSize = parseFloat(columnData[i]);
405+
column.toBeSorted[i] = column.toBeSorted[i].replace(/#[0-9]*/, "");
406+
const fileSize = parseFloat(column.toBeSorted[i]);
403407
let prefixes = ["", "Ki", "Mi", "Gi", "Ti", "Pi"];
404408
let replaced = false;
405409
for (let i = 0; i < prefixes.length; ++i) {
@@ -423,13 +427,19 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) {
423427
tr.querySelectorAll("td").item(columnIndex).innerHTML =
424428
fileSizeInBytesHTML;
425429
} else if (!isFileSize) {
426-
tr.outerHTML = columnIndexAndTableRow[columnData[i]];
430+
tr.outerHTML = columnIndexAndTableRow[column.toBeSorted[i]];
427431
}
428432
}
429433
}
430434

431435
th.addEventListener("click", function () {
432-
const [columnData, colSpanData, colSpanSum] = [[], {}, {}];
436+
timesClickedColumn += 1;
437+
const column = {
438+
// column used for sorting; better name?
439+
toBeSorted: [],
440+
span: {},
441+
spanSum: {},
442+
};
433443

434444
const visibleTableRows = Array.prototype.filter.call(
435445
tableBody.querySelectorAll("tr"),
@@ -438,52 +448,49 @@ function tableSortJs(testingTableSortJS = false, domDocumentWindow = document) {
438448
}
439449
);
440450

451+
getColSpanData(sortableTable, column);
452+
441453
const isDataAttribute = th.classList.contains("data-sort");
442454
if (isDataAttribute) {
443-
sortDataAttributes(visibleTableRows, columnData);
455+
sortDataAttributes(visibleTableRows, column);
444456
}
445457

446458
const isFileSize = th.classList.contains("file-size-sort");
447459
if (isFileSize) {
448-
sortFileSize(visibleTableRows, columnData);
460+
sortFileSize(visibleTableRows, column);
449461
}
450462

451463
const isTimeSort = th.classList.contains("runtime-sort");
452464
if (isTimeSort) {
453-
sortByRuntime(visibleTableRows, columnData);
465+
sortByRuntime(visibleTableRows, column);
454466
}
455467

456468
const isSortDateDayMonthYear = th.classList.contains("dates-dmy-sort");
457469
const isSortDateMonthDayYear = th.classList.contains("dates-mdy-sort");
458470
const isSortDateYearMonthDay = th.classList.contains("dates-ymd-sort");
459471
// pick mdy first to override the inferred default class which is dmy.
460472
if (isSortDateMonthDayYear) {
461-
sortDates("mdy", visibleTableRows, columnData);
473+
sortDates("mdy", visibleTableRows, column);
462474
} else if (isSortDateYearMonthDay) {
463-
sortDates("ymd", visibleTableRows, columnData);
475+
sortDates("ymd", visibleTableRows, column);
464476
} else if (isSortDateDayMonthYear) {
465-
sortDates("dmy", visibleTableRows, columnData);
477+
sortDates("dmy", visibleTableRows, column);
466478
}
467479

468480
const isRememberSort = sortableTable.classList.contains("remember-sort");
469481
if (!isRememberSort) {
470482
rememberSort(timesClickedColumn, columnIndexesClicked);
471483
}
472484

473-
timesClickedColumn += 1;
474-
475-
getColSpanData(sortableTable, colSpanData, colSpanSum);
476485
const tableProperties = {
477486
tableRows: visibleTableRows,
478-
columnData,
487+
column,
479488
isFileSize,
480489
isSortDateDayMonthYear,
481490
isSortDateMonthDayYear,
482491
isSortDateYearMonthDay,
483492
isDataAttribute,
484493
isTimeSort,
485-
colSpanData,
486-
colSpanSum,
487494
};
488495
getTableData(tableProperties);
489496
updateTable(tableProperties);

‎browser-extensions/firefox/manifest.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"manifest_version": 2,
33
"author": "Lee Wannacott",
44
"name": "table-sort-js",
5-
"version": "1.15.1",
5+
"version": "1.15.2",
66
"description": "Makes tables sortable using table-sort-js: https://github.com/LeeWannacott/table-sort-js",
77
"icons": { "48": "icons/t.png" },
88
"browser_action": {

‎browser-extensions/firefox/table-sort-js.zip

60 Bytes
Binary file not shown.

0 commit comments

Comments
 (0)