feat: diarisation des locuteurs en temps réel (ECAPA-TDNN + clustering incrémental)

- Nouveau module diarizer.py : EmbeddingModel (SpeechBrain ECAPA-TDNN) + SpeakerDiarizer par session
- Backend : chargement modèle au lifespan, migration DB (colonne speaker), worker enrichi, exports avec locuteur
- Frontend : badges locuteurs colorés (8 couleurs), toggle activation, copie avec [Locuteur X]
- Config : DIARIZATION=on/off, DIARIZATION_THRESHOLD=0.70, PyTorch CPU-only dans Dockerfile
- Rétrocompatible : désactivé par défaut (DIARIZATION=off)

app/static/app.js

@@ -15,6 +15,19 @@ const state = {
 
 const BATCH_SAMPLES = 4096; // ~256 ms de PCM 16 kHz par message WebSocket
 
+// --- Diarisation : palette de couleurs par locuteur ---
+const SPEAKER_COLORS = 8; // nombre de classes CSS .speaker-0 à .speaker-7
+const speakerMap = {};     // "Speaker 1" → 0, "Speaker 2" → 1, ...
+let speakerCounter = 0;
+
+function getSpeakerColorIndex(speaker) {
+  if (!(speaker in speakerMap)) {
+    speakerMap[speaker] = speakerCounter % SPEAKER_COLORS;
+    speakerCounter++;
+  }
+  return speakerMap[speaker];
+}
+
 // ----------------------------------------------------------- enregistrement
 
 async function startRecording() {
@@ -35,7 +48,11 @@ async function startRecording() {
 
   const proto = location.protocol === 'https:' ? 'wss' : 'ws';
   state.ws = new WebSocket(`${proto}://${location.host}/ws`);
-  state.ws.onopen = () => state.ws.send(JSON.stringify({ type: 'start', title: $('title').value }));
+  state.ws.onopen = () => state.ws.send(JSON.stringify({
+    type: 'start',
+    title: $('title').value,
+    diarization: $('diarization-cb').checked,
+  }));
   state.ws.onmessage = onServerMessage;
   state.ws.onclose = () => { if (state.recording) stopRecording(true); };
 
@@ -136,12 +153,20 @@ function fmtTs(seconds) {
 
 function clearTranscript() {
   $('transcript').innerHTML = '';
+  // Reset le mapping locuteurs pour chaque nouvelle session
+  for (const key in speakerMap) delete speakerMap[key];
+  speakerCounter = 0;
 }
 
 function appendSegment(seg) {
   const div = document.createElement('div');
   div.className = 'segment';
-  div.innerHTML = `<span class="ts">${fmtTs(seg.t0)}</span><span class="text"></span>`;
+  let speakerHtml = '';
+  if (seg.speaker) {
+    const ci = getSpeakerColorIndex(seg.speaker);
+    speakerHtml = `<span class="speaker speaker-${ci}">${seg.speaker}</span>`;
+  }
+  div.innerHTML = `<span class="ts">${fmtTs(seg.t0)}</span>${speakerHtml}<span class="text"></span>`;
   div.querySelector('.text').textContent = seg.text;
   $('transcript').appendChild(div);
   $('transcript').scrollTop = $('transcript').scrollHeight;
@@ -199,9 +224,12 @@ async function deleteCurrentMeeting() {
 }
 
 async function copyTranscript() {
-  const text = [...document.querySelectorAll('#transcript .segment .text')]
-    .map((el) => el.textContent).join('\n');
-  await navigator.clipboard.writeText(text);
+  const lines = [...document.querySelectorAll('#transcript .segment')].map((el) => {
+    const speaker = el.querySelector('.speaker');
+    const text = el.querySelector('.text').textContent;
+    return speaker ? `[${speaker.textContent}] ${text}` : text;
+  });
+  await navigator.clipboard.writeText(lines.join('\n'));
   $('copy-btn').textContent = '✓ Copié';
   setTimeout(() => ($('copy-btn').textContent = '📋 Copier'), 1500);
 }

app/static/index.html

@@ -24,6 +24,10 @@
         <input id="title" type="text" placeholder="Titre de la réunion (optionnel)">
         <button id="record-btn" class="record">● Démarrer</button>
         <span id="timer">00:00</span>
+        <label id="diarization-toggle" class="toggle" title="Identifier les locuteurs">
+          <input type="checkbox" id="diarization-cb">
+          <span>👥 Locuteurs</span>
+        </label>
       </section>
 
       <section id="transcript-panel">

app/static/style.css

@@ -133,6 +133,46 @@ button.record.recording { background: var(--rec); }
   flex-shrink: 0;
 }
 
+/* --- Diarisation : badges locuteurs --- */
+.speaker {
+  font-size: 0.78rem;
+  font-weight: 600;
+  padding: 2px 8px;
+  border-radius: 6px;
+  flex-shrink: 0;
+  white-space: nowrap;
+}
+.speaker-0 { background: #1a2440; color: #4f7cff; }
+.speaker-1 { background: #3a181a; color: #e5484d; }
+.speaker-2 { background: #132a1e; color: #30a46c; }
+.speaker-3 { background: #2a2410; color: #f5a623; }
+.speaker-4 { background: #2a1a3a; color: #8e4ec6; }
+.speaker-5 { background: #0f2a28; color: #12a594; }
+.speaker-6 { background: #3a1a2a; color: #e54666; }
+.speaker-7 { background: #1e2024; color: #889096; }
+
+/* Toggle diarisation */
+.toggle {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  cursor: pointer;
+  font-size: 0.85rem;
+  color: var(--muted);
+  user-select: none;
+  padding: 6px 12px;
+  border-radius: 10px;
+  background: var(--panel-2);
+  border: 1px solid #2c3245;
+  transition: border-color 0.2s, color 0.2s;
+}
+.toggle:hover { border-color: var(--accent); }
+.toggle input { display: none; }
+.toggle:has(input:checked) {
+  border-color: var(--accent);
+  color: var(--text);
+}
+
 @media (max-width: 720px) {
   .layout { flex-direction: column; }
   aside { width: 100%; max-height: 30vh; border-right: none; border-bottom: 1px solid #262b3a; }