hi
I have a problem with custom layout recording, I have config the file, and is ok for the custom layout but what I want is user to have an active camera in meetings (full camera view can be in angular or mobile) and real-time change in the custom layout during recording
we have a client with Android Java and angular for web and NodeJs servers.
<html>
<head>
<script src="openvidu-browser-2.26.0.min.js"></script>
<style>
#videos {
display: flex;
background-color: black;
}
#videos video:first-child {
width: 100%;
}
#videos video:last-child {
width: 15%;
}
</style>
</head>
<body>
<div id="videos"></div>
</body>
<script>
var url = new URL(window.location.href);
var SESSION_ID = url.searchParams.get("sessionId");
var SECRET = url.searchParams.get("secret");
var TOKEN;
if (SESSION_ID && SECRET) {
TOKEN = 'wss://' + location.host + '?sessionId=' + SESSION_ID + '&secret=' + SECRET + '&recorder=true&role=SUBSCRIBER';
} else {
TOKEN = 'wss://' + location.host + '/?recorder=true&role=SUBSCRIBER';
}
var OV = new OpenVidu();
var session = OV.initSession();
console.log("event : ************************" , event);
session.on("streamCreated", (event) => {
var videosDiv = document.getElementById('videos');
var ActiveCamera = JSON.parse(event.stream.connection.data);
console.log("event : ************************" , event);
/*
if (videosDiv.childElementCount == 0) {
event.stream.videoElement.style.width = '100%';
} else {
event.stream.videoElement.style.width = '85%';
}
videosDiv.appendChild(event.stream.videoElement);
*/
});
session.connect(TOKEN)
.then(() => {
console.log('Recorder participant connected')
})
.catch(error => {
console.error(error)
});
session.connect(TOKEN)
.then(() => {
console.log('Recorder participant connected')
})
.catch(error => {
console.error(error)
});
</script>
</html>
regards