Vividh Bharti Player

A responsive live radio player for OutSystems Reactive applications.

Features

- Play and pause Vividh Bharti live radio

- HLS stream support

- Volume control

- Responsive layout for desktop and mobile

- Playback status and error messages

- Suitable for iframe or reusable Web Block integration

Requirements

- OutSystems Reactive Web application

- Internet access to the radio stream

- `hls.js` loaded once in the application when HLS playback is required

Basic Usage

1. Add the player Web Block to your screen.

2. Set the stream URL if using a different station.

3. Set the container width to `100%`.

4. Avoid setting a fixed height on the parent container.

Configuration

| Property | Description | Example |

|---|---|---|

| `StreamUrl` | HLS audio stream URL | `https://example.com/live.m3u8` |

| `StationName` | Station display name | `Vividh Bharti` |

| `ProgramName` | Current program name | `Jai Mala` |

| `ProgramDetails` | Supporting description | `Hindi film music` |

| `InitialVolume` | Starting volume from 0 to 100 | `72` |

Responsive Settings

Use the following settings for the parent container:

```css

width: 100%;

height: auto;

min-height: 0;

```

For iframe usage, use:

```html

<iframe src="your-player-url" style="width:100%;height:170px;border:0" scrolling="no"></iframe>

```

Notes

- Some browsers support HLS natively; others require `hls.js`.

- The stream must allow browser access and CORS requests.

- Replace the sample station and program text with OutSystems variables or inputs.

- Do not load multiple copies of `hls.js` on the same page.