# Referrals Window API

The Referrals Window API exposes public functions that can be called to setup or make configuration changes to referral to be displayed on the page.

## Properties

This is a list of all properties that can be set on the window API.

<table><thead><tr><th>Name</th><th width="249">Description</th><th>Sample</th></tr></thead><tbody><tr><td><code>window.okeReferralsApi.appStatus</code></td><td>The current load state of the Referrals widget on site.<br><br><code>'notRequested'</code> - no load for the referrals app has been attempted.<br><br><code>'requested'</code> - The referrals app initialisation has commenced.<br><br><code>'loaded'</code> - The app has been loaded and is ready to interact with whether the widget is visible or not.</td><td><code>'notRequested' | 'requested' | 'loaded'</code></td></tr><tr><td><code>window.okeReferralsApi.isEmbedded</code></td><td>A <code>boolean</code> value to indicate whether there is a Referrals Widget in the page markup as opposite to one that would be invoked as a pop-over/modal component.</td><td><code>true</code> | <code>false</code></td></tr><tr><td><code>window.okeReferralsApi.isModalOpen</code></td><td>A <code>boolean</code> value to indicate whether there is an open Referrals Widget in pop-over/modal component.</td><td><code>true</code> | <code>false</code></td></tr></tbody></table>

## Functions

### <mark style="color:blue;">openModal</mark>

Opens the Referrals Widget as a modal/pop-over on a given page. If a Referrals Widget is already embedded on the current page, the page will scroll down to the embedded Referrals Widget.

#### Example Usage

```javascript
window.okeReferralsApi.openModal();
```

#### Properties

Before calling `openModal`, you should check that `window.okeReferralsApi.appStatus` is `loaded`

### <mark style="color:blue;">closeModal</mark>

Closes an open Referrals Widget modal/pop-over on a given page. If a Referrals Widget is already embedded on the current page this action won't do anything as there is no modal/pop-over to close.

#### Example Usage

```javascript
window.okeReferralsApi.closeModal();
```

## Binding A Referrals Modal Open Action To An Element

We give merchants/engineers the ability to add a `data` attribute to elements within the DOM.

When the Okendo App Embed is enabled and the `data` attribute is present, any click on that given element will open a Referrals modal/pop-over.

#### Example Usage

```html
<button data-oke-open-referrals="">Open Referrals Widget In Modal/Pop-Over</button>
```
