event stuff

_config/filters.js

@@ -18,11 +18,13 @@ export default function (eleventyConfig) {
 		return collection.slice(0, n);
 	});
 
+	/* Check if a dateTime happened before the current dateTime */
 	eleventyConfig.addFilter("inThePast", (dateString) => {
 		if (DateTime.fromISO(dateString) < DateTime.now()) return true;
 	 	return false;
 	});
 
+	/* Check if dates occurred on the same day */
 	eleventyConfig.addFilter("dateStringsEqual", (dateString1, dateString2) => {
 		const date1 = DateTime.fromISO(dateString1);
 		const date2 = DateTime.fromISO(dateString2);
@@ -61,6 +63,13 @@ export default function (eleventyConfig) {
 		);
 	});
 
+	/* Human-readable dates with times */
+	eleventyConfig.addFilter("readableDateTime", (dateString, zone) => {
+		return DateTime.fromISO(dateString, { zone: zone || "utc" }).toLocaleString(
+			DateTime.DATETIME_MED_WITH_WEEKDAY,
+		);
+	});
+
 	/* Filter out structural tags */
 	eleventyConfig.addFilter("removeBasicTags", (tags) => {
 		return tags.filter((tag) => ["all"].indexOf(tag) === -1);
@@ -70,4 +79,10 @@ export default function (eleventyConfig) {
 	eleventyConfig.addFilter("sortAlphabetically", (strings) =>
 		(strings || []).sort((b, a) => b.localeCompare(a)),
 	);
+
+	/* Sort by date field (note: NOT datePosted, dateUpdated) */
+	eleventyConfig.addFilter("sortByDate", (collection) => {
+		collection.sort((b, a) => DateTime.fromISO(b.data.date) < DateTime.fromISO(a.data.date));
+		return collection;
+	});
 }

_includes/layouts/event.njk

@@ -4,9 +4,9 @@ layout: page.njk
 
 <p>
   {% if date | inThePast %}
-    Occurred at <time datetime="{{ date | htmlDateString }}">{{ date | readableDate }}</time>
+    Occurred at <time datetime="{{ date | htmlDateString }}">{{ date | readableDateTime }}</time>
   {% else %}
-    Occuring at <time datetime="{{ date | htmlDateString }}">{{ date | readableDate }}</time>
+    Occuring at <time datetime="{{ date | htmlDateString }}">{{ date | readableDateTime }}</time>
   {% endif %}
 </p>
 

src/calendar.njk

@@ -0,0 +1,19 @@
+---
+title: Calendar of Events
+---
+
+<h2>Upcoming events</h2>
+
+{% for event in collections.events | sortByDate %}
+  {% if not event.data.date | inThePast %}
+    <p>{{ event.data.title }}</p>
+  {% endif %}
+{% endfor %}
+
+<h2>Previous events</h2>
+
+{% for event in collections.events | sortByDate | reverse %}
+  {% if event.data.date | inThePast %}
+    <p>{{ event.data.title }}</p>
+  {% endif %}
+{% endfor %}

src/events/events.11tydata.js

@@ -1,3 +1,6 @@
 export default {
 	layout: "event.njk",
+	tags: [
+		"events"
+	]
 };