Passi vous la présente
{bits.length ? bits.join(' · ') : 'Note texte'} · {p ? 'dossier ' + p.name.split(' ')[0] : 'liée à ce salon'}
{title || 'Note'}
{p ? : }
{n.ts}{n.call ? ' · prise en appel' : ''}
{rest.length ? (
{rest.map((l, i) =>
{l}
)}
) : null}
{imgs.length ? (
{imgs.map((a, i) => (
{(a.name || 'Photo').split(' · ').pop()}
))}
) : null}
{docs.map((a, i) => (
{a.name}{a.size ? {a.size} : null}
))}
{auds.map((a, i) => (
{window.NtAudio ?
: (
Mémo audio{a.dur}
)}
{a.tr ? (
) : null}
))}
);
}
// ── Feuille NOTES · composer complet + notes du salon, sans quitter l'appel ──
function SlcNotes({ room, secs, speakingPid, muted, onClose, showToast }) {
const evObj = { id: room.id, who: room.pids[0], whos: room.pids, theme: 'admin', kindLabel: 'Ce salon' };
const [draft, setDraft] = useStateSL('');
const [att, setAtt] = useStateSL([]);
const [editing, setEditing] = useStateSL(null); // id de note en cours d'édition
const [viewing, setViewing] = useStateSL(null); // note ouverte en lecture
const [rec, setRec] = useStateSL(null); // null | { t, wi }
const [expandedG, setExpandedG] = useStateSL({}); // groupes dépliés au-delà de 3 notes
const [, force] = useStateSL(0);
const taRef = useRefSL(null);
useEffectSL(() => { if (taRef.current) taRef.current.focus(); }, []);
const notes = (window.fpNotesFor ? window.fpNotesFor(evObj) : []);
// Mémo audio · transcription en direct (simulation) pendant l'appel
const first = (FP_PEERS[room.pids[0]] || {}).name || '';
const trFull = 'Confirmer avec ' + first.split(' ')[0] + ' les points évoqués pendant l\u2019appel, préparer les documents et recaler un point avant le prochain rendez-vous.';
const trWords = trFull.split(' ');
useEffectSL(() => {
if (!rec) return undefined;
const w = setInterval(() => setRec((r) => (r && r.wi < trWords.length ? { ...r, wi: r.wi + 1 } : r)), 300);
const t = setInterval(() => setRec((r) => (r ? { ...r, t: r.t + 1 } : r)), 1000);
return () => { clearInterval(w); clearInterval(t); };
}, [!!rec]);
const stopRec = () => {
setAtt((a) => [...a, { k: 'aud', dur: slcFmtT(Math.max(rec.t, 2)), tr: trWords.slice(0, Math.max(rec.wi, 6)).join(' ') }]);
setRec(null);
};
const nImg = att.filter((a) => a.k === 'img').length;
const addPhoto = () => setAtt((a) => [...a, { k: 'img', name: 'Photo · IMG_08' + (24 + nImg) + '.jpg', size: '1,8 Mo' }]);
const addDoc = () => setAtt((a) => [...a, { k: 'doc', name: 'Document · ' + room.name + '.pdf', size: '340 Ko' }]);
const reset = () => { setDraft(''); setAtt([]); setEditing(null); setRec(null); };
const save = () => {
const t = draft.trim();
if (!t && !att.length) return;
if (editing) {
window.FP_NOTES = window.FP_NOTES.map((n) => (n.id === editing ? { ...n, text: t, att: att.length ? att : undefined } : n));
if (showToast) showToast('Note mise à jour');
} else {
window.FP_NOTES = [
{ id: 'n' + Date.now(), text: t, ev: room.id, who: room.pids[0], ts: 'Pendant l\u2019appel · ' + fmtDur(secs), call: true, att: att.length ? att : undefined },
...window.FP_NOTES,
];
if (showToast) showToast('Note enregistrée dans le salon');
}
if (window.fpSaveNotes) window.fpSaveNotes();
reset(); force((x) => x + 1);
};
const del = () => {
window.FP_NOTES = window.FP_NOTES.filter((n) => n.id !== editing);
if (window.fpSaveNotes) window.fpSaveNotes();
reset(); force((x) => x + 1);
if (showToast) showToast('Note supprimée');
};
const startEdit = (n) => {
setViewing(null);
setEditing(n.id); setDraft(n.text || ''); setAtt(n.att ? n.att.slice() : []);
setTimeout(() => { if (taRef.current) taRef.current.focus(); }, 50);
};
const viewed = viewing ? notes.find((n) => n.id === viewing) : null;
return (
Notes · {room.name}
{fmtDur(secs)}
{/* Le salon reste sous les yeux pendant la prise de notes */}
{room.pids.map((pid) => {
const p = FP_PEERS[pid];
return (
);
})}
{muted ? : null}
{speakingPid && FP_PEERS[speakingPid] ? FP_PEERS[speakingPid].name.split(' ')[0] + ' parle…' : 'Appel en cours'}
L’appel continue pendant vos notes
{att.length ? (
{att.map((a, i) => (
{a.k === 'img' ? : a.k === 'aud' ? : }
{a.k === 'aud' ? 'Mémo · ' + a.dur : (a.name || '').split(' · ').pop()}
))}
) : null}
{rec ? (
Enregistrement…{slcFmtT(rec.t)}
{rec.wi ? trWords.slice(0, rec.wi).join(' ') : Parlez, le texte s’écrit en direct…}
) : (
{editing ? 'Modification' : fmtDur(secs)}
{editing ? : null}
)}
Vos notes · salon & participants
{notes.length ? (window.fpGroupNotes ? window.fpGroupNotes(notes, evObj) : [{ key: 'all', label: '', items: notes }]).map((g, gi, arr) => {
const showHead = arr.length > 1 || g.items.length > 3;
const items = expandedG[g.key] ? g.items : g.items.slice(0, 3);
return (
{showHead ? {g.label}{g.items.length}
: null}
{items.map((n) => {
const { title, rest } = slcLines(n.text);
const p = !n.ev && n.who ? FP_PEERS[n.who] : null;
const a = n.att || [];
const aud = a.find((x) => x.k === 'aud');
const nDoc = a.filter((x) => x.k === 'doc').length;
const nImgs = a.filter((x) => x.k === 'img').length;
return (
);
})}
{g.items.length > 3 && !expandedG[g.key] ? (
) : null}
);
}) : (
Aucune note pour ce salon.
Écrivez ci-dessus : tout reste rattaché au salon.
)}
{viewed ?
setViewing(null)} onEdit={startEdit} /> : null}
);
}
// ── ÉCRAN · appel de salon ──
function SalonCall({ lang, room, onEnd, showToast }) {
const r = room || (window.CL2_ROOMS && window.CL2_ROOMS[0]);
const [secs, setSecs] = useStateSL(0);
const [muted, setMuted] = useStateSL(false);
const [speaker, setSpeaker] = useStateSL(true);
const [notesOpen, setNotesOpen] = useStateSL(false);
const [spIdx, setSpIdx] = useStateSL(0);
const [, force] = useStateSL(0);
useEffectSL(() => {
const id = setInterval(() => setSecs((s) => s + 1), 1000);
return () => clearInterval(id);
}, []);
// Tour de parole simulé entre les membres du salon
useEffectSL(() => {
const id = setInterval(() => setSpIdx((i) => (i + 1) % r.pids.length), 3200);
return () => clearInterval(id);
}, [r.pids.length]);
const speakingPid = r.pids[spIdx];
const nNotes = window.fpNotesFor
? window.fpNotesFor({ id: r.id, who: r.pids[0], whos: r.pids }).length
: 0;
return (
{fmtDur(secs)}
{r.name}
{r.pids.length + 1} en ligne · chiffré de bout en bout
{/* Mode salon · tous les membres visibles */}
{r.pids.map((pid) => (
))}
} label="Muet" on={muted} onClick={() => setMuted((m) => !m)} />
} label="HP" on={speaker} onClick={() => setSpeaker((s) => !s)} />
{nNotes ? {nNotes} : null}
Notes
} label="Raccrocher" danger onClick={() => onEnd(secs)} />
{notesOpen ? (
{ setNotesOpen(false); force((x) => x + 1); }} showToast={showToast} />
) : null}
);
}
Object.assign(window, { SalonCall });