Document timestamps (nytimes#84)

* update bylines to include timestamps * refactor date formatting out of partial * move where bylineDateString is called to handle caching * update pages tests to reflect adjustments * fix failing playlists test * add comment about bylineDateString validation * switch date string function to partial for client-side rendering * move script tags out of if statement * remove unncessary moment from utils * add separate created time line, add tooltips * revert text cases to reflect manual byline * add comment about data property caching * tweak slightly to remove extra line break Co-authored-by: Isaac White <[email protected]>
reaktor · Jan 3, 2020 · a4f9e42 · a4f9e42
1 parent cf94197
commit a4f9e42
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 22 deletions.
diff --git a/layouts/partials/nav.ejs b/layouts/partials/nav.ejs
@@ -7,25 +7,33 @@
   <h1 class="headline"><%= title %></h1>
   <div class="kicker">
     <div class="attribution">
-      <p>
         <% if (locals.byline) { %>
-          By <span class="author"><%= locals.byline %></span>.
-        <% } else if (locals.createdBy && !locals.byline) { %>
-          Created by <span class="author"><%= createdBy %></span> <%= createdAt %>.
+          <p>
+            By <span class="author"><%=locals.byline %></span>.
+          </p>
         <% } %>
-        <% if (locals.lastUpdatedBy) { %>
-          <%# just encode the last updated date as data property to make relative time work for cache %>
-      Last edited by <span class="author"><%= lastUpdatedBy %></span> <span class="last-updated" data-last-updated="<%= modifiedAt %>"></span>.</p>
-          <!-- populate last updated time -->
-          <script>
-          (function () {
-            var $lastUpdated = $('.last-updated')
-            var utcUpdated = $lastUpdated.data('last-updated')
-            var updatedMoment = moment(utcUpdated)
-            $lastUpdated.html(updatedMoment.fromNow())
-          })()
-          </script>
+        <% if (locals.lastUpdatedBy || locals.byline) { %>
+          <p>
+            <% if (locals.lastUpdatedBy) { %>
+              Last edited by <span class="author"><%= lastUpdatedBy %></span><span class="date" data-date="<%= locals.modifiedAt %>"></span>.
+            <% } %>
+            <% if (locals.byline) { %>
+              Created <span class="date" data-date="<%= locals.createdAt %>"></span>.
+            <% } %>
+          </p>
         <% } %>
+        <script>
+          (function() {
+            $('.date').each(function(i) {
+              const date = $(this)
+              const momentDate = moment(date.data('date'))
+              if (momentDate.isValid()) {
+                date.html(moment().diff(momentDate, 'years') > 1 ? ` on ${momentDate.format('MMMM D, YYYY')}` : ` ${momentDate.fromNow()}`)
+                date.attr('title', momentDate.format('MMMM D, YYYY'))
+              }
+            })
+          })()
+        </script>
       </p>
     </div>
 

diff --git a/server/routes/categories.js b/server/routes/categories.js
@@ -1,7 +1,5 @@
 'use strict'
 
-const moment = require('moment')
-
 const router = require('express-promise-router')()
 
 const cache = require('../cache')
@@ -41,7 +39,7 @@ async function handleCategory(req, res) {
     title: meta.prettyName,
     lastUpdatedBy: (meta.lastModifyingUser || {}).displayName,
     modifiedAt: meta.modifiedTime,
-    createdAt: moment(meta.createdTime).fromNow(),
+    createdAt: meta.createdTime,
     editLink: meta.mimeType === 'text/html' ? meta.folder.webViewLink : meta.webViewLink,
     id,
     template: stringTemplate,

diff --git a/server/routes/playlists.js b/server/routes/playlists.js
@@ -2,8 +2,6 @@
 
 const router = require('express-promise-router')()
 
-const moment = require('moment')
-
 const log = require('../logger')
 const {getMeta, getPlaylist} = require('../list')
 const {fetchDoc, cleanName, fetchByline} = require('../docs')
@@ -69,7 +67,7 @@ function preparePlaylistOverview(playlistMeta, values, breadcrumb) {
     title: playlistMeta.prettyName,
     modifiedAt: playlistMeta.modifiedTime,
     lastUpdatedBy: (playlistMeta.lastModifyingUser || {}).displayName,
-    createdAt: moment(playlistMeta.createdTime).fromNow(),
+    createdAt: playlistMeta.createdTime,
     editLink: playlistMeta.mimeType === 'text/html' ? playlistMeta.folder.webViewLink : playlistMeta.webViewLink
   })