CODEWITHSUNDEEP
javascripthtmljitsijitsi-meet
Dennis
Dennis

Reputation: 193

Auto join jitsi meet

I am using Jitsi-Meet iframe Api to have a custom video calling feature. It is working as expected. However I would like to add a feature to this. The feature is to auto-join or auto-start the meeting on http load. How do I do this instead of the user manually pressing the join button?

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script src='https://meet.jit.si/external_api.js'></script>
    <script>
        $(document).ready(function () {
            var domain = "meet.jit.si";
            var options = {
                roomName: "TestingMeet",
                width: "100%",
                height: 1080,
                parentNode: document.querySelector("#meet"),
                configOverwrite: {

                },
                interfaceConfigOverwrite: {
                    DEFAULT_BACKGROUND: "#3b98ff",
                    noSsl: true,
                    SHOW_JITSI_WATERMARK: false,
                    HIDE_DEEP_LINKING_LOGO: true,
                    SHOW_BRAND_WATERMARK: false,
                    SHOW_WATERMARK_FOR_GUESTS: false,
                    SHOW_POWERED_BY: false,
                    TOOLBAR_BUTTONS: [
                        'microphone', 'camera', 'closedcaptions', 'desktop', 'fullscreen',
                        'fodeviceselection', 'hangup', 'profile', 'recording',
                        'livestreaming', 'etherpad', 'sharedvideo', 'settings', 'raisehand',
                        'videoquality', 'filmstrip', 'feedback', 'stats', 'shortcuts',
                        'tileview'
                    ],
                }
            }
            var api = new JitsiMeetExternalAPI(domain, options);
            api.executeCommands({
                displayName: ['nickname'],
                toggleVideo: [],
                toggleAudio: []
            });
        });
    </script>
    <style>
        .title {
            text-align: center;
            font-family: "Segoe UI";
            font-size: 48px;
        }
    </style>
</head>

<body>
    <div id="meet"></div>
</body>

</html>

Upvotes: 3

Views: 5460

Answers (3)

Vinicius Menezes
Vinicius Menezes

Reputation: 21

Now you should pass:

configOverwrite: {
    prejoinConfig: {
        enabled: false
    }
}

Upvotes: 2

Rishabh
Rishabh

Reputation: 11

Another way, just pass #config.prejoinPageEnabled=false, in the url and done.

Upvotes: 1

Dennis
Dennis

Reputation: 193

I got it, there is an option called as configOverwrite; and you have to add this inside:

var options = {
                roomName: "RoomName",
                width: "100%",
                height: 1080,
                parentNode: document.querySelector("#meet"),
                configOverwrite: {
                    prejoinPageEnabled: false //This here
                },
...
...

Upvotes: 8

Related Questions