Skip to content

quickstart.mdx

Latest commit

 

History

History
180 lines (148 loc) · 4.9 KB

quickstart.mdx

File metadata and controls

180 lines (148 loc) · 4.9 KB
title Quickstart
description Start building realistic AI interactions in minutes

Setup

Let's get you started building your first AI interaction in minutes in javascript.

If you prefer to jump right into the code instead, you can clone our [starter repo](https://github.com/Diarupt/examples)

Get your API key

You will need an API key to authenticate your requests to our API and to use our SDKs. You can find your API keys on your dashboard.

If you don't have an account yet, you can request access [here](https://beta.diarupt.ai/early-access) and we'll send you an invite as soon as possible.

Install the SDK

Get the javascript SDK from npm or yarn.

npm install diarupt
yarn add diarupt

Add a video element

Add a video element to your html that would be used to display the AI's video feed.

...
<video id="ai-video" autoplay playsinline></video>
...

Create an interaction session

You would need to create a session. A session is used to preconfigure your interaction before connecting to the AI and allows you to continue conversations across multiple interactions.

  import axios from 'axios';

  const options = {
      /**
       * full list of available profiles can be retrieve 
       * from /faces endpoint.
       * see https://docs.diarupt.ai/api-reference/resources/get-profiles
       *  */
      profile: 'default',
      /**
       * full list of available faces can be retrieve 
       * from /faces endpoint.
       * see https://docs.diarupt.ai/api-reference/resources/get-faces
       *  */
      face: 'obama',
      context: 'Teach user everything you know about programmable matter',
  }

  const createSession = async () => {
    const res = await axios.post(
      DIARUPT_API + '/create-session',
      options,
      {
          headers: {
              'Content-Type': 'application/json',
              // TODO: Replace with your API key
              "x-api-key": 'dev-test'
          }
    })

    return res.data.session_id;
  }
In production, you should make the session request from your backend to avoid exposing your API key.

Connect to the AI

In order to connect to the AI, you would need to provide:

  • the session id
  • the video element that would be used to display the AI's video feed.
  • your own audio stream to enable the AI to hear you and respond.
  import {connect} from 'diarupt';
  import {createSession} from './session';

  (async() => {
    const session_id = await createSession();
    const ai_feed = document.getElementById('ai-video');
    // get the user's audio stream
    const stream = await navigator.mediaDevices.getUserMedia({
     audio: {
          echoCancellation: true,
          noiseSuppression: true,
          autoGainControl: false,
      },
    });

    // starts the interaction
    await connect(
      session_id,
      {
          stream,
          player: ai_feed, // video element
      }, (event, data) => {
          // handle events
          switch (event) {
              case 'open':
                  console.log('Connection opened')
                  break;
              case 'error':
                  console.log('Connection error', data)
                  break;
              case 'close':
                  console.log('Connection closed')
                  break;
              default:
                  console.log("Unkown:" event, data)
                  break;
          }
      }
    )
  })();

One last thing, disconnecting.

You'll need to disconnect the session when you're done with it.

  import {disconnect} from 'diarupt';
  stopButton.addEventListener('click', () => {
    disconnect();
  });
Disconnecting an interaction allows you continue the conversation at a later date/time by passing same `session_id` into the SDK again. To permanently terminate your session, see [Terminate Session](https://docs.diarupt.ai/api-reference/session/post-terminate-session)

You're ready!

Now run your code, it may takes a sec to connect and you should be able to have a conversation with your AI.

See the full source code [here](https://github.com/Diarupt/examples)

Learn More

Explore the full capabilities of the Diarupt platform.

<Card title="Core Concepts" icon="square-code" href="/settings/global">
  Learn how to use the Core Concepts of our platform to build even complex AI interactions.
</Card>

<Card
  title="Webhooks"
  icon="square-code"
  href="/api-playground/configuration">
  Configure webhooks to receive live update on interactions as they happen.
</Card>