Rotating event banner #2061
Rotating event banner #2061
Conversation
src/_data/events.yaml
Outdated
| - type: "Webinar" | ||
| title: "Deploy FlowFuse on Industrial IoT with NCD.io" | ||
| buttonText: "Learn more" | ||
| link: "/webinars/2024/deploy-flowfuse-on-industrial-iot-with-ncd-io/" |
There was a problem hiding this comment.
Maybe we should add two timestamps. Not before, that is from what point we can show the banner, and and expire. That saves a bunch of hassle each month
There was a problem hiding this comment.
Great idea ZJ, thanks! I've included an expiration date field. Since we won't be adding events or announcements before the URL is created, I believe it's sufficient for the banner to start showing when the info it's added or updated. The crucial aspect is setting when it will disappear. WDYT?
| setTimeout(function() { | ||
| changeContainerColor(banners[currentBanner]); | ||
| }, 500); // wait for the slideDown animation to finish | ||
| }, 7000); |
There was a problem hiding this comment.
7 seconds isn't a lot imo, do we want to push this back?
There was a problem hiding this comment.
I've changed it to 10s
| @@ -6,6 +6,7 @@ on: | |||
| - main | |||
| schedule: | |||
| - cron: "30 9 * * *" | |||
| - cron: "5 16 * * 3,4" | |||
There was a problem hiding this comment.
Wednesday and Thursdays, the possible days for webinars
| title: "Deploy FlowFuse on Industrial IoT with NCD.io" | ||
| buttonText: "Learn more" | ||
| link: "/webinars/2024/deploy-flowfuse-on-industrial-iot-with-ncd-io/" | ||
| expire: "2024-05-29T16:00:00Z" |
|
|
||
| For example, `expire: "2024-05-29T15:00:00Z"` means that the event will stop being displayed on the banner at 16:00 UTC on May 29, 2024. | ||
|
|
||
| Please note that the website is built once a day at 9:30 AM UTC, and also on Wednesdays and Thursdays at 16:05 UTC. This means that if an event expires at some point during the day, it will still be displayed until the next time the website is built. |
There was a problem hiding this comment.
I'd just rebuild it every day at 16:00. This contains a bit too much business logic now tied to webinars.
There was a problem hiding this comment.
This is the only stuff i can complain about, so I'll merge as is @Yndira-E
Description
This PR adds a rotating banner feature to the website. Multiple events or announcements can now be displayed at the top of the website, rotating every few seconds. The events data is pulled from a YAML file and the rotation functionality is implemented in JavaScript.
Related Issue(s)
#1968
Checklist