# Matchday Media Widget

A 1152 × 648 (16:9) OBS browser widget for cycling locally stored matchday graphics, announcements, sponsor videos, and other media.

## Add media

1. Copy images and videos into the `media` folder.
2. Open `widget.js` and edit `MEDIA_ITEMS`.

Image example:

```javascript
{
    type: "image",
    src: "media/matchday.png",
    label: "MATCHDAY",
    duration: 10000,
    fit: "contain"
}
```

Video example:

```javascript
{
    type: "video",
    src: "media/promo.mp4",
    label: "TEAM PROMO",
    fit: "contain",
    muted: true
}
```

- Images advance after `duration` milliseconds.
- Videos advance when playback ends.
- Use `contain` to show the entire asset or `cover` to fill the panel and allow cropping.
- MP4 with H.264 video is the safest format for OBS browser sources.

## OBS browser source

- URL: `http://localhost/StreamOverlayNew/MediaWidget/`
- Width: `1152`
- Height: `648`
- FPS: `60`
