2017-09-12 10 views
0

사용자가 원하는 경우 비디오 테이프를 비활성화 할 수있는 기능을 제공하고 싶습니다. 이 경우 LocalVideoTrack.disable()을 사용할 수 있습니까? 그렇다면 예제를 보여줄 수 있습니까?사용자 환경 설정에 따라 비디오 트랙을 중지하고 twilio 비디오를 사용하여 비디오 트랙을 다시 보내려면 어떻게합니까?

여기 내 코드입니다 : 사용자가 내가 이미 전송 MA 경우 비디오 전송을 중지 또는 나는 내가 아니다 비디오를 전송 시작하려는 토글 비디오 버튼을 clciks

navigator.mediaDevices.getUserMedia({ 
     audio: true, 
     video: {width: 320} 
    }) 
     .then(function (mediaStream) { 
      var connectOptions = { 
       name: roomName, 
       logLevel: 'off', 
       tracks: mediaStream.getTracks() 
      }; 
      return Video.connect(data.token, connectOptions); 
     }) 
     .then(roomJoined, function (error) { 
      log('Could not connect to Twilio: ' + error.message); 
     }); 


    // Bind button to leave Room. 
    document.getElementById('button-leave').onclick = function() { 
     log('Leaving room...'); 
     leaveRoomIfJoined(); 
    }; 
}); 

// Successfully connected! 
function roomJoined(room) { 
    //To collect the timing data for billing purposes 
    $.post('/classrooms/logs/joinedroom/' + lessonId + '/' + identity, function (data) { 
     console.log(data); 
    }); 
    activeRoom = room; 

    log("Joined" + room); 
    log(new Date().getMinutes()); 

    // Attach LocalParticipant's Tracks, if not already attached. 
    // var previewContainer = document.getElementById('local-media'); 
    // if (!previewContainer.querySelector('video')) { 
    //  attachParticipantTracks(room.localParticipant, previewContainer); 
    // } 

    // Attach the Tracks of the Room's Participants. 
    room.participants.forEach(function (participant) { 
     log("Already in Room: '" + participant.identity + "'"); 
     var previewContainer = document.getElementById('remote-media'); 
     attachParticipantTracks(participant, previewContainer); 
    }); 

    // When a Participant joins the Room, log the event. 
    room.on('participantConnected', function (participant) { 
     console.log(participant); 
     log("Joining: '" + participant.identity + "'"); 
    }); 

    // When a Participant adds a Track, attach it to the DOM. 
    room.on('trackAdded', function (track, participant) { 
     log(participant.identity + " added track: " + track.kind); 
     var previewContainer = document.getElementById('remote-media'); 
     var h = previewContainer.offsetWidth * 0.75 + "px"; 
     if (participant.identity === classroom.teacher._id) { 
      attachTracks([track], previewContainer); 

      previewContainer.style.height = h; 

      // } else { 
      //  if(track.kind == 'audio') { 
      //   console.log(typeof(track.kind)); 
      //   attachTracks([track], previewContainer); 
      //  } 
     } 
    }); 

    // When a Participant removes a Track, detach it from the DOM. 
    room.on('trackRemoved', function (track, participant) { 
     log(participant.identity + " removed track: " + track.kind); 
     detachTracks([track]); 
    }); 

    // When a Participant leaves the Room, detach its Tracks. 
    room.on('participantDisconnected', function (participant) { 
     log("Participant '" + participant.identity + "' left the room"); 
     log(new Date().getMinutes()); 
     detachParticipantTracks(participant); 
    }); 
    $('#toggle-video').click(function(e){ 
     console.log(room.localParticipant.videoTracks); 
     // room.localParticipant.videoTracks.disable(); 
    }); 
    // Once the LocalParticipant leaves the room, detach the Tracks 
    // of all Participants, including that of the LocalParticipant. 
    room.on('disconnected', function() { 
     $.post('/classrooms/logs/leftroom/' + lessonId + '/' + identity, function (data) { 
      detachParticipantTracks(room.localParticipant); 
      room.participants.forEach(detachParticipantTracks); 
      activeRoom = null; 
      // document.getElementById('button-join').style.display = 'inline'; 
      document.getElementById('button-leave').style.display = 'none'; 
     }); 
     log('Left'); 
     log(new Date().getMinutes()); 
     detachParticipantTracks(room.localParticipant); 
     room.participants.forEach(detachParticipantTracks); 
     activeRoom = null; 
     // document.getElementById('button-join').style.display = 'inline'; 
     document.getElementById('button-leave').style.display = 'none'; 
    }); 
} 

그래서 기본적으로 할 때. 이를 위해 LocalVideoTrack을 어떻게 확보 할 수 있습니까?

답변

1

개발자 전도사 Twilio가 여기 있습니다.

이 경우 실제로 LocalTrack.disable()을 사용할 수 있습니다. 또는 쉽게하기 위해 부울 인수를 LocalTrack.enable([enabled])에 전달하여 트랙을 일시 중지하거나 일시 정지 해제 할 수 있습니다. 다음을 달성하는 방법은 다음과 같습니다.

function roomJoined(room) { 
    const localParticipant = room.localParticipant; 
    let videoEnabled = true; 

    $('#toggle-video').click(function(e) { 
    videoEnabled = !videoEnabled; 
    localParticipant.videoTracks.forEach(function(videoTrack) { 
     videoTrack.enable(videoEnabled); 
    }); 
    }) 
} 

그게 도움이되는지 알려주세요.

+0

단추를 클릭 할 때 코드를 공유 했으므로 다음 오류가 발생합니다. Uncaught TypeError : localParticipant.videoTracks.values ​​(...) forEach는 함수가 아닙니다. – lightbringer

+0

여기에 '$ ('toggle-video'). click (function (e) { console.log ('toggle called')) videoEnabled =! videoEnabled; localParticipant.videoTracks.values ​​(). forEach (function (videoTrack) { videoTrack ( }); }); ' – lightbringer

+0

죄송합니다. 수정하려고 시도하겠습니다. – philnash