About custom layout... plz help

Issues developing apps
1

Hi I am making a web application in vue.js using openvidu.

I’m having trouble making a recording using a custom layout.

I would like to record without closing the session, changing the positions of the participants in some cases.

for this i

  1. Adjusted component placement in a custom layout using signaling.
    → The layout was changed in the debugging site, but it was not adjusted in the recording file. 
// index.html
    session.on('signal:test', (e) => {

            // test 1
            var video = document.getElementById(`remote-video-${e.from.stream.streamId}`).cloneNode()
            document.getElementById(`remote-video-${e.from.stream.streamId}`).remove()
            document.getElementById('big-video-div').appendChild(video)
            
            //test2
            var sub = subscribers.get(e.from.stream.streamId)
            var sub = subscribers.get(e.from.stream.streamId)
            sub.createVideoElement('big-video-div', "APPEND")

            //test3
            var sub = subscribers.get(e.from.stream.streamId)
            console.log(sub)
            console.log(subscribers)
            session.unsubscribe(sub)        
            .then(() => { 
                 var subscriber = session.subscribe(e.from.stream, 'big-video-div')
                 subscribers.set(e.from.stream.streamId, subscriber)
            })            
        });
  1. Received user information to be changed by signaling, and subscribed by receiving streamCreated again through publish and unpublish.
    → In the debugging site, the layout was changed, but in the recording file, it was not adjusted, and there was a problem that it was not displayed properly on the user’s screen.
        this.session.unpublish(this.publisher);
        this.session.publish(this.publisher);
        this.startRecording()

// index.html

    session.on("streamCreated", (event) => {
        console.log("recorder and nowStreamer")
        var now = JSON.parse(event.stream.connection.data).clientData
        console.log(recorder)
        console.log(now)
        if(now === recorder || JSON.parse(stream.connection.data).isEE === "Y"){
            session.subscribe(event.stream, 'big-video-div')
        } else {
            session.subscribe(event.stream, 'smaill-video-div')
        }
    });
  1. Disconnect the user with session.disconnect and reconnect.
    → There is a problem that the recording is done, but it is not displayed properly on the user’s screen.
        this.session.disconnect()

        const newOv = new OpenVidu();

        const ovInitSession = this.OV.initSession();

        this.getToken(this.mySessionId).then((token) => { ...

// index.html

    session.on("streamCreated", (event) => {
        console.log("recorder and nowStreamer")
        var now = JSON.parse(event.stream.connection.data).clientData
        console.log(recorder)
        console.log(now)
        if(now === recorder || JSON.parse(stream.connection.data).isEE === "Y"){
            session.subscribe(event.stream, 'big-video-div')
        } else {
            session.subscribe(event.stream, 'smaill-video-div')
        }
    });

why not?? Is there any other way??? :thinking: :laughing: :laughing: :laughing: :innocent: :innocent:

If there is no way, I’m going to do a way to record on the client. But is this possible in vue js??
Do you have a vue js or javascript reference?

I will wait for your reply thank you