workadventure/front/src/WebRtc/MediaManager.ts
2020-04-19 19:32:38 +02:00

89 lines
2.7 KiB
TypeScript

export class MediaManager {
localStream: MediaStream;
remoteStream: MediaStream;
remoteVideo: any;
myCamVideo: any;
cinemaClose: any = null;
cinema: any = null;
microphoneClose: any = null;
microphone: any = null;
constraintsMedia = {audio: true, video: true};
getCameraPromise : Promise<any> = null;
constructor() {
this.remoteVideo = document.getElementById('activeCamVideo');
this.myCamVideo = document.getElementById('myCamVideo');
this.microphoneClose = document.getElementById('microphone-close');
this.microphoneClose.addEventListener('click', (e: any) => {
e.preventDefault();
this.enabledMicrophone();
//update tracking
});
this.microphone = document.getElementById('microphone');
this.microphone.addEventListener('click', (e: any) => {
e.preventDefault();
this.disabledMicrophone();
//update tracking
});
this.cinemaClose = document.getElementById('cinema-close');
this.cinemaClose.addEventListener('click', (e: any) => {
e.preventDefault();
this.enabledCamera();
//update tracking
});
this.cinema = document.getElementById('cinema');
this.cinema.addEventListener('click', (e: any) => {
e.preventDefault();
this.disabledCamera();
//update tracking
});
this.enabledMicrophone();
this.enabledCamera();
let webRtc = document.getElementById('webRtc');
webRtc.classList.add('active');
this.getCamera();
}
enabledCamera() {
this.cinemaClose.style.display = "none";
this.cinema.style.display = "block";
this.constraintsMedia.video = true;
}
disabledCamera() {
this.cinemaClose.style.display = "block";
this.cinema.style.display = "none";
this.constraintsMedia.video = false;
}
enabledMicrophone() {
this.microphoneClose.style.display = "none";
this.microphone.style.display = "block";
this.constraintsMedia.audio = true;
}
disabledMicrophone() {
this.microphoneClose.style.display = "block";
this.microphone.style.display = "none";
this.constraintsMedia.audio = false;
}
//get camera
getCamera() {
this.getCameraPromise = navigator.mediaDevices.getUserMedia(this.constraintsMedia)
.then((stream: MediaStream) => {
this.localStream = stream;
this.myCamVideo.srcObject = this.localStream;
}).catch((err) => {
console.error(err);
this.localStream = null;
throw err;
});
}
}