diff --git a/package.json b/package.json index 7ae993a..2fc6112 100644 --- a/package.json +++ b/package.json @@ -20,6 +20,7 @@ "gatsby-transformer-sharp": "^2.1.1", "html-entities": "^1.2.1", "lodash": "^4.17.5", + "moment": "^2.24.0", "node-sass": "^4.9.2", "parcel-bundler": "^1.9.4", "prop-types": "^15.6.0", diff --git a/src/components/EventList.js b/src/components/EventList.js index c44d906..c87cf8a 100644 --- a/src/components/EventList.js +++ b/src/components/EventList.js @@ -3,7 +3,26 @@ import PropTypes from 'prop-types' import { Link, graphql } from 'gatsby' import Img from 'gatsby-image' +import moment from 'moment'; +import 'moment/locale/nb' +moment.locale('nb') + export default class EventList extends React.Component { + formatDate(dt) { + return moment(dt).format('D. MMMM') + } + + formatTime(dt) { + return moment(dt).format('HH:mm') + } + + formatTimes(start, end, sep) { + if (!end) { + return this.formatTime(start) + } + return this.formatTime(start) + sep + this.formatTime(end) + } + render() { const { events, title } = this.props @@ -26,8 +45,8 @@ export default class EventList extends React.Component { {event.title}
- 18:00 - {event.start_time}—{event.end_time} + {this.formatTime(event.start_time)} + {this.formatDate(event.start_time)}
@@ -47,8 +66,8 @@ export const pageQuery = graphql` fragment EventListFields on wordpress__wp_events { id title - start_time(formatString: "MMMM DD, YYYY") - end_time(formatString: "MMMM DD, YYYY") + start_time + end_time featured_media { localFile { ...FluidImage diff --git a/src/templates/event.js b/src/templates/event.js index 6701c4b..2861a4f 100644 --- a/src/templates/event.js +++ b/src/templates/event.js @@ -5,6 +5,10 @@ import { graphql, Link } from 'gatsby' import Layout from '../components/Layout' import Img from 'gatsby-image' +import moment from 'moment' +import 'moment/locale/nb' +moment.locale('nb') + const formatPrices = (regular, student) => { let cc = '' if (regular && regular != 0) { @@ -39,12 +43,23 @@ export const EventTemplate = ({
i {venue}
-
- Start: {startTime} +
+ Dag:{' '} + {moment(startTime).format('dddd')} + {moment(startTime).format('D.')} + {moment(startTime).format('MMMM')} + {/* Only specify year if different. */} + {!moment(startTime).isSame(new Date(), 'year') && + {moment(startTime).format('YYYY')} + }
+
+ Start: {moment(startTime).format('HH:mm')} +
+ {/* TODO: make the API stop assuming event duration is 2 hours when unspecified? */} {endTime &&
- Slutt: {endTime} + Slutt: {moment(endTime).format('HH:mm')}
}
@@ -86,7 +101,7 @@ const Event = ({ data }) => { content={event.content} featuredMedia={event.featured_media} startTime={event.start_time} - endTime={event.start_time} + endTime={event.end_time} venue={event.venue} facebookUrl={event.facebook_url} ticketUrl={event.ticket_url} diff --git a/yarn.lock b/yarn.lock index 6acc783..7fde759 100644 --- a/yarn.lock +++ b/yarn.lock @@ -8026,7 +8026,7 @@ mkdirp@0.5.1, mkdirp@0.5.x, "mkdirp@>=0.5 0", mkdirp@^0.5, mkdirp@^0.5.0, mkdirp dependencies: minimist "0.0.8" -moment@^2.21.0: +moment@^2.21.0, moment@^2.24.0: version "2.24.0" resolved "https://registry.yarnpkg.com/moment/-/moment-2.24.0.tgz#0d055d53f5052aa653c9f6eb68bb5d12bf5c2b5b" integrity sha512-bV7f+6l2QigeBBZSM/6yTNq4P2fNpSWj/0e7jQcy87A8e7o2nAfP/34/2ky5Vw4B9S446EtIhodAzkFCcR4dQg==