diff --git a/archivist/apps/templates/importer/source_urls.html b/archivist/apps/templates/importer/source_urls.html index ba0af69..7d3ddb2 100644 --- a/archivist/apps/templates/importer/source_urls.html +++ b/archivist/apps/templates/importer/source_urls.html @@ -120,6 +120,76 @@ } } } + + window.onload = function() { + document.querySelectorAll('th').forEach((element) => { // Table headers + element.addEventListener('click', function() { + let table = this.closest('table'); + + // If the column is sortable + if (this.querySelector('span')) { + let order_icon = this.querySelector('span'); + let order = encodeURI(order_icon.innerHTML).includes('%E2%86%91') ? 'desc' : 'asc'; + let separator = '-----'; // Separate the value of it's index, so data keeps intact + + let value_list = {}; // Object + let obj_key = []; // Values of selected column + + let string_count = 0; + let number_count = 0; + + // rows + table.querySelectorAll('tbody tr').forEach((line, index_line) => { + // Value of each field + let key = line.children[element.cellIndex].textContent.toUpperCase(); + + // Check if value is date, numeric or string + if (line.children[element.cellIndex].hasAttribute('data-timestamp')) { + // if value is date, we store it's timestamp, so we can sort like a number + key = line.children[element.cellIndex].getAttribute('data-timestamp'); + } + else if (key.replace('-', '').match(/^[0-9,.]*$/g)) { + number_count++; + } + else { + string_count++; + } + + value_list[key + separator + index_line] = line.outerHTML.replace(/(\t)|(\n)/g, ''); // Adding to object + obj_key.push(key + separator + index_line); + }); + if (string_count === 0) { // If all values are numeric + console.log(obj_key); + obj_key.sort(function(a, b) { + return a.split(separator)[0] - b.split(separator)[0]; + }); + console.log(obj_key); + } + else { + console.log(obj_key); + obj_key.sort(); + console.log(obj_key); + } + + if (order === 'desc') { + console.log(obj_key); + obj_key.reverse(); + console.log(obj_key); + order_icon.innerHTML = '↓'; + } + else { + order_icon.innerHTML = '↑'; + } + + let html = ''; + obj_key.forEach(function(chave) { + html += value_list[chave]; + }); + table.getElementsByTagName('tbody')[0].innerHTML = html; + } + }); + }); + } {% endblock content %}