diff --git a/source/connector-mobilizon.php b/source/connector-mobilizon.php index 70e9317..2499875 100644 --- a/source/connector-mobilizon.php +++ b/source/connector-mobilizon.php @@ -79,8 +79,6 @@ final class Mobilizon_Connector { private function load_settings_globally_before_script($scriptName) { $settings = array( - 'locale' => str_replace('_', '-', get_locale()), - 'timeZone' => wp_timezone_string(), 'url' => MobilizonConnector\Settings::getUrl() ); wp_add_inline_script($scriptName, 'var MOBILIZON_CONNECTOR = ' . json_encode($settings), 'before'); diff --git a/source/front/date-time-wrapper-test.js b/source/front/date-time-wrapper-test.js deleted file mode 100644 index 5cc48c6..0000000 --- a/source/front/date-time-wrapper-test.js +++ /dev/null @@ -1,87 +0,0 @@ -import test from 'ava' -import DateTimeWrapper from './date-time-wrapper.js' - -test('#getShortDate usual date', (t) => { - const d = new DateTimeWrapper({ text: '2020-12-24T16:45:00Z' }) - t.is(d.getShortDate(), '24/12/2020') -}) - -test('#getShortDate usual date with timezone string', (t) => { - const d = new DateTimeWrapper({ - text: '2020-12-24T16:45:00Z', - timeZone: 'Europe/Rome', - }) - t.is(d.getShortDate(), '24/12/2020') -}) - -test('#getShortDate usual date with fixed offset', (t) => { - const d = new DateTimeWrapper({ - text: '2020-12-24T16:45:00Z', - timeZone: 'UTC+02:00', - }) - t.is(d.getShortDate(), '24/12/2020') -}) - -test('#getShortDate usual date with fixed offset without UTC prefix', (t) => { - const d = new DateTimeWrapper({ - text: '2020-12-24T16:45:00Z', - timeZone: '+02:00', - }) - t.is(d.getShortDate(), '24/12/2020') -}) - -test('#getShortDate usual date with empty time zone', (t) => { - const d = new DateTimeWrapper({ text: '2020-12-24T16:45:00Z', timeZone: '' }) - t.is(d.getShortDate(), '24/12/2020') -}) - -test('#get24Time usual time', (t) => { - const d = new DateTimeWrapper({ text: '2020-12-24T16:45:00Z' }) - t.is(d.get24Time(), '16:45') -}) - -test('#equalsDate same date, different time', (t) => { - const d = new DateTimeWrapper({ text: '2020-12-24T16:45:00Z' }) - const e = new DateTimeWrapper({ text: '2020-12-24T17:46:01Z' }) - t.true(d.equalsDate(e)) -}) - -test('#equalsDate different date, different time', (t) => { - const d = new DateTimeWrapper({ text: '2020-12-24T16:45:00Z' }) - const e = new DateTimeWrapper({ text: '2021-11-25T17:46:01Z' }) - t.false(d.equalsDate(e)) -}) - -test('#equalsDate different day, different time', (t) => { - const d = new DateTimeWrapper({ text: '2020-12-24T16:45:00Z' }) - const e = new DateTimeWrapper({ text: '2020-12-25T17:46:01Z' }) - t.false(d.equalsDate(e)) -}) - -test('#equalsDate different month, different time', (t) => { - const d = new DateTimeWrapper({ text: '2020-12-24T16:45:00Z' }) - const e = new DateTimeWrapper({ text: '2020-11-24T17:46:01Z' }) - t.false(d.equalsDate(e)) -}) - -test('#equalsDate different year, different time', (t) => { - const d = new DateTimeWrapper({ text: '2020-12-24T16:45:00Z' }) - const e = new DateTimeWrapper({ text: '2021-12-24T17:46:01Z' }) - t.false(d.equalsDate(e)) -}) - -test('#getCurrentDatetimeAsString correct format', (t) => { - const d = DateTimeWrapper.getCurrentDatetimeAsString() - t.is(d[4], '-') - t.is(d[7], '-') - t.is(d[10], 'T') - t.is(d[13], ':') - t.is(d[16], ':') - t.is(d[19], '.') - t.is(d[d.length - 3], ':') -}) - -test('#getShortOffsetName usual time', (t) => { - const d = new DateTimeWrapper({ text: '2020-12-24T16:45:00Z' }) - t.is(d.getShortOffsetName(), 'UTC') -}) diff --git a/source/front/date-time-wrapper.js b/source/front/date-time-wrapper.js deleted file mode 100644 index c31638e..0000000 --- a/source/front/date-time-wrapper.js +++ /dev/null @@ -1,42 +0,0 @@ -import { DateTime } from 'luxon' - -export default class DateTimeWrapper { - constructor({ locale = 'en-GB', text, timeZone = 'utc' } = {}) { - if (!timeZone) { - timeZone = 'utc' - } - if ( - timeZone.includes(':') && - timeZone.substring(0, 3).toUpperCase() !== 'UTC' - ) { - timeZone = 'UTC' + timeZone - } - this.dateTime = DateTime.fromISO(text, { locale, zone: timeZone }) - } - - getShortDate() { - return this.dateTime.toLocaleString(DateTime.DATE_SHORT) - } - - getShortOffsetName() { - return this.dateTime.offsetNameShort - } - - get24Time() { - return this.dateTime.toLocaleString(DateTime.TIME_24_SIMPLE) - } - - equalsDate(other) { - return ( - this.dateTime && - other.dateTime && - this.dateTime.day === other.dateTime.day && - this.dateTime.month === other.dateTime.month && - this.dateTime.year === other.dateTime.year - ) - } - - static getCurrentDatetimeAsString() { - return DateTime.now().toString() - } -} diff --git a/source/front/events-displayer-test.js b/source/front/events-displayer-test.js index 8b22eae..bb6e9b5 100644 --- a/source/front/events-displayer-test.js +++ b/source/front/events-displayer-test.js @@ -51,6 +51,10 @@ test('#displayEvents one event', (t) => { description: 'c', locality: 'd', }, + startDateFormatted: '15/04/2021', + startTimeFormatted: '10:30', + endDateFormatted: '15/04/2021', + endTimeFormatted: '15:30', }, ] const container = t.context.container diff --git a/source/front/events-displayer.js b/source/front/events-displayer.js index 060fce3..71a2402 100644 --- a/source/front/events-displayer.js +++ b/source/front/events-displayer.js @@ -9,11 +9,6 @@ export function clearEventsList(container) { export function displayEvents({ events, document, container, maxEventsCount }) { hideLoadingIndicator(container) - const isShortOffsetNameShown = - window.MOBILIZON_CONNECTOR.isShortOffsetNameShown || false // TODO remove - const locale = window.MOBILIZON_CONNECTOR.locale - const timeZone = window.MOBILIZON_CONNECTOR.timeZone - const eventsCount = Math.min(maxEventsCount, events.length) const list = container.querySelector('ul') for (let i = 0; i < eventsCount; i++) { @@ -43,11 +38,10 @@ export function displayEvents({ events, document, container, maxEventsCount }) { li.appendChild(br) const date = Formatter.formatDate({ - locale, - start: events[i].beginsOn, - end: events[i].endsOn, - timeZone, - isShortOffsetNameShown, + startDateFormatted: events[i].startDateFormatted, + startTimeFormatted: events[i].startTimeFormatted, + endDateFormatted: events[i].endDateFormatted, + endTimeFormatted: events[i].endTimeFormatted, }) const textnode = document.createTextNode(date) li.appendChild(textnode) diff --git a/source/front/formatter-test.js b/source/front/formatter-test.js index b810343..f735786 100644 --- a/source/front/formatter-test.js +++ b/source/front/formatter-test.js @@ -15,55 +15,34 @@ test('#escapeHTML', (t) => { test('#formatDate one date', (t) => { const date = Formatter.formatDate({ - start: '2021-04-15T10:30:00Z', - end: '2021-04-15T15:30:00Z', + startDateFormatted: '15/04/2021', + startTimeFormatted: '10:30', + endDateFormatted: '15/04/2021', + endTimeFormatted: '15:30', }) t.is(date, '15/04/2021 10:30 - 15:30') }) -test('#formatDate one date with short offset name', (t) => { - const date = Formatter.formatDate({ - start: '2021-04-15T10:30:00Z', - end: '2021-04-15T15:30:00Z', - isShortOffsetNameShown: true, - }) - t.is(date, '15/04/2021 10:30 - 15:30 (UTC)') -}) - test('#formatDate two dates', (t) => { const date = Formatter.formatDate({ - start: '2021-04-15T10:30:00Z', - end: '2021-04-16T15:30:00Z', + startDateFormatted: '15/04/2021', + startTimeFormatted: '10:30', + endDateFormatted: '16/04/2021', + endTimeFormatted: '15:30', }) t.is(date, '15/04/2021 10:30 - 16/04/2021 15:30') }) -test('#formatDate two dates with short offset name', (t) => { - const date = Formatter.formatDate({ - start: '2021-04-15T10:30:00Z', - end: '2021-04-16T15:30:00Z', - isShortOffsetNameShown: true, - }) - t.is(date, '15/04/2021 10:30 - 16/04/2021 15:30 (UTC)') -}) - test('#formatDate second date is null', (t) => { const date = Formatter.formatDate({ - start: '2021-04-15T10:30:00Z', - end: null, + startDateFormatted: '15/04/2021', + startTimeFormatted: '10:30', + endDateFormatted: undefined, + endTimeFormatted: undefined, }) t.is(date, '15/04/2021 10:30') }) -test('#formatDate second date is null with short offset name', (t) => { - const date = Formatter.formatDate({ - start: '2021-04-15T10:30:00Z', - end: null, - isShortOffsetNameShown: true, - }) - t.is(date, '15/04/2021 10:30 (UTC)') -}) - test('#formatLocation both parameters', (t) => { const location = Formatter.formatLocation({ description: 'a', locality: 'b' }) t.is(location, 'a, b') diff --git a/source/front/formatter.js b/source/front/formatter.js index 9180502..359aab8 100644 --- a/source/front/formatter.js +++ b/source/front/formatter.js @@ -1,5 +1,3 @@ -import DateTimeWrapper from './date-time-wrapper.js' - export default class Formatter { static escapeHTML(input) { const div = document.createElement('div') @@ -7,31 +5,22 @@ export default class Formatter { return div.innerHTML } - static formatDate({ locale, timeZone, start, end, isShortOffsetNameShown }) { - // TODO also use WP general site settings - const startDateTime = new DateTimeWrapper({ - locale, - text: start, - timeZone, - }) - let dateText = startDateTime.getShortDate() - dateText += ' ' + startDateTime.get24Time() - if (!end && isShortOffsetNameShown) { - dateText += ' (' + startDateTime.getShortOffsetName() + ')' - } - - if (end) { - const endDateTime = new DateTimeWrapper({ locale, text: end, timeZone }) - if (!startDateTime.equalsDate(endDateTime)) { + static formatDate({ + startDateFormatted, + startTimeFormatted, + endDateFormatted, + endTimeFormatted, + }) { + let dateText = startDateFormatted + dateText += ' ' + startTimeFormatted + if (endDateFormatted) { + if (startDateFormatted !== endDateFormatted) { dateText += ' - ' - dateText += endDateTime.getShortDate() + ' ' + dateText += endDateFormatted + ' ' } else { dateText += ' - ' } - dateText += endDateTime.get24Time() - if (isShortOffsetNameShown) { - dateText += ' (' + endDateTime.getShortOffsetName() + ')' - } + dateText += endTimeFormatted } return dateText } diff --git a/source/includes/Api.php b/source/includes/Api.php index b3d1bb1..dbd03a0 100644 --- a/source/includes/Api.php +++ b/source/includes/Api.php @@ -43,6 +43,7 @@ class Api { } else { $events = GraphQlClient::get_upcoming_events($url, (int) $eventsCount); } + $events = array_map([self::class, 'addDateAndTimeFormats'], $events); return $events; } catch (GeneralException $e) { return new \WP_Error('events_not_loading', 'The events could not be loaded!', array('status' => 500)); @@ -50,4 +51,21 @@ class Api { return new \WP_Error('group_not_found', sprintf('The group "%s" could not be found!', $groupName), array('status' => 404)); } } + + public static function addDateAndTimeFormats($event) { + $dateFormat = SiteSettings::getDateFormat(); + $timeFormat = SiteSettings::getTimeFormat(); + $timeZone = SiteSettings::getTimeZone(); + + $startDateTime = new LocalDateTime($event['beginsOn'], $timeZone); + $event['startDateFormatted'] = LocalDateTimeFormatter::format($startDateTime, $dateFormat); + $event['startTimeFormatted'] = LocalDateTimeFormatter::format($startDateTime, $timeFormat); + + if ($event['endsOn']) { + $endDateTime = new LocalDateTime($event['endsOn'], $timeZone); + $event['endDateFormatted'] = LocalDateTimeFormatter::format($endDateTime, $dateFormat); + $event['endTimeFormatted'] = LocalDateTimeFormatter::format($endDateTime, $timeFormat); + } + return $event; + } } diff --git a/source/includes/SiteSettings.php b/source/includes/SiteSettings.php index 1b91059..2762655 100644 --- a/source/includes/SiteSettings.php +++ b/source/includes/SiteSettings.php @@ -18,4 +18,8 @@ class SiteSettings { return wp_timezone(); } + public static function getTimeZoneString() { + return wp_timezone_string(); + } + }