# Video Without Video Center

Source: https://dev.arcxp.com/video-center/developer-docs/video-without-video-center/

The video player can be leveraged directly without Video Center. This can be useful for running live streams, looping videos, an ad without a video, etc. Instead of using `powaBoot.js` and `powaDrive.js`, you’ll need `powa.js`. Each organization is assigned their own distribution for player scripts, so you’ll need to determine which domain to use. (e.g. `https://{your org id}.video-player.arcpublishing.com/prod/powa.js`)

## Examples

### Basic

```js
const powa = new PoWa({
    id: '#myPlayer',
    stream: 'https://example.com/video.mp4',
    ready: (payload) => {
        console.log('PoWa ready!', payload);
    },
    error: console.error,
    promo: {
        image: 'https://example.com/promo.png',
    },
});
```

### Live stream

Configuring a player as _live_ employs slightly different controls with buttons to skip forward and back but no scrubber nor time displayed.

```js
const powa = new PoWa({
    id: '#myPlayer',
    live: true,
    stream: 'https://example.com/video.mp4',
    ready: (payload) => {
        console.log('PoWa ready!', payload);
    },
    error: console.error,
    promo: {
        image: 'https://example.com/promo.png',
    },
});
```

**Looping video**

```js
const powa = new PoWa({
    id: '#myPlayer',
    loop: true,
    stream: 'https://example.com/video.mp4',
    ready: (payload) => {
        console.log('PoWa ready!', payload);

        const powa = payload.detail.powa;
        powa.on(PoWa.EVENTS.LOOP, event => console.log(`Loop: ${ event.loopCount }`));
    },
    error: console.error,
    promo: {
        image: 'https://example.com/promo.png',
    },
});
```

**Autoplay with ad**

```js
const adTag = 'https://pubads.g.doubleclick.net/gampad/ads?sz=640x480&iu=/124319096/external/single_ad_samples&ciu_szs=300x250&impl=s&gdfp_req=1&env=vp&output=vast&unviewed_position_start=1&cust_params=deployment%3Ddevsite%26sample_ct%3Dlinear&correlator=';
const powa = new PoWa({
    id: '#myPlayer',
    stream: 'https://example.com/video.mp4',

    ready: ({powa, autoplay, autoplayStatus}) => {
        console.log('PoWa ready!', powa);
        console.log('Autoplay setting:', autoplay);
        console.log('Autoplay status:', autoplayStatus);
    },
    error: console.error,

    promo: {
        image: 'https://example.com/promo.png',
    },

    autoplay: true,
    muted: true,

    ads: true,
    getAdTag: () => adTag,
});
```

**Just an ad (e.g. before launching a crossword puzzle or image gallery)**

```js
const blankVideo = 'https://{your org id}.video-player.arcpublishing.com/assets/tiny.mp4';
const adTag = 'https://pubads.g.doubleclick.net/gampad/ads?sz=640x480&iu=/124319096/external/single_ad_samples&ciu_szs=300x250&impl=s&gdfp_req=1&env=vp&output=vast&unviewed_position_start=1&cust_params=deployment%3Ddevsite%26sample_ct%3Dlinear&correlator=';
const powa = new PoWa({
    id: '#myPlayer',
    stream: 'https://example.com/video.mp4',

    ready: ({powa}) => {
        powa.on(PoWa.EVENTS.AD_END, () => {
            launchCrosswordPuzzle();
        })
    },
    error: console.error,

    promo: {
        image: 'https://example.com/promo.png',
    },

    ads: true,
    getAdTag: () => adTag,
});
```

### Ad Bar

To enable the [Ad Bar](https://dev.arcxp.com/video-center/developer-docs/advertising-and-the-video-center-player/), currently, you’ll need to configure it via PoWaSettings.

**Ad Bar**

```js
window.PoWaSettings = window.PoWaSettings || {};
window.PoWaSettings.advertising = window.PoWaSettings.advertising || {};
window.PoWaSettings.advertising.adBar = true;
```

**Ad Bar with custom skip offset**

```js
window.PoWaSettings = window.PoWaSettings || {};
window.PoWaSettings.advertising = window.PoWaSettings.advertising || {};
window.PoWaSettings.advertising.adBar = {
    skipOffset: 5,
};
```
