diff --git a/index.html b/index.html index bee4095..8a74fec 100644 --- a/index.html +++ b/index.html @@ -19,17 +19,17 @@ -
+

Events Happening Now

-
+

-
+

Events Happening Next

-
+
diff --git a/plugin-api.js b/plugin-api.js index 7b65781..d000462 100644 --- a/plugin-api.js +++ b/plugin-api.js @@ -16,8 +16,6 @@ grist.onRecords(function (records) { var i = 0; - console.info(records); - for (const r of records) { let privacy = r["video_privacy"]; let videoNeeded = r["Video_team_attending"]; @@ -50,10 +48,8 @@ grist.onRecords(function (records) { return (e1.timeUntilStart() > e2.timeUntilStart()) ? 1 : ((e2.timeUntilStart() > e1.timeUntilStart()) ? -1 : 0) }); - console.log(eventsOnNext); - - populateList("happeningNow", eventsOnNow); - populateList("happeningNext", eventsOnNext); + populateList("happeningNow", eventsOnNow, false); + populateList("happeningNext", eventsOnNext, true); window.setInterval(() => handleCountdown(), 1000); }); @@ -99,21 +95,15 @@ function makeTextBold(text) { function convertTimeToString(time) { // Using getHours() is bullshit for this usage, it won't include any days in the hours let hours = Math.floor(time / (1000 * 60 * 60)); - if (hours < 10) { - hours = "0" + hours - } - let minutes = time.getMinutes(); - if (minutes < 10) { - minutes = "0" + minutes - } - return hours + ":" + minutes; + + return hours + " hours, " + minutes + " minutes"; } -function populateList(elementName, items) { +function populateList(elementName, items, getStartsIn) { for (const i of items) { const col = document.createElement("div"); - col.setAttribute("class", "col-sm-12 col-bg-12") + col.setAttribute("class", "col-sm-12 col-md-3") const card = document.createElement("div"); card.setAttribute("class", "card m-3") @@ -131,21 +121,32 @@ function populateList(elementName, items) { var videoNeeded = document.createElement("ul"); var privacy = document.createElement("ul"); var comments = document.createElement("ul"); - var startsIn = document.createElement("ul"); + + var timer = document.createElement("ul"); venue.setAttribute("class", "list-group-item"); videoNeeded.setAttribute("class", "list-group-item"); privacy.setAttribute("class", "list-group-item"); comments.setAttribute("class", "list-group-item"); - startsIn.setAttribute("class", "list-group-item"); - - startsIn.setAttribute("id", i.id + "_time"); venue.innerHTML = "Venue: " + i.venue; videoNeeded.innerHTML = "Video Team Present: " + i.videoNeeded; privacy.innerHTML = "Privacy: " + i.privacy; comments.innerHTML = "Comment: " + i.comments; - startsIn.innerHTML = "Starts In: " + convertTimeToString(i.timeUntilStart()) + "(" + i.startTime.toLocaleString("en-GB", { timeZone: "UTC" }) + ")"; + + timer.setAttribute("class", "list-group-item"); + timer.setAttribute("id", i.id + "_time"); + if (getStartsIn) { + timer.innerHTML = "Starts In: " + convertTimeToString(i.timeUntilStart()) + " (" + new Date(i.startTime).toLocaleString("en-GB", { timeZone: "UTC" }) + ")"; + + // Red border if show starts in 15 minutes + if (i.timeUntilStart() <= 15 * 60 * 1000){ + card.setAttribute("class", "card m-3 border border-5 border-danger"); + timer.setAttribute("class", "list-group-item text-danger"); + } + } else { + timer.innerHTML = "Ends In: " + convertTimeToString(i.timeUntilEnd()) + " (" + new Date(i.endTime).toLocaleString("en-GB", { timeZone: "UTC" }) + ")"; + } list.appendChild(venue); list.appendChild(videoNeeded); @@ -153,7 +154,7 @@ function populateList(elementName, items) { if (i.comments) { list.appendChild(comments); } - list.appendChild(startsIn); + list.appendChild(timer); // Colour in any rows if (i.privacy != "public") { @@ -168,7 +169,6 @@ function populateList(elementName, items) { if (i.comments) { comments.setAttribute("class", "list-group-item bg-info"); - console.log(i.comments); comments.innerHTML = makeTextBold(comments.innerHTML); } @@ -186,28 +186,11 @@ function populateList(elementName, items) { } } -function refreshTables() { - var toDelete = []; - - now = Date.now(); - for (const nowItem of eventsOnNow) { - let timeUntilEnd = nowItem.timeUntilEnd(); - - let timeField = document.getElementById(nowItem.id + "_time"); - timeField.innerHTML = convertTimeToString(nowItem.timeUntilEnd()); - } - - for (const nextItem of eventsOnNext) { - let timeField = document.getElementById(nextItem.id + "_time"); - timeField.innerHTML = convertTimeToString(nextItem.timeUntilEnd()); - } -} - function handleCountdown() { countdown--; if (countdown == 0) { countdown = MAX_COUNTDOWN; - window.reload(); + window.location.reload(); } let counterElement = document.getElementById("counter");