Basic Usage Guide
This example demonstrates how to use the Vocale in any JavaScript app to manage voice interactions and form submissions with Vocale.ai.
You can see a fully working example here - StackBlitz/Vocale JS Example
import Vocale from '@vocale/core'; // Initialize Vocale class with your settings const settings = { siteId: 'YOUR_SITE_ID', apiKey: 'YOUR_API_KEY', }; const vocale = new Vocale(settings); //Sync the fields, this is an API request to track the from directly from your app //try to call it as little as possible since its not necessary if the form hasn't changed vocale.sync({ pathname: '/', forms: [ { formId: 'my-form', type: 'HTML', schema: [ { id: 'name', type: 'text', fieldType: 'text', }, { id: 'email', type: 'email', fieldType: 'text', }, { id: 'message', type: 'textarea', fieldType: 'text', }, ], }, ], }); //Here is where you send the audio blob, it can be directly from the browser or any other source. //Pro tip: In the Stackblitz example there is a working version of this vocale.voice( blob, { trigger: { formId: 'my-form', }, pathname: '/', metadata: { audioDuration: 1000,//You should track this when recording the audio }, }) .then((data) => { data.actions?.forEach((action) => { if (action.type === 'form') { action.payload.schema.forEach((field) => { //Here you can use the completions by field console.log(field.id, field.value) }); } }); });