RTCMulticonnection initiator no camera

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.

Kaiido · Answer 1 · 2018-03-09T05:46:38.340

0

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>

edited Mar 09 '18 at 05:46

answered Mar 09 '18 at 05:41

Kaiido

123,334
13
219
285

@jemz Yes my idea was that you would take this SilentStream, and init the connection with it, this way, all your users will have both audio and video. Only when you get the user's approval, will you replace the silent tracks with the ones from their device if any. I didn't used this lib, but it seems you can do `var stream = SilentStream(); var streamEvent = { type: 'local', stream: stream, streamid: stream.id}; connection.onstream(streamEvent); connection.dontCaptureUserMedia = true; connection.openOrJoin('your-room-id');` – Kaiido Mar 09 '18 at 06:31
I paste all my code , can you please help me where to put your code ? .thank you in advance – jemz Mar 09 '18 at 07:19

RTCMulticonnection initiator no camera

1 Answers1

Linked