[mirotalksfu] - fix & improvements

هذا الالتزام موجود في:
Miroslav Pejic
2022-04-14 17:02:46 +02:00
الأصل d4bcac88b3
التزام 3021c06630
4 ملفات معدلة مع 124 إضافات و60 حذوفات

عرض الملف

@@ -171,7 +171,9 @@ app.get(['/newroom'], (req, res) => {
app.get('/join/', (req, res) => { app.get('/join/', (req, res) => {
if (hostCfg.authenticated && Object.keys(req.query).length > 0) { if (hostCfg.authenticated && Object.keys(req.query).length > 0) {
log.debug('Direct Join', req.query); log.debug('Direct Join', req.query);
// http://localhost:3010/join?room=test&name=mirotalksfu&audio=1&video=1&notify=1 /**
* http://localhost:3010/join?room=test&name=mirotalksfu&audio=1&video=1&notify=1
*/
const { room, name, audio, video, notify } = req.query; const { room, name, audio, video, notify } = req.query;
if (room && name && audio && video && notify) { if (room && name && audio && video && notify) {
return res.sendFile(view.room); return res.sendFile(view.room);
@@ -417,7 +419,7 @@ io.on('connection', (socket) => {
socket.on('updatePeerInfo', (data) => { socket.on('updatePeerInfo', (data) => {
log.debug('Peer info update:', data); log.debug('Peer info update:', data);
// peer_info hand raise Or lower // peer_info audio video hand ... status
roomList.get(socket.room_id).getPeers().get(socket.id).updatePeerInfo(data); roomList.get(socket.room_id).getPeers().get(socket.id).updatePeerInfo(data);
roomList.get(socket.room_id).broadCast(socket.id, 'updatePeerInfo', data); roomList.get(socket.room_id).broadCast(socket.id, 'updatePeerInfo', data);
}); });
@@ -587,17 +589,11 @@ io.on('connection', (socket) => {
socket.on('producerClosed', (data) => { socket.on('producerClosed', (data) => {
log.debug('Producer close', data); log.debug('Producer close', data);
// peer_info audio Or video OFF // peer_info audio Or video OFF
roomList.get(socket.room_id).getPeers().get(socket.id).updatePeerInfo(data); roomList.get(socket.room_id).getPeers().get(socket.id).updatePeerInfo(data);
roomList.get(socket.room_id).closeProducer(socket.id, data.producer_id); roomList.get(socket.room_id).closeProducer(socket.id, data.producer_id);
}); });
socket.on('resume', async (_, callback) => {
await consumer.resume();
callback();
});
socket.on('getRoomInfo', (_, cb) => { socket.on('getRoomInfo', (_, cb) => {
log.debug('Send Room Info'); log.debug('Send Room Info');
cb(roomList.get(socket.room_id).toJson()); cb(roomList.get(socket.room_id).toJson());

عرض الملف

@@ -48,6 +48,9 @@ let initAudioButton = null;
let initVideoButton = null; let initVideoButton = null;
let initAudioVideoButton = null; let initAudioVideoButton = null;
let isProducerAudioOn = false;
let isProducerVideoOn = false;
let recTimer = null; let recTimer = null;
let recElapsedTime = null; let recElapsedTime = null;
@@ -715,6 +718,7 @@ function handleButtons() {
}; };
swapCameraButton.onclick = () => { swapCameraButton.onclick = () => {
rc.closeThenProduce(RoomClient.mediaType.video, null, true); rc.closeThenProduce(RoomClient.mediaType.video, null, true);
rc.updatePeerInfo(peer_name, rc.peer_id, 'video', true);
}; };
raiseHandButton.onclick = () => { raiseHandButton.onclick = () => {
rc.updatePeerInfo(peer_name, rc.peer_id, 'hand', true); rc.updatePeerInfo(peer_name, rc.peer_id, 'hand', true);
@@ -723,22 +727,28 @@ function handleButtons() {
rc.updatePeerInfo(peer_name, rc.peer_id, 'hand', false); rc.updatePeerInfo(peer_name, rc.peer_id, 'hand', false);
}; };
startAudioButton.onclick = () => { startAudioButton.onclick = () => {
rc.produce(RoomClient.mediaType.audio, microphoneSelect.value); isProducerAudioOn
? rc.resumeProducer(RoomClient.mediaType.audio)
: rc.produce(RoomClient.mediaType.audio, microphoneSelect.value);
rc.updatePeerInfo(peer_name, rc.peer_id, 'audio', true); rc.updatePeerInfo(peer_name, rc.peer_id, 'audio', true);
// rc.resumeProducer(RoomClient.mediaType.audio);
}; };
stopAudioButton.onclick = () => { stopAudioButton.onclick = () => {
rc.closeProducer(RoomClient.mediaType.audio); isProducerAudioOn ? rc.pauseProducer(RoomClient.mediaType.audio) : rc.closeProducer(RoomClient.mediaType.audio);
rc.updatePeerInfo(peer_name, rc.peer_id, 'audio', false); rc.updatePeerInfo(peer_name, rc.peer_id, 'audio', false);
// rc.pauseProducer(RoomClient.mediaType.audio);
}; };
startVideoButton.onclick = () => { startVideoButton.onclick = () => {
rc.produce(RoomClient.mediaType.video, videoSelect.value); isProducerVideoOn
// rc.resumeProducer(RoomClient.mediaType.video); ? rc.resumeProducer(RoomClient.mediaType.video)
: rc.produce(RoomClient.mediaType.video, videoSelect.value);
rc.updatePeerInfo(peer_name, rc.peer_id, 'video', true);
}; };
stopVideoButton.onclick = () => { stopVideoButton.onclick = () => {
rc.closeProducer(RoomClient.mediaType.video); isProducerVideoOn ? rc.pauseProducer(RoomClient.mediaType.video) : rc.closeProducer(RoomClient.mediaType.video);
// rc.pauseProducer(RoomClient.mediaType.video);
rc.updatePeerInfo(peer_name, rc.peer_id, 'video', false);
}; };
startScreenButton.onclick = () => { startScreenButton.onclick = () => {
rc.produce(RoomClient.mediaType.screen); rc.produce(RoomClient.mediaType.screen);
@@ -835,12 +845,14 @@ function handleSelects() {
// devices options // devices options
microphoneSelect.onchange = () => { microphoneSelect.onchange = () => {
rc.closeThenProduce(RoomClient.mediaType.audio, microphoneSelect.value); rc.closeThenProduce(RoomClient.mediaType.audio, microphoneSelect.value);
rc.updatePeerInfo(peer_name, rc.peer_id, 'audio', true);
}; };
speakerSelect.onchange = () => { speakerSelect.onchange = () => {
rc.attachSinkId(rc.myVideoEl, speakerSelect.value); rc.attachSinkId(rc.myVideoEl, speakerSelect.value);
}; };
videoSelect.onchange = () => { videoSelect.onchange = () => {
rc.closeThenProduce(RoomClient.mediaType.video, videoSelect.value); rc.closeThenProduce(RoomClient.mediaType.video, videoSelect.value);
rc.updatePeerInfo(peer_name, rc.peer_id, 'video', true);
}; };
// styling // styling
BtnsAspectRatio.onchange = () => { BtnsAspectRatio.onchange = () => {
@@ -956,42 +968,50 @@ function handleRoomClientEvents() {
hide(startAudioButton); hide(startAudioButton);
show(stopAudioButton); show(stopAudioButton);
setColor(startAudioButton, 'red'); setColor(startAudioButton, 'red');
isProducerAudioOn = true;
}); });
rc.on(RoomClient.EVENTS.pauseAudio, () => { rc.on(RoomClient.EVENTS.pauseAudio, () => {
console.log('Room Client pause audio'); console.log('Room Client pause audio');
hide(stopAudioButton); hide(stopAudioButton);
show(startAudioButton); show(startAudioButton);
sound('left');
}); });
rc.on(RoomClient.EVENTS.resumeAudio, () => { rc.on(RoomClient.EVENTS.resumeAudio, () => {
console.log('Room Client resume audio'); console.log('Room Client resume audio');
hide(startAudioButton); hide(startAudioButton);
show(stopAudioButton); show(stopAudioButton);
sound('joined');
}); });
rc.on(RoomClient.EVENTS.stopAudio, () => { rc.on(RoomClient.EVENTS.stopAudio, () => {
console.log('Room Client stop audio'); console.log('Room Client stop audio');
hide(stopAudioButton); hide(stopAudioButton);
show(startAudioButton); show(startAudioButton);
isProducerAudioOn = false;
}); });
rc.on(RoomClient.EVENTS.startVideo, () => { rc.on(RoomClient.EVENTS.startVideo, () => {
console.log('Room Client start video'); console.log('Room Client start video');
hide(startVideoButton); hide(startVideoButton);
show(stopVideoButton); show(stopVideoButton);
setColor(startVideoButton, 'red'); setColor(startVideoButton, 'red');
isProducerVideoOn = true;
}); });
rc.on(RoomClient.EVENTS.pauseVideo, () => { rc.on(RoomClient.EVENTS.pauseVideo, () => {
console.log('Room Client pause video'); console.log('Room Client pause video');
hide(stopVideoButton); hide(stopVideoButton);
show(startVideoButton); show(startVideoButton);
sound('left');
}); });
rc.on(RoomClient.EVENTS.resumeVideo, () => { rc.on(RoomClient.EVENTS.resumeVideo, () => {
console.log('Room Client resume video'); console.log('Room Client resume video');
hide(startVideoButton); hide(startVideoButton);
show(stopVideoButton); show(stopVideoButton);
sound('joined');
}); });
rc.on(RoomClient.EVENTS.stopVideo, () => { rc.on(RoomClient.EVENTS.stopVideo, () => {
console.log('Room Client stop video'); console.log('Room Client stop video');
hide(stopVideoButton); hide(stopVideoButton);
show(startVideoButton); show(startVideoButton);
isProducerVideoOn = false;
}); });
rc.on(RoomClient.EVENTS.startScreen, () => { rc.on(RoomClient.EVENTS.startScreen, () => {
console.log('Room Client start screen'); console.log('Room Client start screen');

عرض الملف

@@ -232,7 +232,7 @@ class RoomClient {
let peer_info = peers.get(peer).peer_info; let peer_info = peers.get(peer).peer_info;
// console.log('07 ----> Remote Peer info', peer_info); // console.log('07 ----> Remote Peer info', peer_info);
if (!peer_info.peer_video) { if (!peer_info.peer_video) {
await this.setVideoOff(peer_info, true); await this.setVideoDivOff(peer_info, true);
} }
} }
this.refreshParticipantsCount(); this.refreshParticipantsCount();
@@ -400,7 +400,8 @@ class RoomClient {
'setVideoOff', 'setVideoOff',
function (data) { function (data) {
console.log('Video off:', data); console.log('Video off:', data);
this.setVideoOff(data, true); this.setVideoOff(data.peer_id, true);
this.setVideoDivOff(data, true);
}.bind(this), }.bind(this),
); );
@@ -408,7 +409,7 @@ class RoomClient {
'removeMe', 'removeMe',
function (data) { function (data) {
console.log('Remove me:', data); console.log('Remove me:', data);
this.removeVideoOff(data.peer_id); this.removeVideoDivOff(data.peer_id);
participantsCount = data.peer_counts; participantsCount = data.peer_counts;
adaptAspectRatio(participantsCount); adaptAspectRatio(participantsCount);
}.bind(this), }.bind(this),
@@ -545,6 +546,7 @@ class RoomClient {
this.produce(mediaType.audio, microphoneSelect.value); this.produce(mediaType.audio, microphoneSelect.value);
} else { } else {
setColor(startAudioButton, 'red'); setColor(startAudioButton, 'red');
console.log('08 ----> Audio is off');
} }
if (this.isVideoAllowed) { if (this.isVideoAllowed) {
console.log('09 ----> Start video media'); console.log('09 ----> Start video media');
@@ -552,7 +554,7 @@ class RoomClient {
} else { } else {
setColor(startVideoButton, 'red'); setColor(startVideoButton, 'red');
console.log('09 ----> Video is off'); console.log('09 ----> Video is off');
this.setVideoOff(this.peer_info, false); this.setVideoDivOff(this.peer_info, false);
this.sendVideoOff(); this.sendVideoOff();
} }
} }
@@ -668,11 +670,11 @@ class RoomClient {
this.event(_EVENTS.startAudio); this.event(_EVENTS.startAudio);
break; break;
case mediaType.video: case mediaType.video:
this.setIsVideo(true); this.setIsVideo(this.peer_id, true);
this.event(_EVENTS.startVideo); this.event(_EVENTS.startVideo);
break; break;
case mediaType.screen: case mediaType.screen:
this.setIsScreen(true); this.setIsScreen(this.peer_id, true);
this.event(_EVENTS.startScreen); this.event(_EVENTS.startScreen);
break; break;
default: default:
@@ -768,8 +770,8 @@ class RoomClient {
} }
async handleProducer(id, type, stream) { async handleProducer(id, type, stream) {
let elem, vb, ts, d, p, i, b, fs, pm, pb; let elem, vb, ts, d, p, i, b, fs, pm, pb, av;
this.removeVideoOff(this.peer_id); this.removeVideoDivOff(this.peer_id);
d = document.createElement('div'); d = document.createElement('div');
d.className = 'Camera'; d.className = 'Camera';
d.id = id + '__d'; d.id = id + '__d';
@@ -779,6 +781,9 @@ class RoomClient {
elem.autoplay = true; elem.autoplay = true;
elem.poster = image.poster; elem.poster = image.poster;
this.isMobileDevice || type === mediaType.screen ? (elem.className = '') : (elem.className = 'mirror'); this.isMobileDevice || type === mediaType.screen ? (elem.className = '') : (elem.className = 'mirror');
av = document.createElement('img');
av.className = 'center pulsate';
av.id = this.peer_id + '__img';
vb = document.createElement('div'); vb = document.createElement('div');
vb.setAttribute('id', this.peer_id + '__vb'); vb.setAttribute('id', this.peer_id + '__vb');
vb.className = 'videoMenuBar fadein'; vb.className = 'videoMenuBar fadein';
@@ -810,6 +815,7 @@ class RoomClient {
vb.appendChild(ts); vb.appendChild(ts);
vb.appendChild(fs); vb.appendChild(fs);
d.appendChild(elem); d.appendChild(elem);
d.appendChild(av);
d.appendChild(pm); d.appendChild(pm);
d.appendChild(i); d.appendChild(i);
d.appendChild(p); d.appendChild(p);
@@ -817,10 +823,12 @@ class RoomClient {
this.videoMediaContainer.appendChild(d); this.videoMediaContainer.appendChild(d);
this.attachMediaStream(elem, stream, type, 'Producer'); this.attachMediaStream(elem, stream, type, 'Producer');
this.myVideoEl = elem; this.myVideoEl = elem;
this.handleFS(elem.id, fs.id); this.handleFS(elem.id, fs.id, av.id);
this.handleTS(elem.id, ts.id); this.handleTS(elem.id, ts.id, av.id);
this.popupPeerInfo(p.id, this.peer_info); this.popupPeerInfo(p.id, this.peer_info);
this.checkPeerInfoStatus(this.peer_info); this.checkPeerInfoStatus(this.peer_info);
this.setVideoAvatarImgName(av.id, this.peer_name);
this.peer_info.peer_video ? this.setVideoOn(this.peer_id) : this.setVideoOff(this.peer_id);
this.sound('joined'); this.sound('joined');
handleAspectRatio(); handleAspectRatio();
console.log('[addProducer] Video-element-count', this.videoMediaContainer.childElementCount); console.log('[addProducer] Video-element-count', this.videoMediaContainer.childElementCount);
@@ -919,11 +927,11 @@ class RoomClient {
this.event(_EVENTS.stopAudio); this.event(_EVENTS.stopAudio);
break; break;
case mediaType.video: case mediaType.video:
this.setIsVideo(false); this.setIsVideo(this.peer_id, false);
this.event(_EVENTS.stopVideo); this.event(_EVENTS.stopVideo);
break; break;
case mediaType.screen: case mediaType.screen:
this.setIsScreen(false); this.setIsScreen(this.peer_id, false);
this.event(_EVENTS.stopScreen); this.event(_EVENTS.stopScreen);
break; break;
default: default:
@@ -994,12 +1002,14 @@ class RoomClient {
} }
handleConsumer(id, type, stream, peer_name, peer_info) { handleConsumer(id, type, stream, peer_name, peer_info) {
let elem, vb, d, p, i, b, fs, ts, pb, pm; let elem, vb, d, p, i, b, fs, ts, pb, pm, av;
switch (type) { switch (type) {
case mediaType.video: case mediaType.video:
let remotePeerName = peer_info.peer_name;
let remotePeerId = peer_info.peer_id; let remotePeerId = peer_info.peer_id;
let remotePeerAudio = peer_info.peer_audio; let remotePeerAudio = peer_info.peer_audio;
this.removeVideoOff(remotePeerId); let remotePeerVideo = peer_info.peer_video;
this.removeVideoDivOff(remotePeerId);
d = document.createElement('div'); d = document.createElement('div');
d.className = 'Camera'; d.className = 'Camera';
d.id = id + '__d'; d.id = id + '__d';
@@ -1009,6 +1019,9 @@ class RoomClient {
elem.autoplay = true; elem.autoplay = true;
elem.className = ''; elem.className = '';
elem.poster = image.poster; elem.poster = image.poster;
av = document.createElement('img');
av.className = 'center pulsate';
av.id = remotePeerId + '__img';
vb = document.createElement('div'); vb = document.createElement('div');
vb.setAttribute('id', remotePeerId + '__vb'); vb.setAttribute('id', remotePeerId + '__vb');
vb.className = 'videoMenuBar fadein'; vb.className = 'videoMenuBar fadein';
@@ -1040,16 +1053,19 @@ class RoomClient {
vb.appendChild(ts); vb.appendChild(ts);
vb.appendChild(fs); vb.appendChild(fs);
d.appendChild(elem); d.appendChild(elem);
d.appendChild(av);
d.appendChild(i); d.appendChild(i);
d.appendChild(p); d.appendChild(p);
d.appendChild(pm); d.appendChild(pm);
d.appendChild(vb); d.appendChild(vb);
this.videoMediaContainer.appendChild(d); this.videoMediaContainer.appendChild(d);
this.attachMediaStream(elem, stream, type, 'Consumer'); this.attachMediaStream(elem, stream, type, 'Consumer');
this.handleFS(elem.id, fs.id); this.handleFS(elem.id, fs.id, av.id);
this.handleTS(elem.id, ts.id); this.handleTS(elem.id, ts.id, av.id);
this.popupPeerInfo(p.id, peer_info); this.popupPeerInfo(p.id, peer_info);
this.checkPeerInfoStatus(peer_info); this.checkPeerInfoStatus(peer_info);
this.setVideoAvatarImgName(av.id, remotePeerName);
remotePeerVideo ? this.setVideoOn(remotePeerId) : this.setVideoOff(remotePeerId, true);
this.sound('joined'); this.sound('joined');
handleAspectRatio(); handleAspectRatio();
console.log('[addConsumer] Video-element-count', this.videoMediaContainer.childElementCount); console.log('[addConsumer] Video-element-count', this.videoMediaContainer.childElementCount);
@@ -1093,12 +1109,26 @@ class RoomClient {
// HANDLE VIDEO OFF // HANDLE VIDEO OFF
// #################################################### // ####################################################
async setVideoOff(peer_info, remotePeer = false) { setVideoOff(peer_id, remotePeer = false) {
let avatarImg = this.getId(peer_id + '__img');
if (avatarImg) {
avatarImg.style.display = 'block';
}
}
setVideoOn(peer_id) {
let avatarImg = this.getId(peer_id + '__img');
if (avatarImg) {
avatarImg.style.display = 'none';
}
}
async setVideoDivOff(peer_info, remotePeer = false) {
let d, vb, i, h, b, p, pm, pb; let d, vb, i, h, b, p, pm, pb;
let peer_id = peer_info.peer_id; let peer_id = peer_info.peer_id;
let peer_name = peer_info.peer_name; let peer_name = peer_info.peer_name;
let peer_audio = peer_info.peer_audio; let peer_audio = peer_info.peer_audio;
this.removeVideoOff(peer_id); this.removeVideoDivOff(peer_id);
d = document.createElement('div'); d = document.createElement('div');
d.className = 'Camera'; d.className = 'Camera';
d.id = peer_id + '__videoOff'; d.id = peer_id + '__videoOff';
@@ -1136,15 +1166,15 @@ class RoomClient {
this.setVideoAvatarImgName(i.id, peer_name); this.setVideoAvatarImgName(i.id, peer_name);
this.getId(i.id).style.display = 'block'; this.getId(i.id).style.display = 'block';
handleAspectRatio(); handleAspectRatio();
console.log('[setVideoOff] Video-element-count', this.videoMediaContainer.childElementCount); console.log('[setVideoDivOff] Video-element-count', this.videoMediaContainer.childElementCount);
} }
removeVideoOff(peer_id) { removeVideoDivOff(peer_id) {
let pvOff = this.getId(peer_id + '__videoOff'); let pvOff = this.getId(peer_id + '__videoOff');
if (pvOff) { if (pvOff) {
pvOff.parentNode.removeChild(pvOff); pvOff.parentNode.removeChild(pvOff);
handleAspectRatio(); handleAspectRatio();
console.log('[removeVideoOff] Video-element-count', this.videoMediaContainer.childElementCount); console.log('[removeVideoDivOff] Video-element-count', this.videoMediaContainer.childElementCount);
this.sound('left'); this.sound('left');
} }
} }
@@ -1282,20 +1312,17 @@ class RoomClient {
if (b) b.className = this.peer_info.peer_audio ? html.audioOn : html.audioOff; if (b) b.className = this.peer_info.peer_audio ? html.audioOn : html.audioOff;
} }
setIsVideo(status) { setIsVideo(peer_id, status) {
this.peer_info.peer_video = status; if (this.peer_id == peer_id) this.peer_info.peer_video = status;
if (!this.peer_info.peer_video) { if (!status) {
this.setVideoOff(this.peer_info, false); this.setVideoOff(peer_id, false);
this.sendVideoOff(); } else {
this.setVideoOn(peer_id);
} }
} }
setIsScreen(status) { setIsScreen(peer_id, status) {
this.peer_info.peer_screen = status; if (this.peer_id == peer_id) this.peer_info.peer_screen = status;
if (!this.peer_info.peer_screen && !this.peer_info.peer_video) {
this.setVideoOff(this.peer_info, false);
this.sendVideoOff();
}
} }
sendVideoOff() { sendVideoOff() {
@@ -1303,7 +1330,7 @@ class RoomClient {
} }
// #################################################### // ####################################################
// GET // IS / GET
// #################################################### // ####################################################
isConnected() { isConnected() {
@@ -1314,6 +1341,11 @@ class RoomClient {
return this._isRecording; return this._isRecording;
} }
isHidden(elId) {
let el = this.getId(elId);
return el.style.display == 'none';
}
static get mediaType() { static get mediaType() {
return mediaType; return mediaType;
} }
@@ -1463,17 +1495,25 @@ class RoomClient {
if (elem == null) this.isVideoOnFullScreen = document.fullscreenEnabled; if (elem == null) this.isVideoOnFullScreen = document.fullscreenEnabled;
} }
handleFS(elemId, fsId) { handleFS(elemId, fsId, avatarId) {
let videoPlayer = this.getId(elemId); let videoPlayer = this.getId(elemId);
let btnFs = this.getId(fsId); let btnFs = this.getId(fsId);
this.setTippy(fsId, 'Full screen', 'top'); this.setTippy(fsId, 'Full screen', 'top');
btnFs.addEventListener('click', () => { btnFs.addEventListener('click', () => {
if (!this.isHidden(avatarId)) {
this.userLog('info', 'Full screen mode work when video is on', 'top-end');
return;
}
videoPlayer.style.pointerEvents = this.isVideoOnFullScreen ? 'auto' : 'none'; videoPlayer.style.pointerEvents = this.isVideoOnFullScreen ? 'auto' : 'none';
this.toggleFullScreen(videoPlayer); this.toggleFullScreen(videoPlayer);
this.isVideoOnFullScreen = this.isVideoOnFullScreen ? false : true; this.isVideoOnFullScreen = this.isVideoOnFullScreen ? false : true;
}); });
videoPlayer.addEventListener('click', () => { videoPlayer.addEventListener('click', () => {
if (!this.isHidden(avatarId)) {
this.userLog('info', 'Full screen mode work when video is on', 'top-end');
return;
}
if ((this.isMobileDevice && this.isVideoOnFullScreen) || !this.isMobileDevice) { if ((this.isMobileDevice && this.isVideoOnFullScreen) || !this.isMobileDevice) {
videoPlayer.style.pointerEvents = this.isVideoOnFullScreen ? 'auto' : 'none'; videoPlayer.style.pointerEvents = this.isVideoOnFullScreen ? 'auto' : 'none';
this.toggleFullScreen(videoPlayer); this.toggleFullScreen(videoPlayer);
@@ -1498,10 +1538,14 @@ class RoomClient {
// TAKE SNAPSHOT // TAKE SNAPSHOT
// #################################################### // ####################################################
handleTS(elemId, tsId) { handleTS(elemId, tsId, avatarId) {
let videoPlayer = this.getId(elemId); let videoPlayer = this.getId(elemId);
let btnTs = this.getId(tsId); let btnTs = this.getId(tsId);
btnTs.addEventListener('click', () => { btnTs.addEventListener('click', () => {
if (!this.isHidden(avatarId)) {
this.userLog('info', 'SnapShot work when video is on', 'top-end');
return;
}
this.sound('snapshot'); this.sound('snapshot');
let context, canvas, width, height, dataURL; let context, canvas, width, height, dataURL;
width = videoPlayer.videoWidth; width = videoPlayer.videoWidth;
@@ -2270,11 +2314,13 @@ class RoomClient {
Swal.fire({ Swal.fire({
allowOutsideClick: false, allowOutsideClick: false,
allowEscapeKey: false, allowEscapeKey: false,
showDenyButton: true,
background: swalBackground, background: swalBackground,
imageUrl: image.locked, imageUrl: image.locked,
input: 'text', input: 'text',
inputPlaceholder: 'Set Room password', inputPlaceholder: 'Set Room password',
confirmButtonText: `OK`, confirmButtonText: `OK`,
denyButtonText: `Cancel`,
showClass: { showClass: {
popup: 'animate__animated animate__fadeInDown', popup: 'animate__animated animate__fadeInDown',
}, },
@@ -2285,10 +2331,12 @@ class RoomClient {
if (!pwd) return 'Please enter the Room password'; if (!pwd) return 'Please enter the Room password';
this.RoomPassword = pwd; this.RoomPassword = pwd;
}, },
}).then(() => { }).then((result) => {
data.password = this.RoomPassword; if (result.isConfirmed) {
this.socket.emit('roomAction', data); data.password = this.RoomPassword;
this.roomStatus(action); this.socket.emit('roomAction', data);
this.roomStatus(action);
}
}); });
break; break;
case 'unlock': case 'unlock':
@@ -2447,7 +2495,7 @@ class RoomClient {
break; break;
case 'mute': case 'mute':
if (peer_id === this.peer_id || broadcast) { if (peer_id === this.peer_id || broadcast) {
this.closeProducer(mediaType.audio); isProducerAudioOn ? this.pauseProducer(mediaType.audio) : this.closeProducer(mediaType.audio);
this.updatePeerInfo(this.peer_name, this.peer_id, 'audio', false); this.updatePeerInfo(this.peer_name, this.peer_id, 'audio', false);
this.userLog( this.userLog(
'warning', 'warning',
@@ -2459,7 +2507,8 @@ class RoomClient {
break; break;
case 'hide': case 'hide':
if (peer_id === this.peer_id || broadcast) { if (peer_id === this.peer_id || broadcast) {
this.closeProducer(mediaType.video); isProducerVideoOn ? this.pauseProducer(mediaType.video) : this.closeProducer(mediaType.video);
this.updatePeerInfo(this.peer_name, this.peer_id, 'video', false);
this.userLog( this.userLog(
'warning', 'warning',
from_peer_name + ' ' + _PEER.videoOff + ' has closed yours video', from_peer_name + ' ' + _PEER.videoOff + ' has closed yours video',
@@ -2629,7 +2678,7 @@ class RoomClient {
this.setIsAudio(peer_id, status); this.setIsAudio(peer_id, status);
break; break;
case 'video': case 'video':
this.setIsVideo(status); this.setIsVideo(peer_id, status);
break; break;
case 'hand': case 'hand':
this.peer_info.peer_hand = status; this.peer_info.peer_hand = status;
@@ -2657,7 +2706,7 @@ class RoomClient {
this.setIsAudio(peer_id, status); this.setIsAudio(peer_id, status);
break; break;
case 'video': case 'video':
this.setIsVideo(status); this.setIsVideo(peer_id, status);
break; break;
case 'hand': case 'hand':
let peer_hand = this.getPeerHandBtn(peer_id); let peer_hand = this.getPeerHandBtn(peer_id);

عرض الملف

@@ -113,7 +113,6 @@ if (speechRecognition) {
console.info('Browser supports webkitSpeechRecognition'); console.info('Browser supports webkitSpeechRecognition');
} else { } else {
console.warn('This browser not supports webkitSpeechRecognition'); console.warn('This browser not supports webkitSpeechRecognition');
hide(chatSpeechStartButton);
} }
function startSpeech(action) { function startSpeech(action) {