From bc86f8e7c9d048599675ebf9ce52060334f582f5 Mon Sep 17 00:00:00 2001 From: Daniel Waxweiler Date: Wed, 5 May 2021 10:02:57 +0200 Subject: [PATCH] refactor --- .../front/events-displayer-test.js | 60 +++++++++++++++++++ .../front/events-displayer.js | 43 +++++++++++++ .../front/events-loader.js | 54 ++--------------- 3 files changed, 108 insertions(+), 49 deletions(-) create mode 100644 source/connector-mobilizon/front/events-displayer-test.js create mode 100644 source/connector-mobilizon/front/events-displayer.js diff --git a/source/connector-mobilizon/front/events-displayer-test.js b/source/connector-mobilizon/front/events-displayer-test.js new file mode 100644 index 0000000..ad7c2ec --- /dev/null +++ b/source/connector-mobilizon/front/events-displayer-test.js @@ -0,0 +1,60 @@ +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') + 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 12:30 - 17: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') +}) diff --git a/source/connector-mobilizon/front/events-displayer.js b/source/connector-mobilizon/front/events-displayer.js new file mode 100644 index 0000000..9c2de89 --- /dev/null +++ b/source/connector-mobilizon/front/events-displayer.js @@ -0,0 +1,43 @@ +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 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 }) + 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' +} diff --git a/source/connector-mobilizon/front/events-loader.js b/source/connector-mobilizon/front/events-loader.js index 64f45d2..52f8af6 100644 --- a/source/connector-mobilizon/front/events-loader.js +++ b/source/connector-mobilizon/front/events-loader.js @@ -1,52 +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 = '' -function displayEvents(data, list) { - const locale = list.getAttribute('data-locale') - 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({ 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 }) - 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) { @@ -55,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)) - .catch((data) => displayErrorMessage(data, list)) + .then((data) => displayEvents({ data, document, list })) + .catch((data) => displayErrorMessage({ data, list })) } else { GraphqlWrapper.getUpcomingEvents({ url, limit }) - .then((data) => displayEvents(data, list)) - .catch((data) => displayErrorMessage(data, list)) + .then((data) => displayEvents({ data, document, list })) + .catch((data) => displayErrorMessage({ data, list })) } } })