# Poductivity Client

A web component to bring Poductivity interaction to your own podcast player.

<!-- Auto Generated Below -->


## Properties

| Property           | Attribute           | Description                                                                                                                                                                               | Type                                  | Default                                                  |
| ------------------ | ------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------- | -------------------------------------------------------- |
| `audioElement`     | --                  | Pass a reference to a <audio> element to have the client attach the necessary listeners and perform control action for you                                                                | `HTMLAudioElement`                    | `undefined`                                              |
| `data`             | --                  | Pass in a data object to use instead of contacting the API server For internal/debug use only                                                                                             | `PdData`                              | `null`                                                   |
| `debug`            | `debug`             | Enable debug mode. Shows a status panel in the client and adds extra console logging. For internal use only                                                                               | `boolean`                             | `false`                                                  |
| `deviceIdentifier` | `device-identifier` | If integrating into an app, pass the device's native advertising ID here. If integrating into a web app, the client will handle generation and persistence of a device identifier for you | `string`                              | `undefined`                                              |
| `isPlaying`        | `is-playing`        | If not using the audioElement prop, pass the current playback state here                                                                                                                  | `boolean`                             | `undefined`                                              |
| `messagesElement`  | --                  | Optionally supply a <poductivity-messages> element positioned anywhere in the DOM. Will show in this element otherwise                                                                    | `HTMLPoductivityMessagesElement`      | `null`                                                   |
| `noSubscribe`      | `no-subscribe`      | Use to disable the standard Poductivity subscribe behaviour if you wish to capture and handle the subscribeToFeed event yourself                                                          | `boolean`                             | `false`                                                  |
| `optOutControl`    | --                  | Optionally supply a <poductivity-opt-out-control> element positioned anywhere in the DOM. Will show inside this element otherwise                                                         | `HTMLPoductivityOptOutControlElement` | `null`                                                   |
| `playbackRate`     | `playback-rate`     | If not using the audioElement prop, pass the current playback rate here                                                                                                                   | `number`                              | `1`                                                      |
| `timestamp`        | `timestamp`         | If not using the audioElement prop, pass the current audio timestamp here                                                                                                                 | `number`                              | `undefined`                                              |
| `userAgent`        | `user-agent`        | The User Agent your app uses. Only necessary when integrating into an app with a custom user agent. Will use the current browser's user agent if available.                               | `string`                              | `window?.navigator?.userAgent \|\| 'Poductivity-Client'` |


## Events

| Event                      | Description                                                                                                                              | Type                                    |
| -------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------- |
| `audioControl`             | Emitted when an action requests a change to audio control. Only required if not using the audioElement prop                              | `CustomEvent<AudioControlEventData>`    |
| `loadedEpisodeData`        | Emitted when the episode data is loaded                                                                                                  | `CustomEvent<LoadedEpisodeData>`        |
| `loadingEpisodeData`       | Emitted when the episode data is about to load                                                                                           | `CustomEvent<void>`                     |
| `loadingEpisodeDataFailed` | Emitted if the episode data fails to load                                                                                                | `CustomEvent<LoadingEpisodeDataFailed>` |
| `openExternalUrl`          | Emitted when an action requests to open a URL in a new window. Only required when integrating into an app that won't support window.open | `CustomEvent<OpenExternalUrlData>`      |
| `performAction`            | Emitted when an action is performed Only required if you want your app to also perform an action as a result                             | `CustomEvent<PerformActionData>`        |
| `subscribeToFeed`          | Emitted when an action requests to subscribe to a feed. Only required when wishing to override the default modal                         | `CustomEvent<FeedSubscribeData>`        |


## Methods

### `close() => Promise<void>`

If integrating into an app, call this before destroying
the webview to allow the client to flush it's caches.
If integrating into the web, the client handles this itself
using the Browser Visibility API

#### Returns

Type: `Promise<void>`



### `isReady() => Promise<boolean>`

Is the client ready?

#### Returns

Type: `Promise<boolean>`



### `setEpisodeByFeed(feedUrl: string, episodeGuid: string) => Promise<void>`

Set the current episode by feed URL and episode GUID.

#### Returns

Type: `Promise<void>`



### `setEpisodeById(episodeId: string) => Promise<void>`

Set the current episode by Poductivity Episode ID

#### Returns

Type: `Promise<void>`




## Dependencies

### Used by

 - [poductivity-player](../pd-player)

### Depends on

- [poductivity-messages](../pd-messages)
- [poductivity-modal](../pd-modal)
- [poductivity-subscribe](../pd-subscribe)
- [poductivity-opt-out-control](../pd-opt-out-control)

### Graph
```mermaid
graph TD;
  poductivity-client --> poductivity-messages
  poductivity-client --> poductivity-modal
  poductivity-client --> poductivity-subscribe
  poductivity-client --> poductivity-opt-out-control
  poductivity-messages --> poductivity-marquee
  poductivity-subscribe --> poductivity-modal
  poductivity-player --> poductivity-client
  style poductivity-client fill:#f9f,stroke:#333,stroke-width:4px
```

----------------------------------------------

Copyright Poductivity Limited, All Rights Reserved