gracefully handle case with no video/mic

This commit is contained in:
Roland Osborne 2023-03-28 14:08:52 -07:00
parent 41ca37d2df
commit 7b4eed0c7a
2 changed files with 37 additions and 9 deletions

View File

@ -28,6 +28,7 @@ export function useRingContext() {
const pc = useRef(null); const pc = useRef(null);
const stream = useRef(null); const stream = useRef(null);
const accessVideo = useRef(false); const accessVideo = useRef(false);
const accessAudio = useRef(false);
const videoTrack = useRef(); const videoTrack = useRef();
const audioTrack = useRef(); const audioTrack = useRef();
@ -139,9 +140,30 @@ export function useRingContext() {
} }
}; };
const media = await whiteNoise(); updateState({ localVideo: false, localAudio: false, localStream: null });
updateState({ localStream: media }); videoTrack.current = false;
pc.current.addTransceiver(media.getTracks()[0], {streams: [media]}); audioTrack.current = false;
accessVideo.current = false;
try {
const stream = await navigator.mediaDevices.getUserMedia({
video: false,
audio: true,
});
accessAudio.current = true;
const local = new MediaStream();
updateState({ localAudio: true, localStream: stream });
for (const track of stream.getTracks()) {
if (track.kind === 'audio') {
audioTrack.current = track;
}
pc.current.addTrack(track);
}
}
catch (err) {
console.log(err);
}
//pc.current.addTransceiver(media.getTracks()[0], {streams: [media]});
ws.current = createWebsocket(`wss://${contactNode}/signal`); ws.current = createWebsocket(`wss://${contactNode}/signal`);
ws.current.onmessage = async (ev) => { ws.current.onmessage = async (ev) => {
@ -305,6 +327,7 @@ export function useRingContext() {
video: false, video: false,
audio: true, audio: true,
}); });
accessAudio.current = true;
updateState({ localVideo: false, localAudio: true, localStream: stream }); updateState({ localVideo: false, localAudio: true, localStream: stream });
for (const track of stream.getTracks()) { for (const track of stream.getTracks()) {
if (track.kind === 'audio') { if (track.kind === 'audio') {
@ -379,11 +402,12 @@ export function useRingContext() {
}, },
enableVideo: async () => { enableVideo: async () => {
if (!accessVideo.current) { if (!accessVideo.current) {
accessVideo.current = true;
const stream = await navigator.mediaDevices.getUserMedia({ const stream = await navigator.mediaDevices.getUserMedia({
video: true, video: true,
audio: true, audio: true,
}); });
accessVideo.current = true;
accessAudio.current = true;
updateState({ localStream: stream }); updateState({ localStream: stream });
for (const track of stream.getTracks()) { for (const track of stream.getTracks()) {
if (track.kind === 'audio') { if (track.kind === 'audio') {
@ -407,12 +431,16 @@ export function useRingContext() {
updateState({ localVideo: false }); updateState({ localVideo: false });
}, },
enableAudio: async () => { enableAudio: async () => {
audioTrack.current.enabled = true; if (accessAudio.current) {
updateState({ localAudio: true }); audioTrack.current.enabled = true;
updateState({ localAudio: true });
}
}, },
disableAudio: async () => { disableAudio: async () => {
audioTrack.current.enabled = false; if (accessAudio.current) {
updateState({ localAudio: false }); audioTrack.current.enabled = false;
updateState({ localAudio: false });
}
}, },
} }

View File

@ -335,7 +335,7 @@ export function Session() {
)} )}
{ state.localStream && ( { state.localStream && (
<div className="calling-local"> <div className="calling-local">
<video ref={local} disablepictureinpicture playsInline autoPlay style={{ width: '100%', display: 'block' }} <video ref={local} disablepictureinpicture playsInline autoPlay muted style={{ width: '100%', display: 'block' }}
complete={() => console.log("VIDEO COMPLETE")} progress={() => console.log("VIDEO PROGRESS")} error={() => console.log("VIDEO ERROR")} waiting={() => console.log("VIDEO WAITING")} /> complete={() => console.log("VIDEO COMPLETE")} progress={() => console.log("VIDEO PROGRESS")} error={() => console.log("VIDEO ERROR")} waiting={() => console.log("VIDEO WAITING")} />
</div> </div>
)} )}