Skip to content

Fix packages table #393

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Oct 18, 2025
Merged

Fix packages table #393

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
cb7c09e
Fix packages table
stertooy Sep 13, 2025
569f802
Cleanup + don't populate second table unnecessarily
stertooy Sep 14, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
119 changes: 65 additions & 54 deletions assets/js/loadPackageTable.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -119,62 +119,73 @@ function auto_search($dt){
}
}

// define a table
let table = new DataTable('#packageList', {
// get the json file
"ajax" : {
"url": "../assets/package-infos.json",
"dataSrc": function(dictData){
// as the json file is a dict for every package it is necessary it put all values into an array for Datatables to understand it
var arr = [];
for(var key in dictData){
arr.push(dictData[key]);
// delay until page load
$(function(){

// hide the no-javascript version of the table
$('#packageList-no-js').hide();

// show the javascript version of the table
$('#packageList').show();

// define a table
let table = new DataTable('#packageList', {
// get the json file
"ajax" : {
"url": "../assets/package-infos.json",
"dataSrc": function(dictData){
// as the json file is a dict for every package it is necessary it put all values into an array for Datatables to understand it
var arr = [];
for(var key in dictData){
arr.push(dictData[key]);
}
return arr;
}
return arr;
}
},
// define the columns shown in the table
columns : [
{
class: 'dt-control',
orderable: false,
data: null,
defaultContent: ''
},
{ "data" : "PackageName"},
{ "data" : "Version", width: '7em'},
{ "data" : "Date",
render: function (data, type, row) {
return convertDateFormat(data)
}
// define the columns shown in the table
columns : [
{
class: 'dt-control',
orderable: false,
data: null,
defaultContent: ''
},
{ "data" : "PackageName"},
{ "data" : "Version", width: '7em'},
{ "data" : "Date",
render: function (data, type, row) {
return convertDateFormat(data)
}
},
// the following column is set to invisible and only there so the search picks up the additional text as well
{ data: null, render: (data, type, row) => format(data), visible: false},
{ "data" : "Subtitle"},
],
// change the text for the search function to make it distinct to the page search function
language: {
search: 'Search table:'
},
// the following column is set to invisible and only there so the search picks up the additional text as well
{ data: null, render: (data, type, row) => format(data), visible: false},
{ "data" : "Subtitle"},
],
// change the text for the search function to make it distinct to the page search function
language: {
search: 'Search table:'
},
searchHighlight: true,
initComplete: function( settings, json ) {
auto_search(this);
},
// set default number of packages shown
pageLength: 25,
});

// Add event listener for opening and closing details
table.on('click', 'td.dt-control', function (e) {
let tr = e.target.closest('tr');
let row = table.row(tr);
searchHighlight: true,
initComplete: function( settings, json ) {
auto_search(this);
},
// set default number of packages shown
pageLength: 25,
});

// Add event listener for opening and closing details
table.on('click', 'td.dt-control', function (e) {
let tr = e.target.closest('tr');
let row = table.row(tr);

if (row.child.isShown()) {
// This row is already open - close it
row.child.hide();
}
else {
// Open this row
row.child(format(row.data())).show();
}
});

if (row.child.isShown()) {
// This row is already open - close it
row.child.hide();
}
else {
// Open this row
row.child(format(row.data())).show();
}
});
15 changes: 11 additions & 4 deletions packages/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,14 +18,21 @@ Note that newer versions might be available on the package websites.
<!-- Create a table so it can be filled by Datatables -->
{% assign pkgs = site.data.package-infos | sort %}

| | Name | Version | Date | Subtitle |
| Name | Version | Date | Subtitle |
|-
{% for namepkg in site.data.package-infos -%}{%- assign pkg = namepkg[1] -%}
| | [{{ pkg.PackageName }}]({{ pkg.PackageWWWHome }}) | {{ pkg.Version }} | {{ pkg.Date }} | {{ pkg.Subtitle }} |
| [{{ pkg.PackageName }}]({{ pkg.PackageWWWHome }}) | {{ pkg.Version }} | {{ pkg.Date }} | {{ pkg.Subtitle }} |
{% endfor -%}
|=
| | Name | Version | Date | Subtitle |
{: id="packageList" class="display"}
| Name | Version | Date | Subtitle |
{: id="packageList-no-js" class="display"}

| | Name | Version | Date | | Subtitle |
|-
| | | | | | |
|=
| | Name | Version | Date | | Subtitle |
{: id="packageList" class="display" style="display:none"}

The table above is generated using the open source software [Datatables](https://datatables.net/).
It requires JavaScript to enable all features and make all data available.