SDK Integration - Web

Copy and paste this prompt into your AI assistant to accelerate your integration:

		
# Prompt: indigitall Web Push SDK Integration

Copy this prompt into your AI assistant (GitHub Copilot, ChatGPT, etc.) to get guided through integrating the indigitall Web Push SDK into your website.

---

Act as an expert engineer in indigitall Web Push SDK integration. Your goal is to help me integrate web push notifications into my site, generating the final code adapted to my answers.

## Step 0 — Preliminary questions (REQUIRED)

Before generating any code, ask me these questions one by one and wait for my answers:

1. **What is your appKey?**
   It's a string (UUID) provided by indigitall. If you don't have it, contact indigitall to get one.
2. **Do you want to request location permissions from users?**
   It's optional, but can be useful for sending location-based notifications.
3. **What path on your website will you use to host `sdk.min.js` and `worker.min.js`?**
   If you've moved them to a folder other than the root, indicate both paths here (e.g. `/indigitall/sdk.min.js` and `/indigitall/worker.min.js`).
4. **Do you want Safari browser compatibility?**
   It's optional, but required for Safari users to receive push notifications (requires a special permission requested via a floating button).
5. **(Optional) Are you using an indigitall private cloud?**
   If so, provide your Device API URL. Otherwise, the default URL will be used.

## Step 1 — Download the SDK

Tell me to download the latest version of the SDK (a `.zip` containing `sdk.min.js` and `worker.min.js`) from:

https://documentation.indigitall.com/reference/sdk-setup#download-sdk

I need to unzip it and upload both files to my web server, at the path I indicated in question 3.

> Important: `worker.min.js` must be served from the same domain as the website (it is a Service Worker) and, preferably, from the root or a path with sufficient scope.

## Step 2 — Import the SDK in the page

Add the script to the HTML (adjust the path according to my answer):

```html

```

## Step 3 — Generate the integration code

Generate the following code applying these rules based on my answers:

- **Location**: if I answered NO to requesting location permissions, remove `requestLocation`, `onLocationPermissionChanged`, `onLocationUpdated` and the `onLocationUpdated` and `requestLocationPermission` functions.
- **Safari**: if I answered NO to Safari compatibility, remove the entire Safari floating button block.
- **Private cloud**: include `urlDeviceApi` only if I provided a private cloud URL; otherwise, remove that line.
- Replace `APPKEY` with my appKey and `workerPath` with the actual path of my `worker.min.js`.

Base code:

```javascript
function onIndigitallLoaded() {
    // Safari compatibility: requires a special permission requested
    // via user interaction (floating button).
    // ONLY include if the client wants Safari support.
    if (indigitall.isSafariPushNotificationSupported() && !localStorage.getItem('indigitall.repository.PUSH_TOKEN')) {
        var button = document.createElement("span");
        button.innerHTML = `

            
                
            
            
`;
        document.getElementsByTagName("body")[0].appendChild(button);
    }

    // SDK initialization
    indigitall.init({
        appKey: "YOUR_APP_KEY", // appKey provided by indigitall
        urlDeviceApi: "DEVICE_API_URL", // ONLY for private cloud; remove if using the default URL
        workerPath: "/indigitall/worker.min.js", // worker path; if omitted, assumes the same folder as sdk.min.js
        requestLocation: true, // ONLY if location permissions are desired; remove otherwise
        logLevel: indigitall.LogLevel.DEBUG, // use ERROR or remove in production
        onInitialized: onIndigitallInitialized,
        onNewUserRegistered: onNewUserRegistered,
        onLocationPermissionChanged: requestLocationPermission, // ONLY with location; remove otherwise
        onLocationUpdated: onLocationUpdated, // ONLY with location; remove otherwise
        onError: onError,
    });
}

async function onIndigitallInitialized(permissions, device) {
    console.log("Push Permission: ", permissions.push);
    console.log("Location Permission: ", permissions.location);
    console.log("Device:", device);
}

function onNewUserRegistered(device) {
    // The user just accepted notifications
    console.log("Device onNewUserRegistered:", device);
}

// ONLY with location; remove otherwise
function onLocationUpdated(location) {
    console.log("Location
 \t - Latitude:" + location.coords.latitude + "
 \t - Longitude: " + location.coords.longitude);
}

function onError(error) {
    console.log(error);
}

// ONLY with location; remove otherwise
function requestLocationPermission(permission) {
    console.log("RequestLocationPermission:", permission.state);
}
```

## Step 4 — Verification

Guide me to verify the integration is working:

1. Serve the website over **HTTPS** (or `localhost` in development); Service Workers do not work over HTTP.
2. Open the website, accept the notification permission and check the console for logs from `onIndigitallInitialized` and `onNewUserRegistered`.
3. Verify in DevTools → Application → Service Workers that `worker.min.js` is registered.
4. Confirm the device appears registered in the indigitall console and send a test notification.

## Official documentation

For more details and advanced configuration options, refer to the official documentation:

https://documentation.indigitall.com/reference/initial-sdk-setup-2

> ⚠️ AI can make mistakes. Always verify everything it does before treating it as valid.