websites/Gitlab-Issue-Listing-Script#48: Timeline should iterate through DatePeriod backwards rather than forwards

This is a little bit of a fiddly one.

Currently, we iterate over the date range using DatePeriod, but it doesn't support iterating backwards. You can set DateInterval to be negative:

$dt = new DateInterval('P1M');
$dt->invert = 1;

But that doesn't help much - dateperiod still won't iterate backwards. If start < end then it'll iterate forwards and if start > end it'll return an empty set.

One option would be to iterate through forwards, pushing each object into an array (which we can then reverse), but that's not exactly efficient.

Instead, we need to implement the logic ourselves - the DateTime class supports sub(), so we can take a date and then subtract a period from it.

So, the template can be adjusted to do

$begin = new DateTime($issues['start']);
$end = new DateTime($issues['end']);
$dateinterval = new DateInterval('P1M');

while($end >= $begin){
    // Do stuff

    // Subtract a month
    $date = $date->sub($dateinterval);
}

In order to work through in reverse

It's not just the programmatic logic which will need to change - we also need to change the order of things within divs.

Currently we do

Month name   | 
             |   issues
             |

The issues occur within the month, and the month flows in the same direction the user is reading in.

With time reversed though, that's not the case - the issues in a month should be above the month name

Adjusting the order of items should just be CSS tweaks - we're not moving stuff between cells, we just want the date stuck to the bottom of the cell rather than the top.

The issues list will need bottom padding instead of top.

Also need to check that it doesn't screw the mobile view, but we can adjust for that once the main view is correct.

I've done some tweaks, but actually, I think it's a bit misleading

It looks like that issue is listed under May.

So actually, it might be better to keep the order of cell content as it was.

Whilst time technically flows up the page, it's human nature to read a header and assume the content falls under it.

Definitely fits reading habits better

But perhaps we should add a day to the date, that way "Apr 2022" indicates it's the end of April

For future reference, in order to have PHP's DateTime print the last day of the month, you just need to use t in the format string.

A google suggests you need to use date->modify() with a string of "last day of [month]" but that's a false trail (and because it updates in place, breaks iteration).

It really is as simple as

$date->format("t M Y")

It's now immediately obvious what goes where:

The mobile view still works as it should, it collapses down and each month is titled and followed by a list of the relevant issues.