From b0c59de09270c70f30bc2f2db71f64d56ae4f4de Mon Sep 17 00:00:00 2001
From: Chris Wilkinson <c.wilkinson@elifesciences.org>
Date: Thu, 4 Jul 2024 16:21:04 +0100
Subject: [PATCH] Filter by year

Refs #31
---
 src/users.md | 26 ++++++++++++++++++++++----
 1 file changed, 22 insertions(+), 4 deletions(-)

diff --git a/src/users.md b/src/users.md
index 06889b6..4b6679a 100644
--- a/src/users.md
+++ b/src/users.md
@@ -19,6 +19,19 @@ const now = new Date()
 const firstUser = d3.min(users, user => user.timestamp)
 ```
 
+```js
+const chosenYear = view(
+  Inputs.select([null, ..._.range(now.getUTCFullYear(), firstUser.getUTCFullYear() - 1)], {
+    label: 'Year',
+    format: year => year ?? 'All-time',
+  }),
+)
+```
+
+```js
+const usersInTimePeriod = chosenYear ? users.filter(user => user.timestamp.getUTCFullYear() === chosenYear) : users
+```
+
 <div class="grid grid-cols-4">
   <div class="card">
     <h2>PREreviewers</h2>
@@ -30,22 +43,27 @@ const firstUser = d3.min(users, user => user.timestamp)
 console.log(users)
 function usersTimeline({ width } = {}) {
   return Plot.plot({
-    title: 'PREreviewers joining per month',
+    title: `PREreviewers joining ${chosenYear ? `in ${chosenYear} per week` : 'per month'}`,
     width: Math.max(width, 600),
     height: 400,
     y: { grid: true, label: 'PREreviewers', tickFormat: Math.floor, interval: 1 },
     x: {
       label: '',
-      domain: [d3.utcMonth.floor(firstUser), d3.utcMonth.ceil(now)],
+      domain: chosenYear
+        ? [
+            d3.utcSunday.floor(new Date(chosenYear, 0, 1, 0, 0, 0, 0)),
+            d3.utcSunday.ceil(new Date(chosenYear + 1, 0, 1, 0, 0, 0, 0)),
+          ]
+        : [d3.utcSunday.floor(firstUser), d3.utcSunday.ceil(now)],
     },
     marks: [
       Plot.rectY(
-        users,
+        usersInTimePeriod,
         Plot.binX(
           { y: 'count' },
           {
             x: 'timestamp',
-            interval: d3.utcMonth,
+            interval: chosenYear ? d3.utcWeek : d3.utcMonth,
             tip: true,
           },
         ),