Introduction

The @elevista.ai/client package is a JavaScript library designed to simplify the process of capturing user interactions and events on your website. It works seamlessly with Elevista's AI-powered Audience Growth Platform to provide deeper insights into user behavior and enhance your content's reach and conversion rates.

Benefits of Using @elevista.ai/client

• Capture Comprehensive User Events: Go beyond the limitations of the core Elevista script by capturing complex events like signup, signin, sign out, and more.
• Streamlined Integration: Easily integrate with your existing Elevista setup.
• Enhanced Reporting: Generate detailed reports on website user interactions, enabling data-driven decisions and content optimization.
• Enhanced Developer Experience: The package is written in TypeScript, providing type safety and improved code maintainability for developers.

Installation

• Install the package using npm or yarn:

npm install @elevista.ai/client

yarn add @elevista.ai/client

• Import the library into your JavaScript code:

import ElevistaAIClient from '@elevista.ai/client';

Sending Events

@elevista.ai/client offers two flexible methods to send user interaction events:

• Caution: Both methods require the Elevista core script to be loaded. Make sure to add the following script tag to your HTML file before using the @elevista.ai/client package:

 <script src="https://core.elevista.ai/core/tracking/index.js" crossorigin="*"></script>

Method 1: Utilizing the Global elevistaAIClient Object (No Installation Required)

1. Window Object Check: Ensure the elevistaAIClient object exists on the global window object before proceeding.

if (typeof window !== 'undefined' && window.elevistaAIClient) {
    // Proceed with sending events
} else {
    console.warn(`
        Elevista Ai Client is not available.
        Please ensure the Elevista core script is loaded.
        <script src="https://core.elevista.ai/core/tracking/index.js" crossorigin="*"></script>
    `)
}

2. Sending Events: Use the events object provided by the elevistaAIClient object to send event functions:

window.elevistaAIClient.events.signup({
    userId: '12345', // Optional user ID
    email: '[email protected]' // Optional user email
});

Method 2: Using the Installed Package (@elevista.ai/client)

1. Import Section:

import ElevistaAIClient from '@elevista.ai/client';

2. Sending Events: Use the events object provided by the elevistaAIClient object to send event functions:

elevistaAIClient.events.signup({
    userId: '12345', // Optional user ID
    email: '[email protected]' // Optional user email
});

Supported Events (with Input Types)

common events typically include: | Event Name | Description | Input Type (where applicable) | | :-------- | :---------: | ----------: | | signup | User signs up for an account | {userId?:string, email?:string} | | signin | User signs in to an account | {userId?:string, email?:string} | | signOut | User signs out of an account | | | setVideoInformation | Page of a video | { downloadURL: string; title: string; lengthInSecond: number; description?: string;} |

Additional Considerations

• Refer to Elevista's documentation or support for granular control over event properties.
• Implement error handling mechanisms to gracefully manage potential issues.

Conclusion

The @elevista.ai/client package empowers you to capture a wider range of user interactions and events on your website. This enriched data, combined with Elevista's AI platform, equips you with valuable user insights to optimize your content strategy for better engagement and conversions. Additionally, the TypeScript foundation provides a more robust and maintainable codebase for developers.