release version 0.6.2

.eslintrc.json

@@ -14,6 +14,9 @@
   "plugins": [
     "ava"
   ],
+  "ignorePatterns": [
+    "gulpfile.js"
+  ],
   "rules": {
     "indent": [
       "error",

.github/workflows/codeql-analysis.yml

@@ -0,0 +1,71 @@
+# For most projects, this workflow file will not need changing; you simply need
+# to commit it to your repository.
+#
+# You may wish to alter this file to override the set of languages analyzed,
+# or to provide custom queries or build logic.
+#
+# ******** NOTE ********
+# We have attempted to detect the languages in your repository. Please check
+# the `language` matrix defined below to confirm you have the correct set of
+# supported CodeQL languages.
+#
+name: "CodeQL"
+
+on:
+  push:
+    branches: [ main ]
+  pull_request:
+    # The branches below must be a subset of the branches above
+    branches: [ main ]
+  schedule:
+    - cron: '39 19 * * 4'
+
+jobs:
+  analyze:
+    name: Analyze
+    runs-on: ubuntu-latest
+    permissions:
+      actions: read
+      contents: read
+      security-events: write
+
+    strategy:
+      fail-fast: false
+      matrix:
+        language: [ 'javascript' ]
+        # CodeQL supports [ 'cpp', 'csharp', 'go', 'java', 'javascript', 'python' ]
+        # Learn more:
+        # https://docs.github.com/en/free-pro-team@latest/github/finding-security-vulnerabilities-and-errors-in-your-code/configuring-code-scanning#changing-the-languages-that-are-analyzed
+
+    steps:
+    - name: Checkout repository
+      uses: actions/checkout@v2
+
+    # Initializes the CodeQL tools for scanning.
+    - name: Initialize CodeQL
+      uses: github/codeql-action/init@v1
+      with:
+        languages: ${{ matrix.language }}
+        # If you wish to specify custom queries, you can do so here or in a config file.
+        # By default, queries listed here will override any specified in a config file.
+        # Prefix the list here with "+" to use these queries and those in the config file.
+        # queries: ./path/to/local/query, your-org/your-repo/queries@main
+
+    # Autobuild attempts to build any compiled languages  (C/C++, C#, or Java).
+    # If this step fails, then you should remove it and run the build manually (see below)
+    - name: Autobuild
+      uses: github/codeql-action/autobuild@v1
+
+    # ℹ️ Command-line programs to run using the OS shell.
+    # 📚 https://git.io/JvXDl
+
+    # ✏️ If the Autobuild fails above, remove it and uncomment the following three lines
+    #    and modify them (or add more) to build your code if your project
+    #    uses a compiled language
+
+    #- run: |
+    #   make bootstrap
+    #   make release
+
+    - name: Perform CodeQL Analysis
+      uses: github/codeql-action/analyze@v1

.github/workflows/test.yml

@@ -0,0 +1,29 @@
+# This workflow will do a clean install of node dependencies, build the source code and run tests across different versions of node
+# For more information see: https://help.github.com/actions/language-and-framework-guides/using-nodejs-with-github-actions
+
+name: Node.js CI
+
+on:
+  push:
+    branches: [ main ]
+  pull_request:
+    branches: [ main ]
+
+jobs:
+  build:
+
+    runs-on: ubuntu-latest
+
+    strategy:
+      matrix:
+        node-version: [14.x]
+        # See supported Node.js release schedule at https://nodejs.org/en/about/releases/
+
+    steps:
+    - uses: actions/checkout@v2
+    - name: Use Node.js ${{ matrix.node-version }}
+      uses: actions/setup-node@v2
+      with:
+        node-version: ${{ matrix.node-version }}
+    - run: npm ci
+    - run: npm run build-prod

.gitignore

@@ -1,3 +1,4 @@
+.idea/
 build/
 coverage/
 node_modules/

LICENSE.md

@@ -0,0 +1,201 @@
+                                 Apache License
+                           Version 2.0, January 2004
+                        http://www.apache.org/licenses/
+
+   TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+   1. Definitions.
+
+      "License" shall mean the terms and conditions for use, reproduction,
+      and distribution as defined by Sections 1 through 9 of this document.
+
+      "Licensor" shall mean the copyright owner or entity authorized by
+      the copyright owner that is granting the License.
+
+      "Legal Entity" shall mean the union of the acting entity and all
+      other entities that control, are controlled by, or are under common
+      control with that entity. For the purposes of this definition,
+      "control" means (i) the power, direct or indirect, to cause the
+      direction or management of such entity, whether by contract or
+      otherwise, or (ii) ownership of fifty percent (50%) or more of the
+      outstanding shares, or (iii) beneficial ownership of such entity.
+
+      "You" (or "Your") shall mean an individual or Legal Entity
+      exercising permissions granted by this License.
+
+      "Source" form shall mean the preferred form for making modifications,
+      including but not limited to software source code, documentation
+      source, and configuration files.
+
+      "Object" form shall mean any form resulting from mechanical
+      transformation or translation of a Source form, including but
+      not limited to compiled object code, generated documentation,
+      and conversions to other media types.
+
+      "Work" shall mean the work of authorship, whether in Source or
+      Object form, made available under the License, as indicated by a
+      copyright notice that is included in or attached to the work
+      (an example is provided in the Appendix below).
+
+      "Derivative Works" shall mean any work, whether in Source or Object
+      form, that is based on (or derived from) the Work and for which the
+      editorial revisions, annotations, elaborations, or other modifications
+      represent, as a whole, an original work of authorship. For the purposes
+      of this License, Derivative Works shall not include works that remain
+      separable from, or merely link (or bind by name) to the interfaces of,
+      the Work and Derivative Works thereof.
+
+      "Contribution" shall mean any work of authorship, including
+      the original version of the Work and any modifications or additions
+      to that Work or Derivative Works thereof, that is intentionally
+      submitted to Licensor for inclusion in the Work by the copyright owner
+      or by an individual or Legal Entity authorized to submit on behalf of
+      the copyright owner. For the purposes of this definition, "submitted"
+      means any form of electronic, verbal, or written communication sent
+      to the Licensor or its representatives, including but not limited to
+      communication on electronic mailing lists, source code control systems,
+      and issue tracking systems that are managed by, or on behalf of, the
+      Licensor for the purpose of discussing and improving the Work, but
+      excluding communication that is conspicuously marked or otherwise
+      designated in writing by the copyright owner as "Not a Contribution."
+
+      "Contributor" shall mean Licensor and any individual or Legal Entity
+      on behalf of whom a Contribution has been received by Licensor and
+      subsequently incorporated within the Work.
+
+   2. Grant of Copyright License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      copyright license to reproduce, prepare Derivative Works of,
+      publicly display, publicly perform, sublicense, and distribute the
+      Work and such Derivative Works in Source or Object form.
+
+   3. Grant of Patent License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      (except as stated in this section) patent license to make, have made,
+      use, offer to sell, sell, import, and otherwise transfer the Work,
+      where such license applies only to those patent claims licensable
+      by such Contributor that are necessarily infringed by their
+      Contribution(s) alone or by combination of their Contribution(s)
+      with the Work to which such Contribution(s) was submitted. If You
+      institute patent litigation against any entity (including a
+      cross-claim or counterclaim in a lawsuit) alleging that the Work
+      or a Contribution incorporated within the Work constitutes direct
+      or contributory patent infringement, then any patent licenses
+      granted to You under this License for that Work shall terminate
+      as of the date such litigation is filed.
+
+   4. Redistribution. You may reproduce and distribute copies of the
+      Work or Derivative Works thereof in any medium, with or without
+      modifications, and in Source or Object form, provided that You
+      meet the following conditions:
+
+      (a) You must give any other recipients of the Work or
+          Derivative Works a copy of this License; and
+
+      (b) You must cause any modified files to carry prominent notices
+          stating that You changed the files; and
+
+      (c) You must retain, in the Source form of any Derivative Works
+          that You distribute, all copyright, patent, trademark, and
+          attribution notices from the Source form of the Work,
+          excluding those notices that do not pertain to any part of
+          the Derivative Works; and
+
+      (d) If the Work includes a "NOTICE" text file as part of its
+          distribution, then any Derivative Works that You distribute must
+          include a readable copy of the attribution notices contained
+          within such NOTICE file, excluding those notices that do not
+          pertain to any part of the Derivative Works, in at least one
+          of the following places: within a NOTICE text file distributed
+          as part of the Derivative Works; within the Source form or
+          documentation, if provided along with the Derivative Works; or,
+          within a display generated by the Derivative Works, if and
+          wherever such third-party notices normally appear. The contents
+          of the NOTICE file are for informational purposes only and
+          do not modify the License. You may add Your own attribution
+          notices within Derivative Works that You distribute, alongside
+          or as an addendum to the NOTICE text from the Work, provided
+          that such additional attribution notices cannot be construed
+          as modifying the License.
+
+      You may add Your own copyright statement to Your modifications and
+      may provide additional or different license terms and conditions
+      for use, reproduction, or distribution of Your modifications, or
+      for any such Derivative Works as a whole, provided Your use,
+      reproduction, and distribution of the Work otherwise complies with
+      the conditions stated in this License.
+
+   5. Submission of Contributions. Unless You explicitly state otherwise,
+      any Contribution intentionally submitted for inclusion in the Work
+      by You to the Licensor shall be under the terms and conditions of
+      this License, without any additional terms or conditions.
+      Notwithstanding the above, nothing herein shall supersede or modify
+      the terms of any separate license agreement you may have executed
+      with Licensor regarding such Contributions.
+
+   6. Trademarks. This License does not grant permission to use the trade
+      names, trademarks, service marks, or product names of the Licensor,
+      except as required for reasonable and customary use in describing the
+      origin of the Work and reproducing the content of the NOTICE file.
+
+   7. Disclaimer of Warranty. Unless required by applicable law or
+      agreed to in writing, Licensor provides the Work (and each
+      Contributor provides its Contributions) on an "AS IS" BASIS,
+      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+      implied, including, without limitation, any warranties or conditions
+      of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+      PARTICULAR PURPOSE. You are solely responsible for determining the
+      appropriateness of using or redistributing the Work and assume any
+      risks associated with Your exercise of permissions under this License.
+
+   8. Limitation of Liability. In no event and under no legal theory,
+      whether in tort (including negligence), contract, or otherwise,
+      unless required by applicable law (such as deliberate and grossly
+      negligent acts) or agreed to in writing, shall any Contributor be
+      liable to You for damages, including any direct, indirect, special,
+      incidental, or consequential damages of any character arising as a
+      result of this License or out of the use or inability to use the
+      Work (including but not limited to damages for loss of goodwill,
+      work stoppage, computer failure or malfunction, or any and all
+      other commercial damages or losses), even if such Contributor
+      has been advised of the possibility of such damages.
+
+   9. Accepting Warranty or Additional Liability. While redistributing
+      the Work or Derivative Works thereof, You may choose to offer,
+      and charge a fee for, acceptance of support, warranty, indemnity,
+      or other liability obligations and/or rights consistent with this
+      License. However, in accepting such obligations, You may act only
+      on Your own behalf and on Your sole responsibility, not on behalf
+      of any other Contributor, and only if You agree to indemnify,
+      defend, and hold each Contributor harmless for any liability
+      incurred by, or claims asserted against, such Contributor by reason
+      of your accepting any such warranty or additional liability.
+
+   END OF TERMS AND CONDITIONS
+
+   APPENDIX: How to apply the Apache License to your work.
+
+      To apply the Apache License to your work, attach the following
+      boilerplate notice, with the fields enclosed by brackets "[]"
+      replaced with your own identifying information. (Don't include
+      the brackets!)  The text should be enclosed in the appropriate
+      comment syntax for the file format. We also recommend that a
+      file or class name and description of purpose be included on the
+      same "printed page" as the copyright notice for easier
+      identification within third-party archives.
+
+   Copyright [yyyy] [name of copyright owner]
+
+   Licensed under the Apache License, Version 2.0 (the "License");
+   you may not use this file except in compliance with the License.
+   You may obtain a copy of the License at
+
+       http://www.apache.org/licenses/LICENSE-2.0
+
+   Unless required by applicable law or agreed to in writing, software
+   distributed under the License is distributed on an "AS IS" BASIS,
+   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+   See the License for the specific language governing permissions and
+   limitations under the License.

README.md

@@ -18,14 +18,17 @@ More details can be found in the [WordPress Plugin Directory](https://wordpress.
 ### Release procedure
 1. Make sure `changelog.txt` is up-to-date. Use a new version number and copy over the new section into `readme.txt`.
 2. Update `package.json` with the same version number.
-3. Build: `npm run build-prod`
+3. Update the `package-lock.json`: `npm i --package-lock-only`
-4. Determine minimum PHP version for code and update package.json if needed: `./vendor/bin/phpcompatinfo analyser:run ./source`
+4. Build: `npm run build-prod`
-5. Make sure screenshots are up-to-date.
+5. Determine minimum PHP version for code and update package.json if needed: `./vendor/bin/phpcompatinfo analyser:run ./source`
-6. Copy the built plugin into `/trunk` of SVN.
+6. Make sure screenshots are up-to-date.
-7. Create a new tag of the new version: `svn cp trunk tags/<version>`
+7. Copy the built plugin into `/trunk` of SVN.
-8. Check the version number occurences in both folders.
+8. Create a new tag of the new version: `svn cp trunk tags/<version>`
-9. Commit everything together: `svn ci -m "release version <version>"`
+9. Check the version number occurrences in both folders.
-10. Tag the new version in `git` too.
+10. Commit everything together to the release SVN: `svn ci -m "release version <version>"`
+11. Commit the new version in git with the same message.
+12. Tag the new version: `git tag v<version>`
+13. Push the new tag to the repository: `git push --tags`
 
 ### Other commands
 - Run ESLint: `npm run eslint`

package.json

@@ -1,7 +1,7 @@
 {
   "name": "connector-mobilizon",
-  "version": "0.3.0",
+  "version": "0.6.2",
-  "description": "Display mobilizon events in WordPress.",
+  "description": "Display Mobilizon events in WordPress.",
   "private": true,
   "scripts": {
     "build-dev": "gulp dev",
@@ -20,23 +20,23 @@
   },
   "license": "Apache-2.0",
   "dependencies": {
-    "graphql": "^15.5.0",
+    "graphql": "^15.5.1",
-    "graphql-request": "^3.4.0",
+    "graphql-request": "^3.5.0",
-    "luxon": "^1.26.0",
+    "luxon": "^2.0.2",
-    "object-hash": "^2.1.1"
+    "object-hash": "^2.2.0"
   },
   "devDependencies": {
     "ava": "^3.15.0",
-    "c8": "^7.7.1",
+    "c8": "^7.8.0",
     "del": "^6.0.0",
-    "eslint": "^7.24.0",
+    "eslint": "^7.32.0",
     "eslint-plugin-ava": "^12.0.0",
     "esm": "^3.2.25",
     "gulp": "^4.0.2",
-    "gulp-replace": "^1.0.0",
+    "gulp-replace": "^1.1.3",
-    "jsdom": "^16.5.3",
+    "jsdom": "^17.0.0",
-    "webpack": "^5.34.0",
+    "webpack": "^5.51.1",
-    "webpack-cli": "^4.6.0",
+    "webpack-cli": "^4.8.0",
     "webpack-stream": "^6.1.2"
   },
   "ava": {
@@ -51,6 +51,6 @@
     "niceName": "Connector for Mobilizon",
     "phpMinimumVersion": 5.4,
     "wordpressMinimumVersion": 5.6,
-    "wordpressTestedUpToVersion": 5.7
+    "wordpressTestedUpToVersion": 5.8
   }
 }

source/connector-mobilizon/changelog.txt

@@ -1,13 +1,45 @@
 ### [Unreleased]
 #### Added
+#### Changed
+#### Deprecated
+#### Removed
+#### Fixed
+#### Security
+
+### [0.6.2] - 2021-08-24
+#### Changed
+- Update dependencies
+#### Fixed
+- Fix empty WordPress timezone_string option resulting in Invalid DateTime
+
+### [0.6.1] - 2021-07-13
+#### Changed
+- Confirm compatibility with WordPress 5.8
+- Update dependencies
+
+### [0.6.0] - 2021-06-02
+#### Added
+- Optionally display the current offset as short name after the time via the general plugin settings
+#### Changed
+- Update dependencies
+#### Fixed
+- Capitalise Mobilizon name in description
+
+### [0.5.0] - 2021-05-06
+#### Added
+- Localise dates based on the WordPress locale and time zone
+#### Changed
+- Clearly list features in `readme.txt` description
+- Update dev dependencies c8, eslint, gulp-replace, webpack
+#### Fixed
+- Improve translatability
+
+### [0.4.0] - 2021-04-20
+#### Added
 - Show events' location if set: `description` and `locality` fields
 - Plugin icon
 #### Changed
 - Update dev dependencies eslint, jsdom, webpack
-#### Deprecated
-#### Removed
-#### Fixed
-#### Security
 
 ### [0.3.0] - 2021-04-05
 #### Added

source/connector-mobilizon/front/date-time-wrapper-test.js

@@ -2,42 +2,62 @@ import test from 'ava'
 import DateTimeWrapper from './date-time-wrapper'
 
 test('#getShortDate usual date', t => {
-  const d = new DateTimeWrapper('2020-12-24T16:45:00Z')
+  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('2020-12-24T16:45:00Z')
+  const d = new DateTimeWrapper({ text: '2020-12-24T16:45:00Z' })
-  t.is(d.get24Time(), '17:45')
+  t.is(d.get24Time(), '16:45')
 })
 
 test('#equalsDate same date, different time', t => {
-  const d = new DateTimeWrapper('2020-12-24T16:45:00Z')
+  const d = new DateTimeWrapper({ text: '2020-12-24T16:45:00Z' })
-  const e = new DateTimeWrapper('2020-12-24T17:46:01Z')
+  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('2020-12-24T16:45:00Z')
+  const d = new DateTimeWrapper({ text: '2020-12-24T16:45:00Z' })
-  const e = new DateTimeWrapper('2021-11-25T17:46:01Z')
+  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('2020-12-24T16:45:00Z')
+  const d = new DateTimeWrapper({ text: '2020-12-24T16:45:00Z' })
-  const e = new DateTimeWrapper('2020-12-25T17:46:01Z')
+  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('2020-12-24T16:45:00Z')
+  const d = new DateTimeWrapper({ text: '2020-12-24T16:45:00Z' })
-  const e = new DateTimeWrapper('2020-11-24T17:46:01Z')
+  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('2020-12-24T16:45:00Z')
+  const d = new DateTimeWrapper({ text: '2020-12-24T16:45:00Z' })
-  const e = new DateTimeWrapper('2021-12-24T17:46:01Z')
+  const e = new DateTimeWrapper({ text: '2021-12-24T17:46:01Z' })
   t.false(d.equalsDate(e))
 })
 
@@ -51,3 +71,8 @@ test('#getCurrentDatetimeAsString correct format', t => {
   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')
+})

source/connector-mobilizon/front/date-time-wrapper.js

@@ -2,14 +2,24 @@ import { DateTime } from 'luxon'
 
 export default class DateTimeWrapper {
 
-  constructor(text) {
+  constructor({ locale = 'en-GB', text, timeZone = 'utc' } = {}) {
-    this.dateTime = DateTime.fromISO(text)
+    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)
   }
@@ -23,6 +33,6 @@ export default class DateTimeWrapper {
   }
 
   static getCurrentDatetimeAsString() {
-    return DateTime.local().toString()
+    return DateTime.now().toString()
   }
 }

source/connector-mobilizon/front/events-displayer-test.js

@@ -0,0 +1,61 @@
+import test from 'ava'
+import { JSDOM } from 'jsdom'
+
+import { displayEvents, displayErrorMessage } from './events-displayer'
+
+let document
+
+test.before(() => {
+  document = new JSDOM().window.document
+})
+
+test.beforeEach(t => {
+  t.context.list = document.createElement('ul')
+  t.context.list.setAttribute('data-locale', 'en-GB')
+  t.context.list.setAttribute('data-maximum', '2')
+  t.context.list.setAttribute('data-time-zone', 'utc')
+  const listElement = document.createElement('li')
+  listElement.setAttribute('style', 'display: none;')
+  t.context.list.appendChild(listElement)
+})
+
+test('#displayEvents one event', t => {
+  const list = t.context.list
+  const data = {
+    events: {
+      elements: [
+        {
+          title: 'a',
+          url: 'b',
+          beginsOn: '2021-04-15T10:30:00Z',
+          endsOn: '2021-04-15T15:30:00Z',
+          physicalAddress: {
+            description: 'c',
+            locality: 'd'
+          }
+        }
+      ]
+    }
+  }
+  displayEvents({ data, document, list })
+  t.is(list.children.length, 2)
+  t.is(list.children[1].childNodes[0].tagName, 'A')
+  t.is(list.children[1].childNodes[0].getAttribute('href'), 'b')
+  t.is(list.children[1].childNodes[0].childNodes[0].nodeValue, 'a')
+  t.is(list.children[1].childNodes[1].tagName, 'BR')
+  t.is(list.children[1].childNodes[2].nodeValue, '15/04/2021 10:30 - 15:30')
+  t.is(list.children[1].childNodes[3].tagName, 'BR')
+  t.is(list.children[1].childNodes[4].nodeValue, 'c, d')
+})
+
+test('#displayErrorMessage no children added', t => {
+  const list = t.context.list
+  displayErrorMessage({ data: '', list })
+  t.is(list.children.length, 1)
+})
+
+test('#displayErrorMessage error message display', t => {
+  const list = t.context.list
+  displayErrorMessage({ data: '', list })
+  t.is(list.children[0].style.display, 'block')
+})

source/connector-mobilizon/front/events-displayer.js

@@ -0,0 +1,51 @@
+import Formatter from './formatter'
+import { createAnchorElement } from './html-creator'
+
+export function displayEvents({ data, document, list }) {
+  const locale = list.getAttribute('data-locale')
+  const maxEventsCount = list.getAttribute('data-maximum')
+  const timeZone = list.getAttribute('data-time-zone')
+  const isShortOffsetNameShown = list.hasAttribute('data-is-short-offset-name-shown')
+  const events = data.events ? data.events.elements : data.group.organizedEvents.elements
+  const eventsCount = Math.min(maxEventsCount, events.length)
+  for (let i = 0; i < eventsCount; i++) {
+    const li = document.createElement('li')
+
+    const a = createAnchorElement({ document, text: events[i].title, url: events[i].url })
+    li.appendChild(a)
+
+    const br = document.createElement('br')
+    li.appendChild(br)
+
+    const date = Formatter.formatDate({
+      locale,
+      start: events[i].beginsOn,
+      end: events[i].endsOn,
+      timeZone,
+      isShortOffsetNameShown,
+    })
+    const textnode = document.createTextNode(date)
+    li.appendChild(textnode)
+
+    if (events[i].physicalAddress) {
+      const location = Formatter.formatLocation({
+        description: events[i].physicalAddress.description,
+        locality: events[i].physicalAddress.locality
+      })
+      if (location) {
+        const brBeforeLocation = document.createElement('br')
+        li.appendChild(brBeforeLocation)
+
+        const textnodeLocation = document.createTextNode(location)
+        li.appendChild(textnodeLocation)
+      }
+    }
+
+    list.appendChild(li)
+  }
+}
+
+export function displayErrorMessage({ data, list }) {
+  console.error(data)
+  list.children[0].style.display = 'block'
+}

source/connector-mobilizon/front/events-loader.js

@@ -1,51 +1,8 @@
-import Formatter from './formatter'
+import { displayEvents, displayErrorMessage } from './events-displayer'
 import * as GraphqlWrapper from './graphql-wrapper'
-import { createAnchorElement } from './html-creator'
 
 const NAME = '<wordpress-name>'
 
-function displayEvents(data, list) {
-  const maxEventsCount = list.getAttribute('data-maximum')
-  const events = data.events ? data.events.elements : data.group.organizedEvents.elements
-  const eventsCount = Math.min(maxEventsCount, events.length)
-  for (let i = 0; i < eventsCount; i++) {
-    const li = document.createElement('li')
-    
-    const a = createAnchorElement({ text: events[i].title, url: events[i].url })
-    li.appendChild(a)
-
-    const br = document.createElement('br')
-    li.appendChild(br)
-
-    const date = Formatter.formatDate({ start: events[i].beginsOn, end: events[i].endsOn })
-    const textnode = document.createTextNode(date)
-    li.appendChild(textnode)
-
-    if (events[i].physicalAddress) {
-      const location = Formatter.formatLocation({
-        description: events[i].physicalAddress.description,
-        locality: events[i].physicalAddress.locality
-      })
-      if (location) {
-        const brBeforeLocation = document.createElement('br')
-        li.appendChild(brBeforeLocation)
-
-        const textnodeLocation = document.createTextNode(location)
-        li.appendChild(textnodeLocation)
-      }
-    }
-
-    list.appendChild(li)
-  }
-}
-
-function displayErrorMessage(data, list) {
-  console.error(data)
-  for (let i = 0; i < list.children.length; i++) {
-    list.children[i].style.display = 'block'
-  }
-}
-
 document.addEventListener('DOMContentLoaded', () => {
   const eventLists = document.getElementsByClassName(NAME + '_events-list')
   for (let list of eventLists) {
@@ -54,12 +11,12 @@ document.addEventListener('DOMContentLoaded', () => {
     const groupName = list.getAttribute('data-group-name')
     if (groupName) {
       GraphqlWrapper.getUpcomingEventsByGroupName({ url, limit, groupName })
-        .then((data) => displayEvents(data, list))
+        .then((data) => displayEvents({ data, document, list }))
-        .catch((data) => displayErrorMessage(data, list))
+        .catch((data) => displayErrorMessage({ data, list }))
     } else {
       GraphqlWrapper.getUpcomingEvents({ url, limit })
-        .then((data) => displayEvents(data, list))
+        .then((data) => displayEvents({ data, document, list }))
-        .catch((data) => displayErrorMessage(data, list))
+        .catch((data) => displayErrorMessage({ data, list }))
     }
   }
 })

source/connector-mobilizon/front/formatter-test.js

@@ -3,12 +3,22 @@ import Formatter from './formatter'
 
 test('#formatDate one date', t => {
   const date = Formatter.formatDate({ start: '2021-04-15T10:30:00Z', end: '2021-04-15T15:30:00Z' })
-  t.is(date, '15/04/2021 12:30 - 17: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' })
-  t.is(date, '15/04/2021 12:30 - 16/04/2021 17: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 (UTC) - 16/04/2021 15:30 (UTC)')
 })
 
 test('#formatLocation both parameters', t => {

source/connector-mobilizon/front/formatter.js

@@ -2,16 +2,24 @@ import DateTimeWrapper from './date-time-wrapper'
 
 export default class Formatter {
   
-  static formatDate({ start, end }) {
+  static formatDate({ locale, timeZone, start, end, isShortOffsetNameShown }) {
-    const startDateTime = new DateTimeWrapper(start)
+    const startDateTime = new DateTimeWrapper({ locale, text: start, timeZone })
-    const endDateTime = new DateTimeWrapper(end)
+    const endDateTime = new DateTimeWrapper({ locale, text: end, timeZone })
     let dateText = startDateTime.getShortDate()
     dateText += ' ' + startDateTime.get24Time()
-    dateText += ' - '
     if (!startDateTime.equalsDate(endDateTime)) {
+      if (isShortOffsetNameShown) {
+        dateText += ' (' + startDateTime.getShortOffsetName() + ')'
+      }
+      dateText += ' - '
       dateText += endDateTime.getShortDate() + ' '
+    } else {
+      dateText += ' - '
     }
     dateText += endDateTime.get24Time()
+    if (isShortOffsetNameShown) {
+      dateText += ' (' + endDateTime.getShortOffsetName() + ')'
+    }
     return dateText
   }
 

source/connector-mobilizon/front/html-creator-test.js

@@ -1,14 +1,16 @@
 import test from 'ava'
 import { JSDOM } from 'jsdom'
 
-import * as HtmlCreator from './html-creator'
+import { createAnchorElement } from './html-creator'
+
+let document
 
 test.beforeEach(() => {
-  global.document = new JSDOM().window.document
+  document = new JSDOM().window.document
 })
 
 test('#createAnchorElement usual parameters', t => {
-  const a = HtmlCreator.createAnchorElement({ text: 'a', url: 'b' })
+  const a = createAnchorElement({ document, text: 'a', url: 'b' })
   t.is(a.tagName, 'A')
   t.is(a.innerHTML, 'a')
   t.is(a.getAttribute('href'), 'b')

source/connector-mobilizon/front/html-creator.js

@@ -1,4 +1,4 @@
-export function createAnchorElement({ text, url }) {
+export function createAnchorElement({ document, text, url }) {
   const a = document.createElement('a')
   a.setAttribute('href', url)
   a.setAttribute('target', '_blank')

source/connector-mobilizon/includes/constants.php

@@ -9,4 +9,3 @@ if (!defined('ABSPATH')) {
 const DEFAULT_EVENTS_COUNT = 5;
 const NAME = '<wordpress-name>';
 const NICE_NAME = '<wordpress-nice-name>';
-const TEXT_DOMAIN = '<wordpress-name>';

source/connector-mobilizon/includes/events-list-shortcut.php

@@ -26,9 +26,11 @@ class EventsListShortcut {
 
     $classNamePrefix = NAME;
     $eventsCount = $atts_with_overriden_defaults['events-count'];
+    $locale = str_replace('_', '-', get_locale());
     $groupName = $atts_with_overriden_defaults['group-name'];
     $url = Settings::getUrl();
-    $textDomain = TEXT_DOMAIN;
+    $timeZone = wp_timezone_string();
+    $isShortOffsetNameShown = Settings::isShortOffsetNameShown();
 
     ob_start();
     require dirname(__DIR__) . '/view/events-list.php';

source/connector-mobilizon/includes/events-list-widget.php

@@ -11,9 +11,9 @@ class EventsListWidget extends \WP_Widget {
   public function __construct() {
     parent::__construct(
       NAME . '-events-list',
-      NICE_NAME . ' ' . esc_html__('Events List', TEXT_DOMAIN),
+      NICE_NAME . ' ' . __('Events List', 'connector-mobilizon'),
       array(
-        'description' => __('A list of the upcoming events of the connected Mobilizon instance.', TEXT_DOMAIN),
+        'description' => __('A list of the upcoming events of the connected Mobilizon instance.', 'connector-mobilizon'),
       ),
     );
   }
@@ -27,9 +27,11 @@ class EventsListWidget extends \WP_Widget {
 
     $classNamePrefix = NAME;
     $eventsCount = $options['eventsCount'];
+    $locale = str_replace('_', '-', get_locale());
     $groupName = isset($options['groupName']) ? $options['groupName'] : '';
     $url = Settings::getUrl();
-    $textDomain = TEXT_DOMAIN;
+    $timeZone = wp_timezone_string();
+    $isShortOffsetNameShown = Settings::isShortOffsetNameShown();
 
     require dirname(__DIR__) . '/view/events-list.php';
 
@@ -37,10 +39,9 @@ class EventsListWidget extends \WP_Widget {
   }
 
   public function form($options) {
-    $title = !empty($options['title']) ? $options['title'] : esc_html__('Events', TEXT_DOMAIN);
+    $title = !empty($options['title']) ? $options['title'] : __('Events', 'connector-mobilizon');
     $eventsCount = !empty($options['eventsCount']) ? $options['eventsCount'] : DEFAULT_EVENTS_COUNT;
     $groupName = !empty($options['groupName']) ? $options['groupName'] : '';
-    $textDomain = TEXT_DOMAIN;
     
     require dirname(__DIR__) . '/view/events-list-widget/form.php';
   }

source/connector-mobilizon/includes/settings.php

@@ -9,9 +9,12 @@ if (!defined('ABSPATH')) {
 class Settings {
 
   private static $DEFAULT_OPTION_URL = 'https://mobilizon.fr';
+  private static $DEFAULT_IS_SHORT_OFFSET_NAME_SHOWN = false;
   private static $PAGE_NAME = 'wordpress_mobilizon';
   private static $OPTIONS_GROUP_NAME = 'wordpress_mobilizon';
+  private static $OPTION_NAME_IS_SHORT_OFFSET_NAME_SHOWN = 'wordpress_mobilizon_is_short_offset_name_shown';
   private static $OPTION_NAME_URL = 'wordpress_mobilizon_url';
+  private static $SETTING_FIELD_NAME_IS_SHORT_OFFSET_NAME_SHOWN = 'wordpress_mobilizon_field_is_short_offset_name_shown';
   private static $SETTING_FIELD_NAME_URL = 'wordpress_mobilizon_field_url';
   private static $SETTINGS_SECTION_NAME = 'wordpress_mobilizon_section_general';
 
@@ -21,6 +24,10 @@ class Settings {
   }
 
   public static function init_settings() {
+    register_setting(
+      self::$OPTIONS_GROUP_NAME,
+      self::$OPTION_NAME_IS_SHORT_OFFSET_NAME_SHOWN
+    );
     register_setting(
       self::$OPTIONS_GROUP_NAME,
       self::$OPTION_NAME_URL,
@@ -29,14 +36,14 @@ class Settings {
 
     add_settings_section(
       self::$SETTINGS_SECTION_NAME,
-      __('General Settings', TEXT_DOMAIN),
+      __('General Settings', 'connector-mobilizon'),
       '',
       self::$PAGE_NAME
     );
 
     add_settings_field(
       self::$SETTING_FIELD_NAME_URL,
-      __('URL', TEXT_DOMAIN),
+      __('URL', 'connector-mobilizon'),
       'MobilizonConnector\Settings::output_field_url',
       self::$PAGE_NAME,
       self::$SETTINGS_SECTION_NAME,
@@ -44,10 +51,24 @@ class Settings {
         'label_for' => self::$SETTING_FIELD_NAME_URL
       )
     );
+    add_settings_field(
+      self::$SETTING_FIELD_NAME_IS_SHORT_OFFSET_NAME_SHOWN,
+      __('Display named offset', 'connector-mobilizon'),
+      'MobilizonConnector\Settings::output_field_is_short_offset_name_shown',
+      self::$PAGE_NAME,
+      self::$SETTINGS_SECTION_NAME,
+      array(
+        'label_for' => self::$SETTING_FIELD_NAME_IS_SHORT_OFFSET_NAME_SHOWN
+      )
+    );
+  }
+
+  public static function output_field_is_short_offset_name_shown($args) {
+    $isShortOffsetNameShown = self::isShortOffsetNameShown();
+    require dirname(__DIR__) . '/view/settings/is-short-offset-name-shown-field.php';
   }
 
   public static function output_field_url($args) {
-    $textDomain = TEXT_DOMAIN;
     $url = self::getUrl();
     require dirname(__DIR__) . '/view/settings/url-field.php';
   }
@@ -58,7 +79,7 @@ class Settings {
       add_settings_error(
         self::$OPTION_NAME_URL,
         'wordpress_mobilizon_field_url_error',
-        __('The URL is invalid.', TEXT_DOMAIN),
+        __('The URL is invalid.', 'connector-mobilizon'),
         'error'
       );
     }
@@ -70,7 +91,7 @@ class Settings {
 
   public static function register_settings_page() {
     add_options_page(
-      NICE_NAME . ' ' . __('Settings', TEXT_DOMAIN),
+      NICE_NAME . ' ' . __('Settings', 'connector-mobilizon'),
       NICE_NAME,
       'manage_options',
       NAME . '-settings',
@@ -85,15 +106,21 @@ class Settings {
     require dirname(__DIR__) . '/view/settings/page.php';
   }
 
+  public static function isShortOffsetNameShown() {
+    return get_option(self::$OPTION_NAME_IS_SHORT_OFFSET_NAME_SHOWN);
+  }
+
   public static function getUrl() {
     return get_option(self::$OPTION_NAME_URL);
   }
 
   public static function setDefaultOptions() {
+    add_option(self::$OPTION_NAME_IS_SHORT_OFFSET_NAME_SHOWN, self::$DEFAULT_IS_SHORT_OFFSET_NAME_SHOWN);
     add_option(self::$OPTION_NAME_URL, self::$DEFAULT_OPTION_URL);
   }
 
   public static function deleteAllOptions() {
+    delete_option(self::$OPTION_NAME_IS_SHORT_OFFSET_NAME_SHOWN);
     delete_option(self::$OPTION_NAME_URL);
   }
 

source/connector-mobilizon/readme.txt

@@ -14,13 +14,18 @@ License: <wordpress-license>
 
 <wordpress-nice-name> allows you to display the upcoming events of [Mobilizon](https://joinmobilizon.org/), which is a federated event listing platform, on your WordPress website.
 
-You can display the upcoming events using a widget and everywhere else using a shortcut.
+Features
+- Display events as widget and as shortcut
+- Display events' title, date, and location if available
+- Cache requests' responses for 2 minutes in the browser's `sessionStorage`
+- Configure number of events to show per widget and per shortcut
+- Optionally filter events by a specific group per widget and per shortcut
+- Set the URL of the Mobilizon instance in the settings
+- Toggle adding named offset in brackets after the time in the settings
 
 Shortcut format with limiting the number of events to show to 3 for example: `[<wordpress-name>-events-list events-count=3]`
 Optionally, you can only show the events of a specific group by indicatings its name: `[<wordpress-name>-events-list events-count=3 group-name="mygroup"]`
 
-The requests' responses are cached for 2 minutes in the browser's `sessionStorage`.
-
 The source code is available on [Github](https://github.com/dwaxweiler/connector-mobilizon).
 
 ## Screenshots
@@ -31,6 +36,41 @@ The source code is available on [Github](https://github.com/dwaxweiler/connector
 
 ## Changelog
 
+### [0.6.2] - 2021-08-24
+#### Changed
+- Update dependencies
+#### Fixed
+- Fix empty WordPress timezone_string option resulting in Invalid DateTime
+
+### [0.6.1] - 2021-07-13
+#### Changed
+- Confirm compatibility with WordPress 5.8
+- Update dependencies
+
+### [0.6.0] - 2021-06-02
+#### Added
+- Optionally display the current offset as short name after the time via the general plugin settings
+#### Changed
+- Update dependencies
+#### Fixed
+- Capitalise Mobilizon name in description
+
+### [0.5.0] - 2021-05-06
+#### Added
+- Localise dates based on the WordPress locale and time zone
+#### Changed
+- Clearly list features in `readme.txt` description
+- Update dev dependencies c8, eslint, gulp-replace, webpack
+#### Fixed
+- Improve translatability
+
+### [0.4.0] - 2021-04-20
+#### Added
+- Show events' location if set: `description` and `locality` fields
+- Plugin icon
+#### Changed
+- Update dev dependencies eslint, jsdom, webpack
+
 ### [0.3.0] - 2021-04-05
 #### Added
 - Donation link to WordPress Plugin Directory sidebar and to `package.json`

source/connector-mobilizon/view/events-list-widget/form.php

@@ -5,14 +5,14 @@ if (!defined('ABSPATH')) {
 }
 ?>
 <p>
-  <label for="<?php echo esc_attr($this->get_field_id('title')); ?>"><?php esc_attr_e('Title', $textDomain); ?>:</label> 
+  <label for="<?php echo esc_attr($this->get_field_id('title')); ?>"><?php esc_html_e('Title', 'connector-mobilizon'); ?>:</label>
   <input class="widefat" id="<?php echo esc_attr($this->get_field_id('title')); ?>" name="<?php echo esc_attr($this->get_field_name('title')); ?>" type="text" value="<?php echo esc_attr($title); ?>">
 </p>
 <p>
-  <label for="<?php echo esc_attr($this->get_field_id('eventsCount')); ?>"><?php esc_attr_e('Number of events to show', $textDomain); ?>:</label>
+  <label for="<?php echo esc_attr($this->get_field_id('eventsCount')); ?>"><?php esc_html_e('Number of events to show', 'connector-mobilizon'); ?>:</label>
   <input class="tiny-text" id="<?php echo esc_attr($this->get_field_id('eventsCount')); ?>" name="<?php echo esc_attr($this->get_field_name('eventsCount')); ?>" type="number" value="<?php echo esc_attr($eventsCount); ?>" min="1">
 </p>
 <p>
-  <label for="<?php echo esc_attr($this->get_field_id('groupName')); ?>"><?php esc_attr_e('Group name (optional)', $textDomain); ?>:</label> 
+  <label for="<?php echo esc_attr($this->get_field_id('groupName')); ?>"><?php esc_html_e('Group name (optional)', 'connector-mobilizon'); ?>:</label>
   <input class="widefat" id="<?php echo esc_attr($this->get_field_id('groupName')); ?>" name="<?php echo esc_attr($this->get_field_name('groupName')); ?>" type="text" value="<?php echo esc_attr($groupName); ?>">
 </p>

source/connector-mobilizon/view/events-list.php

@@ -6,7 +6,10 @@ if (!defined('ABSPATH')) {
 ?>
 <ul class="<?php echo esc_attr($classNamePrefix); ?>_events-list"
   data-url="<?php echo esc_attr($url); ?>"
+  data-locale="<?php echo esc_attr($locale); ?>"
   data-maximum="<?php echo esc_attr($eventsCount); ?>"
-  data-group-name="<?php echo esc_attr($groupName); ?>">
+  data-group-name="<?php echo esc_attr($groupName); ?>"
-  <li style="display: none;"><?php echo esc_html_e('The events could not be loaded!', $textDomain); ?></li>
+  data-time-zone="<?php echo esc_attr($timeZone); ?>"
+  <?php echo $isShortOffsetNameShown ? 'data-is-short-offset-name-shown' : ''; ?>>
+  <li style="display: none;"><?php esc_html_e('The events could not be loaded!', 'connector-mobilizon'); ?></li>
 </ul>

source/connector-mobilizon/view/settings/is-short-offset-name-shown-field.php

@@ -0,0 +1,13 @@
+<?php
+// Exit if this file is called directly.
+if (!defined('ABSPATH')) {
+  exit;
+}
+?>
+<input id="<?php echo esc_attr($args['label_for']); ?>"
+  name="<?php echo esc_attr(self::$OPTION_NAME_IS_SHORT_OFFSET_NAME_SHOWN); ?>"
+  type="checkbox"
+  <?php echo $isShortOffsetNameShown == true ? 'checked' : ''; ?>>
+<p class="description">
+  <?php esc_html_e('The time zone of this WordPress installation is used. Whether the current offset should be displayed in brackets after the time, e.g. 10:00 (UTC)', 'connector-mobilizon'); ?>
+</p>

source/connector-mobilizon/view/settings/url-field.php

@@ -10,5 +10,5 @@ if (!defined('ABSPATH')) {
   type="url"
   value="<?php echo esc_attr($url); ?>">
 <p class="description">
-  <?php esc_html_e('The URL of the Mobilizon instance whose events you want to list, e.g. https://example.net', $textDomain); ?>
+  <?php esc_html_e('The URL of the Mobilizon instance whose events you want to list, e.g. https://example.net', 'connector-mobilizon'); ?>
 </p>