[mirotalk] - add focus mode on screen share

This commit is contained in:
Miroslav Pejic
2025-10-31 09:43:24 +01:00
parent e48a6abb50
commit f95832a289
5 changed files with 17 additions and 7 deletions
+1 -1
View File
@@ -45,7 +45,7 @@ dependencies: {
* @license For commercial use or closed source, contact us at license.mirotalk@gmail.com or purchase directly from CodeCanyon
* @license CodeCanyon: https://codecanyon.net/item/mirotalk-p2p-webrtc-realtime-video-conferences/38376661
* @author Miroslav Pejic - miroslav.pejic.85@gmail.com
* @version 1.6.09
* @version 1.6.10
*
*/
+2 -2
View File
@@ -1,12 +1,12 @@
{
"name": "mirotalk",
"version": "1.6.09",
"version": "1.6.10",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "mirotalk",
"version": "1.6.09",
"version": "1.6.10",
"license": "AGPL-3.0",
"dependencies": {
"@mattermost/client": "11.0.4",
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "mirotalk",
"version": "1.6.09",
"version": "1.6.10",
"description": "A free WebRTC browser-based video call",
"main": "server.js",
"scripts": {
+1 -1
View File
@@ -75,7 +75,7 @@ let brand = {
},
about: {
imageUrl: '../images/mirotalk-logo.gif',
title: 'WebRTC P2P v1.6.09',
title: 'WebRTC P2P v1.6.10',
html: `
<button
id="support-button"
+12 -2
View File
@@ -15,7 +15,7 @@
* @license For commercial use or closed source, contact us at license.mirotalk@gmail.com or purchase directly from CodeCanyon
* @license CodeCanyon: https://codecanyon.net/item/mirotalk-p2p-webrtc-realtime-video-conferences/38376661
* @author Miroslav Pejic - miroslav.pejic.85@gmail.com
* @version 1.6.09
* @version 1.6.10
*
*/
@@ -4114,6 +4114,7 @@ async function loadRemoteMediaStream(stream, peers, peer_id, kind) {
const remoteScreenToImgBtn = document.createElement('button');
const remoteScreenFullScreenBtn = document.createElement('button');
const remoteScreenPinBtn = document.createElement('button');
const remoteScreenFocusBtn = document.createElement('button');
const remoteScreenZoomInBtn = document.createElement('button');
const remoteScreenZoomOutBtn = document.createElement('button');
const remoteScreenPiPBtn = document.createElement('button');
@@ -4139,6 +4140,9 @@ async function loadRemoteMediaStream(stream, peers, peer_id, kind) {
remoteScreenPiPBtn.setAttribute('id', peer_id + 'screenPIP');
remoteScreenPiPBtn.className = className.pip;
remoteScreenFocusBtn.setAttribute('id', peer_id + '_screen_focusMode');
remoteScreenFocusBtn.className = className.hideAll;
remoteScreenPinBtn.setAttribute('id', peer_id + '_screen_pinUnpin');
remoteScreenPinBtn.className = className.pinUnpin;
@@ -4149,6 +4153,7 @@ async function loadRemoteMediaStream(stream, peers, peer_id, kind) {
setTippy(remoteScreenZoomInBtn, 'Zoom in screen', 'bottom');
setTippy(remoteScreenZoomOutBtn, 'Zoom out screen', 'bottom');
setTippy(remoteScreenPiPBtn, 'Toggle picture in picture', 'bottom');
setTippy(remoteScreenFocusBtn, 'Toggle Focus mode', 'bottom');
setTippy(remoteScreenPinBtn, 'Toggle Pin screen', 'bottom');
}
@@ -4158,6 +4163,8 @@ async function loadRemoteMediaStream(stream, peers, peer_id, kind) {
remoteScreenNavBar.className = 'navbar fadein';
!isMobileDevice && remoteScreenNavBar.appendChild(remoteScreenPinBtn);
buttons.remote.showVideoFocusBtn && remoteScreenNavBar.appendChild(remoteScreenFocusBtn);
buttons.remote.showSnapShotBtn && remoteScreenNavBar.appendChild(remoteScreenToImgBtn);
remoteScreenNavBar.appendChild(remoteScreenPiPBtn);
@@ -4195,6 +4202,9 @@ async function loadRemoteMediaStream(stream, peers, peer_id, kind) {
// pin/unpin video
handleVideoPinUnpin(remoteScreenMedia.id, remoteScreenPinBtn.id, remoteScreenWrap.id, peer_id, true);
// handle video focus mode
handleVideoFocusMode(remoteScreenFocusBtn, remoteScreenWrap, remoteScreenMedia);
// pin video on screen share
remoteScreenPinBtn.click();
@@ -12209,7 +12219,7 @@ function showAbout() {
Swal.fire({
background: swBg,
position: 'center',
title: brand.about?.title && brand.about.title.trim() !== '' ? brand.about.title : 'WebRTC P2P v1.6.09',
title: brand.about?.title && brand.about.title.trim() !== '' ? brand.about.title : 'WebRTC P2P v1.6.10',
imageUrl: brand.about?.imageUrl && brand.about.imageUrl.trim() !== '' ? brand.about.imageUrl : images.about,
customClass: { image: 'img-about' },
html: `