fradrive/templates/table/colonnade.julius
2018-04-09 22:22:38 +02:00

79 lines
2.3 KiB
Plaintext

(function collonadeClosure() {
'use strict';
document.addEventListener('DOMContentLoaded', function DOMContentLoaded() {
var ASC = 'asc';
var DESC = 'desc';
var table = document.querySelector('table');
var ths = Array.from(table.querySelectorAll('th'));
// attach click handler to each table-header
ths.map(function(th) {
th.addEventListener('click', clickHandler);
});
// handles click on table header
function clickHandler(event) {
event.preventDefault();
// should instead be smthg like: JSON.parse(this.dataset.sortparams);
// hardcoded for now
var sortParams = {sorting: 'name', prefix: 'terms'};
if (sortParams.order) {
sortParams.order = sortParams.order === ASC ? DESC : ASC;
} else {
sortParams.order = ASC;
}
var params = makeParams(sortParams.prefix, sortParams);
var url = new URL(window.location);
for (var p in params) {
url.searchParams.set(p, params[p]);
}
fetchTableFrom(url);
markSorted(this, sortParams.order);
}
function markSorted(th, order) {
ths.forEach(function(th) {
th.classList.remove('sorted-asc', 'sorted-desc');
});
th.classList.add('sorted-' + order);
}
// fetches new sorted table from url with params and replaces contents of current table
function fetchTableFrom(url) {
fetch(url, {
credentials: 'same-origin'
}).then(function(response) {
if (!response.ok) {
throw ('Looks like there was a problem fetching ' + url.toString() + '. Status Code: ' + response.status);
}
// Examine the text in the response
response.text().then(function(data) {
// replace contents of table body
table.querySelector('tbody').innerHTML = data;
});
}).catch(function(err) {
console.error(err);
});
}
// returns default sort-params for with specific prefix
function makeParams(prefix, custom) {
var defaultParams = Object.assign({
pagesize: 20,
page: 0,
order: ASC
}, custom);
var res = {};
for (var p in defaultParams) {
res[prefix + '-' + p] = defaultParams[p];
}
res['table-only'] = 'true';
return res;
}
});
})();