diff --git a/public/index.html b/public/index.html new file mode 100644 index 0000000..a6926ec --- /dev/null +++ b/public/index.html @@ -0,0 +1,51 @@ + + + + + + + Trip Schedule + + + + + + +
+

Trip Schedule

+
+ +
+
+ + + + + + + + diff --git a/public/script.js b/public/script.js new file mode 100644 index 0000000..c11d86d --- /dev/null +++ b/public/script.js @@ -0,0 +1,66 @@ +const cardTemplate = document.getElementById('event-card'); +const eventsContainer = document.getElementById('events-container'); +const mainContainer = document.getElementById('container'); + + +async function main() { + const query = { + sort: 'start', + }; + + const stringifiedQuery = Qs.stringify({ + ...query + }, + { + addQueryPrefix: true + } + ); + + const events = await (await fetch(`/api/events${stringifiedQuery}`)).json(); + + let currentDate; + let currentContainer; + + for (const event of events.docs) { + if (currentDate !== event.startDate) { + currentContainer && mainContainer.append(currentContainer); + + const c = eventsContainer.content.cloneNode(true); + + c.querySelector('.events-container-title').innerText = event.startDate; + + currentContainer = c; + } + + currentDate = event.startDate; + + const card = cardTemplate.content.cloneNode(true); + + card.querySelector('.event-name').innerText = event.name; + + const typeElem = card.querySelector('.event-type'); + typeElem.innerText = event.type.value.name; + typeElem.style.backgroundColor = event.type.value.backgroundColour; + + card.querySelector('.event-date .event-start').innerText = event.startDate; + card.querySelector('.event-time .event-start').innerText = event.startTime; + + if (event.end) { + if (event.endDate !== event.startDate) { + card.querySelector('.event-date .event-end').innerText = event.endDate; + card.querySelector('.event-date .event-time-seperator').style.display = 'inline'; + } + + card.querySelector('.event-time .event-end').innerText = event.endTime; + card.querySelector('.event-time .event-time-seperator').style.display = 'inline'; + } + + card.querySelector('a.event-link').setAttribute('href', event.id); + + currentContainer.querySelector('.grid').append(card); + } + + currentContainer && mainContainer.append(currentContainer); +} + +main(); diff --git a/src/server.ts b/src/server.ts index 9e76391..39fbeff 100644 --- a/src/server.ts +++ b/src/server.ts @@ -1,9 +1,10 @@ import * as dotenv from 'dotenv'; import express from 'express'; +import path from 'path'; import payload from 'payload'; -import findEventsOnDay from './helpers/findEventsOnDay'; +// import findEventsOnDay from './helpers/findEventsOnDay'; dotenv.config(); @@ -30,18 +31,6 @@ payload.init({ } }); -app.get('/', async (req, res) => { - const docs = await payload.find({ - collection: 'events', - sort: 'startTime', - pagination: false - }); - - res.json(docs); -}); - -app.get('/day/:day', async (req, res) => { - res.json(await findEventsOnDay(payload, req.params.day)); -}); +app.use(express.static(path.join(__dirname, '../public'))); app.listen(process.env.LISTEN_PORT);