RTCMulticonnection initiator no camera - webrtc

Question

I need some help please if the initiator of the room has no camera,I want the joiner that has both audio and camera to be used. but the problem is that I set to false to video mediacontstraints. now the joiner will only have the audio the camera is gone what I want is audio and video for the joiner.
#Muaz Khan - RTCMultiConnection.js
var initiator = new RTCMultiConnection();
initiator.socketURL = 'url here';
initiator.session = {
audio: true,
video:false,
};
initiator.mediaConstraints = {
audio: true,
video: false
};
initiator.sdpConstraints = {
OfferToReceiveAudio: true,
OfferToReceiveVideo: true
};
initiator.iceServers = [];
initiator.iceServers.push({
urls: "urls"
});
initiator.iceServers.push({
urls: "urls",
username: "username",
credential: "credential"
});
initiator.audiosContainer = document.getElementById('audios-container');
initiator.onstream = function(event) {
var width = parseInt(initiator.audiosContainer.clientWidth / 4) - 20;
console.log("the dispatcher width is",width);
var mediaElement = getHTMLMediaElement(event.mediaElement, {
title: event.userid,
buttons: ['full-screen'],
width: width,
showOnMouseEnter: false
});
initiator.audiosContainer.appendChild(mediaElement);
setTimeout(function() {
mediaElement.media.play();
}, 5000);
mediaElement.id = event.streamid;
};
initiator.onstreamended = function(event) {
var mediaElement = document.getElementById(event.streamid);
if (mediaElement) {
mediaElement.parentNode.removeChild(mediaElement);
}
};
initiator.openOrJoin('channel-id', function(isRoomExist, roomid) {
if (!isRoomExist) {
}
});
// for participant
var connection = new RTCMultiConnection();
connection.socketURL = 'url here';
connection.session = {
audio: true,
video: true
};
connection.mediaConstraints = {
audio: true,
video: true
};
connection.sdpConstraints.mandatory = {
OfferToReceiveAudio: true,
OfferToReceiveVideo: true
};
connection.iceServers = [];
connection.iceServers.push({
urls: "urls"
});
connection.iceServers.push({
urls: "urls",
username: "username",
credential: "password"
});
connection.audiosContainer = document.getElementById('audios-container');
connection.onstream = function(event) {
var width = parseInt(connection.audiosContainer.clientWidth / 2) - 20;
console.log("the responder width is",width);
var mediaElement = getHTMLMediaElement(event.mediaElement, {
title: event.userid,
buttons: ['full-screen'],
width: width,
showOnMouseEnter: false
});
connection.audiosContainer.appendChild(mediaElement);
setTimeout(function() {
mediaElement.media.play();
}, 5000);
mediaElement.id = event.streamid;
};
connection.onstreamended = function(event) {
var mediaElement = document.getElementById(event.streamid);
if (mediaElement) {
mediaElement.parentNode.removeChild(mediaElement);
}
};
connection.openOrJoin('channel-id', function(isRoomExist, roomid) {
if (!isRoomExist) {
}
});
Thank you in advance.

Answer 1

Untested, but you should be able to init your RTC connection with a dummy video+audio MediaStream, even if your user doesn't have any device, and without asking them for any approval:
function SilentStream(videoColor) {
const canvas = document.createElement('canvas');
const ctx = canvas.getContext('2d', {alpha: false});
ctx.fillStyle = videoColor || 'black';
ctx.fillRect(0,0,canvas.width, canvas.height);
const videoStream = canvas.captureStream();
const videoTrack = videoStream.getVideoTracks()[0];
const a_ctx = new (window.AudioContext || window.webkitAudioContext)();
const audioStream = a_ctx.createMediaStreamDestination().stream;
const audioTrack = audioStream.getAudioTracks()[0];
return new MediaStream([videoTrack, audioTrack]);
}
// just to show it's streaming
black.srcObject = SilentStream();
green.srcObject = SilentStream('green');
<video id="black" controls autoplay></video>
<video id="green" controls autoplay></video>