# Config

This script integrates the **Clinch SDK** into your web app, enabling secure communication between your parent window and the embedded iframe. Below is a brief overview of the **callbacks** and **configuration**.

## **Configuration Object (`config`)**

The `config` object passed to `loadClinch` contains settings that control the behaviour of the Clinch web app.

```typescript
const config = {
    operatorId: 'your_operator_id',
    gameId: "solitaire",
    clinchUrl: "http://embed-sandbox.clinch.gg",
    companyName: "your company name",
    language: "en",
    paymentType: "lightning",
    showSats: true,
    lightningAddress: "user@company.com",
    logging: true,
};
```

* **`operatorId`**: This ID will be provided to you by THNDR
* **`gameId`**: 'solitaire' or 'blocks'
* **`clinchUrl`**: This is the URL for the clinch iframe. This will be provided by THNDR for sandbox (embed-sandbox.clinch.gg) and production (embed.clinch.gg) environments.
* **`companyName`**: This is your company name that will be shown by the users balance of their wallet on your platform.
* **`language`**: Two-letter country code. If language is not supported, defaults to english.
* **`paymentType`**: This must be 'lightning'.
* **`showSats`**: The iframe shows balances in USD. If you want to show a satoshi balance as well, set this to `true`.
* **`lightningAddress`**: The users lightning address that their winnings are sent to
* **`logging`**: When set to `true`, this enables debug mode, allowing additional logging in the console for troubleshooting.

## **Callbacks**

The SDK requires four key callback functions, each responsible for handling specific actions within the Clinch web app.

1. **`getToken`**: Retrieves the authentication token for the user.
2. **`getBalance`**: Returns the current balance for the user.
3. **`onPayInvoice`**: You will receive a bolt11 invoice, which you should pay from your users wallet balance.

## **Example Code Overview**

The code integrates the **Clinch SDK** with the specified configuration and callbacks:

```html
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Clinch</title>
  </head>
  <body>
    <iframe src="http://embed-sandbox.clinch.gg" style="position:fixed; top:0; left:0; bottom:0; right:0; width:100%; height:100%; border:none; margin:0; padding:0; overflow:hidden; z-index:999999;">
        Your browser doesn't support iframes
    </iframe>
    <script type="module">
      import { loadClinch } from './clinch-sdk.js';
    
      const config = {
        operatorId: "operator_id",
        gameId: "soltaire"
        clinchUrl: "http://embed-sandbox.clinch.gg",
        companyName: "some company",
        language: "en",
        paymentType: "lightning",
        showSats: true,
        logging: true,
      };
    
      function async getToken() {
        console.log("Clinch SDK: Get the server to server thndr authentication token");
        return "eyJhbGciOiJSUzI1NiIsInR5cC...";
      }
    
      function async getBalance() {
        return {
          balance: 100, // $1.00
          currency: "cents", // Must be either - sats, btc, or cents (USD)
        };
      }
    
      function async onPayInvoice(invoice) {
        console.log("Pay invoice", invoice);
      }
    
      loadClinch(
        config,
        getToken,
        getBalance,
        onPayInvoice
      );
    </script>
  </body>
</html>
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.thndr.io/integration/lightning-iframe/config.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
