Devana Vocal Mode - Guide d'intégration

┌─────────────┐     WebRTC Audio      ┌─────────────┐
│   Client    │ ◄──────────────────► │   Serveur   │
│  (Browser)  │                       │   Devana    │
└─────────────┘                       └─────────────┘
       │                                     │
       │  DataChannel (événements JSON)      │
       │ ◄─────────────────────────────────► │
       │                                     │
       │                              ┌──────┴──────┐
       │                              │     VAD     │
       │                              │  (Détection │
       │                              │   vocale)   │
       │                              └──────┬──────┘
       │                                     │
       │                              ┌──────┴──────┐
       │                              │     STT     │
       │                              │ (Speech to  │
       │                              │    Text)    │
       │                              └──────┬──────┘
       │                                     │
       │                              ┌──────┴──────┐
       │                              │     LLM     │
       │                              │  (Agent IA) │
       │                              └──────┬──────┘
       │                                     │
       │                              ┌──────┴──────┐
       │                              │     TTS     │
       │                              │  (Text to   │
       │                              │   Speech)   │
       │                              └─────────────┘

POST /v1/chat/vocal
Content-Type: application/json
Authorization: Bearer <token>

{
  "sdp": "<SDP offer string>",
  "agentId": "<ID de l'agent Devana>"
}

{
  "sdp": "<SDP answer string>",
  "sessionId": "<UUID de la session>"
}

iceServers: [{ urls: "stun:stun.l.google.com:19302" }];

const channel = peerConnection.createDataChannel("events", { ordered: true });

{ "type": "user_speech_start" }

{ "type": "user_speech_end" }

{ "type": "processing", "stage": "stt" | "llm" | "tts" }

{ "type": "transcription", "text": "Bonjour, comment ça va ?" }

{ "type": "response_text", "text": "Je vais ", "partial": true }

{ "type": "tts_start", "text": "Je vais bien, merci !" }

{ "type": "tts_end" }

{
  "type": "vad_stats",
  "energy": 245.5,
  "noiseFloor": 52.3,
  "speechStartThreshold": 183.1,
  "speechEndThreshold": 94.1,
  "peakEnergy": 412.8,
  "isSpeaking": true,
  "calibrationProgress": 100
}

{ "type": "error", "message": "STT transcription failed" }

{
  "type": "settings_update",
  "settings": {
    "vadSensitivity": 7,
    "silenceDuration": 1000,
    "language": "fr"
  }
}

{
  "type": "files_update",
  "fileIds": ["file-id-1", "file-id-2"]
}

const stream = await navigator.mediaDevices.getUserMedia({ audio: true });

const peerConnection = new RTCPeerConnection({
  iceServers: [{ urls: "stun:stun.l.google.com:19302" }],
});

// Ajouter la piste audio locale
stream.getTracks().forEach((track) => {
  peerConnection.addTrack(track, stream);
});

const dataChannel = peerConnection.createDataChannel("events", {
  ordered: true,
});

dataChannel.onmessage = (event) => {
  const data = JSON.parse(event.data);
  console.log("Event:", data.type, data);

  switch (data.type) {
    case "user_speech_start":
      // L'utilisateur parle
      break;
    case "transcription":
      // Afficher la transcription
      break;
    case "response_text":
      // Afficher la réponse de l'IA
      break;
    case "tts_start":
      
      ;
     :
      
      ;
  }
};

const remoteAudio = new Audio();
remoteAudio.autoplay = true;

peerConnection.ontrack = (event) => {
  if (event.streams && event.streams[0]) {
    remoteAudio.srcObject = event.streams[0];
  }
};

const offer = await peerConnection.createOffer();
await peerConnection.setLocalDescription(offer);

// Attendre la fin du gathering ICE
await waitForIceGathering(peerConnection);

// Envoyer au serveur
const response = await fetch("https://api.devana.ai/v1/chat/vocal", {
  method: "POST",
  headers: {
    "Content-Type": "application/json",
    Authorization: `Bearer ${userToken}`,
  },
  body: JSON.stringify({
    sdp: peerConnection.localDescription.sdp,
    agentId: "votre-agent-id",
  }),
});

const { sdp, sessionId } =  response.();


 peerConnection.(
   ({ : , sdp }),
);

function waitForIceGathering(pc, timeout = 5000) {
  return new Promise((resolve) => {
    if (pc.iceGatheringState === "complete") {
      resolve();
      return;
    }

    const checkState = () => {
      if (pc.iceGatheringState === "complete") {
        pc.removeEventListener("icegatheringstatechange", checkState);
        resolve();
      }
    };

    pc.addEventListener("icegatheringstatechange", checkState);
    setTimeout(() => {
      pc.removeEventListener("icegatheringstatechange", checkState);
      resolve();
    }, timeout);
  });
}

dataChannel.send(
  JSON.stringify({
    type: "settings_update",
    settings: {
      vadSensitivity: 5, // 1-10 (1 = peu sensible, 10 = très sensible)
    },
  }),
);

dataChannel.send(
  JSON.stringify({
    type: "settings_update",
    settings: {
      silenceDuration: 1500, // 500-3000ms
    },
  }),
);

dataChannel.send(
  JSON.stringify({
    type: "settings_update",
    settings: {
      language: "fr", // fr, en, es, de, it, pt
    },
  }),
);

const formData = new FormData();
formData.append("file", fileBlob);

const response = await fetch("https://api.devana.ai/api/upload", {
  method: "POST",
  headers: {
    Authorization: `Bearer ${userToken}`,
    conversation: sessionId, // Important: lie le fichier à la session
    wait: "true", // Attend la fin du traitement
  },
  body: formData,
});

const { data } = await response.json();
const fileIds = data.ids; // Array d'IDs de fichiers

dataChannel.send(
  JSON.stringify({
    type: "files_update",
    fileIds: fileIds,
  }),
);