Event Card

A single-event card — a competition header over the two competitors and their kickoff time, live score, or final result. Team sports show one score column; tennis shows a per-set breakdown with an expandable scoreboard. Live events auto-refresh. Sport-agnostic: it adapts its status labels and score layout to whichever sport the Sports API returns (football, basketball, tennis, ice hockey, American football, …).

<div data-component="fu-widget" data-content-type="event-card" data-content-id="fb:m:12345"></div>

Configuration Attributes

Attribute	Description	Options/Format	Default
`data-content-id`	Event ID	e.g. `"fb:m:12345"`	Required
`data-event-card-template`	Visual density of the card	`"compact"`, `"standard"`, `"hero"`	`"standard"`
`data-event-card-type`	Kind of card. `"detailed"` is reserved (not implemented yet)	`"header"`, `"detailed"`	`"header"`
`data-event-card-show-competition`	Show the competition header above the competitors	`"true"`, `"false"`	`true`
`data-event-card-show-odds`	Render betting odds. Not yet backed by the API, so currently renders nothing	`"true"`, `"false"`	`true`
`data-event-card-live-refresh`	Poll the events API while the event is `LIVE` so scores/status stay current	`"true"`, `"false"`	`true`
`data-event-card-refresh-interval`	Live-refresh poll interval in milliseconds. Only applies while `LIVE`	Positive integer	`30000` (30s)

Templates

data-event-card-template picks the visual prominence of the same card — it does not change what data is shown.

Value	Layout
`"compact"`	Livescore-style row: time/status on the left, competitors stacked on the right with a single score column (team sports) or per-set grid (tennis)
`"standard"` (default)	Competitors flank a central kickoff time / score, each crest beside its name
`"hero"`	Large card — crest stacked over each name, score/time centered in an inset panel with a live accent bar

<div data-component="fu-widget" data-content-type="event-card" data-content-id="fb:m:12345" data-event-card-template="hero"></div>

Card Type

Value	Behavior
`"header"` (default)	The condensed event card (competition header + competitors + time/score). The only kind implemented today
`"detailed"`	A richer event view (lineups, stats, timeline). Reserved, not implemented yet — passing it has no effect; the header card renders regardless

Live Refresh

When data-event-card-live-refresh is true (default) and the event is LIVE, the card re-fetches on data-event-card-refresh-interval so the score/status stay current. Only live events poll — upcoming and finished events are fetched once. Set data-event-card-live-refresh="false" to disable polling.

Global Configuration

Set defaults for all Event Card widgets in FuWidget.init():

FuWidget.init({
	// ... other config
	eventCard: {
		template: "standard", // Optional: "compact", "standard" (default), or "hero"
		showCompetition: true, // Optional: show the competition header (default: true)
		liveRefresh: true, // Optional: poll while the event is LIVE (default: true)
		refreshInterval: 30000, // Optional: live-refresh interval in ms (default: 30000)
	},
});

Examples

Compact Livescore Row

<div data-component="fu-widget" data-content-type="event-card" data-content-id="fb:m:12345" data-event-card-template="compact"></div>

Finished Event, No Live Polling

<div data-component="fu-widget" data-content-type="event-card" data-content-id="fb:m:12345" data-event-card-live-refresh="false"></div>

Features

Three visual templates — compact (livescore row), standard (crest beside name flanking the score/time), hero (large stacked crest-over-name in an inset panel with a live accent bar)
Sport-aware status labels — upcoming / live / finished / cancelled, with a clock-vs-tennis finished label (FT vs Finished)
Tennis per-set scoreboard with tiebreak superscripts, collapsed by default and expandable
Live auto-refresh while the event is LIVE, on a configurable interval
Contained load-failed / not-available states that never break the host layout