diff --git a/dist/src/options.js b/dist/src/options.js index 82e618d..df785b6 100644 --- a/dist/src/options.js +++ b/dist/src/options.js @@ -11,6 +11,45 @@ document.addEventListener('DOMContentLoaded', function renderFilterListTable() { function setupOptionsListener() { document.getElementById('save').addEventListener('click', saveCurrentOptions); } +// taken from https://www.w3schools.com/howto/howto_js_sort_table.asp +function sortTable() { + var table, rows, switching, i, x, y, shouldSwitch, dir, switchcount = 0; + table = document.getElementById("intentList"); + switching = true; + dir = "asc"; + while (switching) { + switching = false; + rows = table.rows; + for (i = 1; i < (rows.length - 1); i++) { + shouldSwitch = false; + x = rows[i].getElementsByTagName("td")[0].childNodes[0]; + y = rows[i + 1].getElementsByTagName("td")[0].childNodes[0]; + if (dir == "asc") { + if (x.innerHTML.toLowerCase() > y.innerHTML.toLowerCase()) { + shouldSwitch = true; + break; + } + } + else if (dir == "desc") { + if (x.innerHTML.toLowerCase() < y.innerHTML.toLowerCase()) { + shouldSwitch = true; + break; + } + } + } + if (shouldSwitch) { + rows[i].parentNode.insertBefore(rows[i + 1], rows[i]); + switching = true; + switchcount++; + } + else { + if (switchcount == 0 && dir == "asc") { + dir = "desc"; + switching = true; + } + } + } +} function saveCurrentOptions() { // get all form values const whitelistTimeElement = document.getElementById('whitelistTime'); @@ -107,9 +146,9 @@ function drawIntentListTable() { // fetch intent list const intentList = storage.intentList; // generate table element - let table = '' + + let table = '
' + "" + - '' + + '' + '' + '' + ""; @@ -134,6 +173,8 @@ function drawIntentListTable() { if (previousIntents != null) { previousIntents.innerHTML = table; } + // setup table sort events + document.getElementById('urlHeader').addEventListener('click', sortTable); }); } ; diff --git a/src/options.ts b/src/options.ts index b5ebd53..623b4d9 100644 --- a/src/options.ts +++ b/src/options.ts @@ -13,7 +13,45 @@ document.addEventListener('DOMContentLoaded', function renderFilterListTable() { function setupOptionsListener(): void { document.getElementById('save').addEventListener('click', - saveCurrentOptions); + saveCurrentOptions); +} + +// taken from https://www.w3schools.com/howto/howto_js_sort_table.asp +function sortTable(): void { + var table, rows, switching, i, x, y, shouldSwitch, dir, switchcount = 0; + table = document.getElementById("intentList"); + switching = true; + dir = "asc"; + while (switching) { + switching = false; + rows = table.rows; + for (i = 1; i < (rows.length - 1); i++) { + shouldSwitch = false; + x = rows[i].getElementsByTagName("td")[0].childNodes[0]; + y = rows[i + 1].getElementsByTagName("td")[0].childNodes[0]; + if (dir == "asc") { + if (x.innerHTML.toLowerCase() > y.innerHTML.toLowerCase()) { + shouldSwitch = true; + break; + } + } else if (dir == "desc") { + if (x.innerHTML.toLowerCase() < y.innerHTML.toLowerCase()) { + shouldSwitch = true; + break; + } + } + } + if (shouldSwitch) { + rows[i].parentNode.insertBefore(rows[i + 1], rows[i]); + switching = true; + switchcount++; + } else { + if (switchcount == 0 && dir == "asc") { + dir = "desc"; + switching = true; + } + } + } } function saveCurrentOptions(): void { @@ -121,7 +159,6 @@ function drawFilterListTable(): void { }); }; - function drawIntentListTable(): void { // accessing chrome storage for intents chrome.storage.sync.get(null, (storage) => { @@ -129,12 +166,12 @@ function drawIntentListTable(): void { const intentList: {[key: string]: string} = storage.intentList; // generate table element - let table: string = '
urlurlintentdate
' + - "" + - '' + - '' + - '' + - ""; + let table: string = '
urlintentdate
' + + "" + + '' + + '' + + '' + + ""; let cur_id: number = 0; // iter dates in intentList @@ -161,6 +198,9 @@ function drawIntentListTable(): void { if (previousIntents != null) { previousIntents.innerHTML = table; } + + // setup table sort events + document.getElementById('urlHeader').addEventListener('click', sortTable) }); };
urlintentdate