fradrive/templates/table/layout.julius
2018-04-14 22:39:29 +02:00

71 lines
2.3 KiB
Plaintext

(function collonadeClosure() {
'use strict';
document.addEventListener('DOMContentLoaded', function DOMContentLoaded() {
var ASC = 'asc';
var DESC = 'desc';
function setupAsync(wrapper) {
var table = wrapper.querySelector('#' + #{String $ dbtIdent});
var ths = Array.from(table.querySelectorAll('th.sortable'));
if (ths) {
// attach click handler to each sortable column if any
ths.forEach(function(th) {
th.addEventListener('click', clickHandler);
});
}
var pagination = wrapper.querySelector('#' + #{String $ dbtIdent} + '-pagination');
if (pagination) {
var paginationLinks = Array.from(pagination.querySelectorAll('.pagination-link'));
// attach click handler to pagination links if any
paginationLinks.forEach(function(p) {
p.addEventListener('click', clickHandler);
});
}
function clickHandler(event) {
event.preventDefault();
var url = new URL(window.location.origin + window.location.pathname + getClickDestination(this));
url.searchParams.set(#{String $ wIdent "table-only"}, 'yes');
updateTableFrom(url);
}
function getClickDestination(el) {
var link = el.querySelector('a');
if (!link) { return false; }
return link.getAttribute('href');
}
// fetches new sorted table from url with params and replaces contents of current table
function updateTableFrom(url) {
fetch(url, {
credentials: 'same-origin',
headers: {
'Accept': 'text/html'
}
}).then(function(response) {
var contentType = response.headers.get("content-type");
if (!response.ok) {
throw ('Looks like there was a problem fetching ' + url.toString() + '. Status Code: ' + response.status);
}
return response.text();
}).then(function(data) {
// replace contents of table body
wrapper.innerHTML = data;
// set up async functionality again
setupAsync(wrapper);
table.querySelector('tbody').innerHTML = data;
}).catch(function(err) {
console.error(err);
});
}
}
var selector = '#' + #{String $ dbtIdent} + '-table-wrapper';
setupAsync(document.querySelector(selector));
});
})();