Widget: DCTList: Difference between revisions
From LINKS Community Center
Eschmidt (talk | contribs) No edit summary |
Eschmidt (talk | contribs) No edit summary |
||
Line 44: | Line 44: | ||
*/ | */ | ||
/* | /** @param {string} title */ | ||
function getUrl(title) { | function getUrl(title) { | ||
return title ? '/index.php/Special:FilePath/' + title : title; | return title ? '/index.php/Special:FilePath/' + title : title; | ||
} | |||
/** @param {string} text */ | |||
function escapeAttr(text) { | |||
return text ? text.replace(/\s/g, '-') : text; | |||
} | } | ||
Line 90: | Line 92: | ||
const dataSources = data[0]; | const dataSources = data[0]; | ||
const dcts = data[1]; | const dcts = data[1]; | ||
console.log(data) | |||
const filterHtml = dataSources.reduce((prev, curr) => { | const filterHtml = dataSources.reduce((prev, curr) => { | ||
return prev + '<div><input type="checkbox" id="filter-' + | const identifier = escapeAttr(curr.name); | ||
'<label for="filter-' + | return prev + | ||
'<div><input type="checkbox" id="filter-' + identifier + '" value="' + curr.name + '" checked>' + | |||
'<label for="filter-' + identifier + '"><img src="' + curr.image + '"> ' + curr.name + '</label></div>' | |||
}, ''); | }, ''); | ||
document.getElementById('data-source-filter').innerHTML = filterHtml; | document.getElementById('data-source-filter').innerHTML = filterHtml; | ||
const table = new Tabulator("#dct-tabulator", { | const table = new Tabulator("#dct-tabulator", { | ||
Line 128: | Line 132: | ||
table.on("tableBuilt", () => { table.setData(dcts); }); | table.on("tableBuilt", () => { table.setData(dcts); }); | ||
}) | }) | ||
</script> | </script> | ||
<div id="dct-list-wrapper"> | <div id="dct-list-wrapper"> | ||
<h1>Social Media and Crowdsourcing Technologies</h1> | <h1>Social Media and Crowdsourcing Technologies</h1> |
Revision as of 10:41, 8 June 2022
Development verstion of the DCT List.
Not ready for production!