EventBanner.vue

This component displays the event banner on the welcome page. Depending on the content of the event the event banner is clickable and shows the run page of the run or a popup with the content of the event (image and or text)

📄 View source on GitHub

Used by

• /welcome

Functions

onIntersect

Called whenever the event banner component intersects with the viewport. Slide in effect on scrolling

Parameters:

• isIntersecting: - True if the component intersects with the viewport.

handleClick

Handles a click on the event banner. If the event contains only a run, redirects to the run page. If the event contains text and or image, shows the event information popup. If the event contains neither, does nothing.

getEventData

Fetches event banner data / information which is valid for the current date (when the user views the page) from the /event-banners endpoint if one exists

Parameters:

• currentDate: - run date in ISO format (YYYY-MM-DD)

Reactivity

hasEventText (computed)

Identifies if the event contains text or an image, which determines if the popup needs to be displayed

isClickable (computed)

Identifies if the event has only a headline (no run relation, image or text). If only headline, no click functionality is applied to the event banner