# Javascript

### Installation

To install the `ConnectFramework` JavaScript SDK:

If using in a browser, you can include it via a script tag:

```html
<script src="https://cdn.connect.ai/sdk/v1.0.js"></script>
<script>
    const ConnectFramework = window.ConnectFramework;
</script>
```

***

### Usage

#### Initializing the SDK

Before making any API calls, initialize the SDK with your API key.

```javascript
// Initialize the SDK with an API key
ConnectFramework.initialize("your_api_key_here");
```

***

### User Authentication

#### Logging in with a Unique ID

Logs the user in with a unique ID. If `uniqueId` is `null`, a unique ID will be created automatically. The callback is executed upon completion.

```javascript
ConnectFramework.login(null, function(success) {
    if (success) {
        console.log("User logged in successfully.");
    } else {
        console.log("Login failed or was cancelled.");
    }
});
```

#### Logging Out

Logs the user out entirely.

```javascript
ConnectFramework.logout();
```

#### Checking if User is Connected

Returns `true` if the user is logged in and running the Connect.ai desktop client.

```javascript
const isConnected = ConnectFramework.isConnected();
console.log("User is connected:", isConnected);
```

***

### Paywall Management

#### Creating a Paywall

Creates and presents a new paywall. The callback receives two parameters:

* `success` (`boolean`): `true` if the user completed a purchase, `false` otherwise.
* `productId` (`string | null`): The product ID if a purchase occurred, otherwise `null`.

```javascript
ConnectFramework.createPaywall(function(success, productId) {
    if (success) {
        console.log("User purchased product:", productId || "Unknown");
    } else {
        console.log("User did not complete the purchase.");
    }
});
```

#### Setting Extra JSON Data

(Optional) Configures the user JSON settings used by the paywall.

```javascript
const extraSettings = JSON.stringify({ custom_key: "custom_value" });
ConnectFramework.setExtraJson(extraSettings);
```

#### Checking if User has Purchased

Returns `true` if the user has already made a purchase. Avoid presenting a paywall if this returns `true`.

```javascript
const hasPurchased = ConnectFramework.hasPurchased();
console.log("User has purchased:", hasPurchased);
```

***

### Analytics Tracking

#### Logging an Event

Logs an analytics event with a category and action.

```javascript
ConnectFramework.logEvent("user_action", "button_click");
```

#### Logging an Event with Additional Data

Logs an analytics event with a category, action, label, and numerical value.

```javascript
ConnectFramework.logEventWithDetails("user_action", "purchase", "premium_upgrade", 29.99);
```