Fix style cam

This commit is contained in:
gparant 2020-05-03 14:29:45 +02:00
parent bae03fb1cf
commit 85ab0a231f
2 changed files with 28 additions and 6 deletions
front
dist/resources/style
src/WebRtc

View File

@ -1,3 +1,7 @@
video{
-webkit-transform: scaleX(-1);
transform: scaleX(-1);
}
.webrtc{
display: none;
position: absolute;
@ -11,15 +15,18 @@
.webrtc, .activeCam{}
.activeCam video{
position: absolute;
width: 300px;
height: 20%;
height: 25%;
top: 10px;
right: 10px;
margin: 5px;
right: -100px;
transition: all 0.2s ease;
}
.activeCam:hover video{
right: 10px;
}
.activeCam video#myCamVideo{
width: 200px;
height: 100px;
height: 113px;
}
/*CSS size for 2 - 3 elements*/

View File

@ -1,3 +1,8 @@
const videoConstraint: {width : any, height: any, facingMode : string} = {
width: { ideal: 1280 },
height: { ideal: 720 },
facingMode: "user"
};
export class MediaManager {
localStream: MediaStream;
remoteVideo: Array<any> = new Array<any>();
@ -6,7 +11,10 @@ export class MediaManager {
cinema: any = null;
microphoneClose: any = null;
microphone: any = null;
constraintsMedia = {audio: true, video: true};
constraintsMedia : {audio : any, video : any} = {
audio: true,
video: videoConstraint
};
getCameraPromise : Promise<any> = null;
constructor() {
@ -47,7 +55,7 @@ export class MediaManager {
enabledCamera() {
this.cinemaClose.style.display = "none";
this.cinema.style.display = "block";
this.constraintsMedia.video = true;
this.constraintsMedia.video = videoConstraint;
this.localStream = null;
this.myCamVideo.srcObject = null;
}
@ -106,6 +114,13 @@ export class MediaManager {
.then((stream: MediaStream) => {
this.localStream = stream;
this.myCamVideo.srcObject = this.localStream;
//TODO resize remote cam
/*console.log(this.localStream.getTracks());
let videoMediaStreamTrack = this.localStream.getTracks().find((media : MediaStreamTrack) => media.kind === "video");
let {width, height} = videoMediaStreamTrack.getSettings();
console.info(`${width}x${height}`); // 6*/
return stream;
}).catch((err) => {
console.error(err);