Some grid offset simplications thanks to setting correct 1-based date
This commit is contained in:
parent
4f506f0b7e
commit
652b96950b
|
@ -1,12 +1,14 @@
|
||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
|
// Be mindful to do all date operations in UTC (the archive is all in UTC date/times)
|
||||||
|
|
||||||
const { TemplateView } = require('hydrogen-view-sdk');
|
const { TemplateView } = require('hydrogen-view-sdk');
|
||||||
|
|
||||||
function sameDay(date1, date2) {
|
function sameDay(date1, date2) {
|
||||||
return (
|
return (
|
||||||
date1.getFullYear() === date2.getFullYear() &&
|
date1.getUTCFullYear() === date2.getUTCFullYear() &&
|
||||||
date1.getMonth() === date2.getMonth() &&
|
date1.getUTCMonth() === date2.getUTCMonth() &&
|
||||||
date1.getDate() === date2.getDate()
|
date1.getUTCDate() === date2.getUTCDate()
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -34,6 +36,7 @@ const DAYS_OF_WEEK = {
|
||||||
const today = new Date();
|
const today = new Date();
|
||||||
for (let i = 0; i < 7; i++) {
|
for (let i = 0; i < 7; i++) {
|
||||||
const lookupDate = new Date(today);
|
const lookupDate = new Date(today);
|
||||||
|
// Date is a 1-based number
|
||||||
lookupDate.setUTCDate(i + 1);
|
lookupDate.setUTCDate(i + 1);
|
||||||
|
|
||||||
const lookup = lookupDate.toLocaleString('en-US', { weekday: 'short', timeZone: 'UTC' });
|
const lookup = lookupDate.toLocaleString('en-US', { weekday: 'short', timeZone: 'UTC' });
|
||||||
|
@ -143,7 +146,8 @@ class CalendarView extends TemplateView {
|
||||||
let dayNodes = [];
|
let dayNodes = [];
|
||||||
for (let i = 0; i < numDaysInMonthForDate(calendarDate); i++) {
|
for (let i = 0; i < numDaysInMonthForDate(calendarDate); i++) {
|
||||||
const dayNumberDate = new Date(calendarDate);
|
const dayNumberDate = new Date(calendarDate);
|
||||||
dayNumberDate.setUTCDate(i);
|
// Date is a 1-based number
|
||||||
|
dayNumberDate.setUTCDate(i + 1);
|
||||||
const isDayInFuture = dayNumberDate.getTime() - todayTs > 0;
|
const isDayInFuture = dayNumberDate.getTime() - todayTs > 0;
|
||||||
|
|
||||||
// The current day displayed in the archive
|
// The current day displayed in the archive
|
||||||
|
@ -152,10 +156,12 @@ class CalendarView extends TemplateView {
|
||||||
// day number from 0 (monday) to 6 (sunday)
|
// day number from 0 (monday) to 6 (sunday)
|
||||||
const dayNumber = dayNumberDate.getUTCDay();
|
const dayNumber = dayNumberDate.getUTCDay();
|
||||||
|
|
||||||
// +1 because we actually start the week on the calendar on Sunday(6) instead of Monday(0)
|
console.log(
|
||||||
// %7 to rollover the 7-day week
|
`dayNumberDate=${dayNumberDate.getUTCDate()} (${dayNumber}) isDayInFuture=${isDayInFuture}, ${dayNumberDate.getTime()}, ${todayTs}`
|
||||||
|
);
|
||||||
|
|
||||||
// +1 because we're going from 0-based day to 1-based `grid-column-start`
|
// +1 because we're going from 0-based day to 1-based `grid-column-start`
|
||||||
const gridColumnStart = ((dayNumber + 1) % 7) + 1;
|
const gridColumnStart = dayNumber + 1;
|
||||||
|
|
||||||
dayNodes.push(
|
dayNodes.push(
|
||||||
t.li(
|
t.li(
|
||||||
|
@ -175,7 +181,7 @@ class CalendarView extends TemplateView {
|
||||||
// Disable navigation to future days
|
// Disable navigation to future days
|
||||||
href: isDayInFuture ? null : vm.archiveUrlForDate(dayNumberDate),
|
href: isDayInFuture ? null : vm.archiveUrlForDate(dayNumberDate),
|
||||||
},
|
},
|
||||||
[String(i + 1)]
|
[String(dayNumberDate.getUTCDate())]
|
||||||
),
|
),
|
||||||
]
|
]
|
||||||
)
|
)
|
||||||
|
|
Loading…
Reference in New Issue