diff --git a/app/src/Server.js b/app/src/Server.js
index a8f1a6bc..df7927cf 100644
--- a/app/src/Server.js
+++ b/app/src/Server.js
@@ -55,7 +55,7 @@ dev dependencies: {
* @license For commercial or closed source, contact us at license.mirotalk@gmail.com or purchase directly via CodeCanyon
* @license CodeCanyon: https://codecanyon.net/item/mirotalk-sfu-webrtc-realtime-video-conferences/40769970
* @author Miroslav Pejic - miroslav.pejic.85@gmail.com
- * @version 1.6.95
+ * @version 1.6.96
*
*/
diff --git a/package.json b/package.json
index 4ed1252e..0e54f0d7 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "mirotalksfu",
- "version": "1.6.95",
+ "version": "1.6.96",
"description": "WebRTC SFU browser-based video calls",
"main": "Server.js",
"scripts": {
diff --git a/public/js/Room.js b/public/js/Room.js
index 1cad0b8f..608d5ba3 100644
--- a/public/js/Room.js
+++ b/public/js/Room.js
@@ -11,7 +11,7 @@ if (location.href.substr(0, 5) !== 'https') location.href = 'https' + location.h
* @license For commercial or closed source, contact us at license.mirotalk@gmail.com or purchase directly via CodeCanyon
* @license CodeCanyon: https://codecanyon.net/item/mirotalk-sfu-webrtc-realtime-video-conferences/40769970
* @author Miroslav Pejic - miroslav.pejic.85@gmail.com
- * @version 1.6.95
+ * @version 1.6.96
*
*/
@@ -4900,7 +4900,7 @@ function showAbout() {
imageUrl: image.about,
customClass: { image: 'img-about' },
position: 'center',
- title: 'WebRTC SFU v1.6.95',
+ title: 'WebRTC SFU v1.6.96',
html: `
diff --git a/public/js/RoomClient.js b/public/js/RoomClient.js
index e703e13d..f1706f67 100644
--- a/public/js/RoomClient.js
+++ b/public/js/RoomClient.js
@@ -9,7 +9,7 @@
* @license For commercial or closed source, contact us at license.mirotalk@gmail.com or purchase directly via CodeCanyon
* @license CodeCanyon: https://codecanyon.net/item/mirotalk-sfu-webrtc-realtime-video-conferences/40769970
* @author Miroslav Pejic - miroslav.pejic.85@gmail.com
- * @version 1.6.95
+ * @version 1.6.96
*
*/
@@ -3574,25 +3574,19 @@ class RoomClient {
// No video stream detected or is video share from URL...
if (!video.srcObject || video.id === '__videoShare') return;
- let videoPIPAllowed = false;
+ const videoElement = rc.getId(video.id);
- // get video element
- const videoPlayer = rc.getId(video.id);
+ const isPIPAllowed = !videoElement.classList.contains('videoCircle'); // Check if not in privacy mode
- // Check if video can be add on pipVideo
- if ([rc.videoProducerId, rc.screenProducerId].includes(video.id)) {
- // PRODUCER
- videoPIPAllowed = !videoPlayer.classList.contains('videoCircle'); // not in privacy mode
- console.log('DOCUMENT PIP PRODUCER videoPIPAllowed -----> ' + videoPIPAllowed);
- } else {
- // CONSUMER
- videoPIPAllowed = !videoPlayer.classList.contains('videoCircle'); // not in privacy mode
- console.log('DOCUMENT PIP CONAUMER videoPIPAllowed -----> ' + videoPIPAllowed);
- }
+ const logMessage = [rc.videoProducerId, rc.screenProducerId].includes(video.id)
+ ? `DOCUMENT PIP PRODUCER: PiP allowed? -----> ${isPIPAllowed}`
+ : `DOCUMENT PIP CONSUMER: PiP allowed? -----> ${isPIPAllowed}`;
- if (!videoPIPAllowed) return;
+ console.log(logMessage);
- // Video is ON not in privacy mode continue....
+ if (!isPIPAllowed) return;
+
+ // Video is ON and not in privacy mode continue....
foundVideo = true;
@@ -3605,6 +3599,19 @@ class RoomClient {
pipVideo.muted = true;
pipVideoContainer.append(pipVideo);
+
+ const videoElementObserver = new MutationObserver((mutations) => {
+ mutations.forEach((mutation) => {
+ if (mutation.type === 'attributes' && mutation.attributeName === 'class') {
+ // Handle class changes in video elements
+ console.log(`Video ${mutation.target.id} class changed:`, mutation.target.className);
+ cloneVideoElements();
+ }
+ });
+ });
+
+ // Start observing for new videos and class changes
+ videoElementObserver.observe(video, { attributes: true, attributeFilter: ['class'] });
});
return foundVideo;