<html>
    <head>
        <meta charset="utf-8" />
        <link type="text/css" rel="stylesheet" href="https://source.zoom.us/1.9.1/css/bootstrap.css" />
        <link type="text/css" rel="stylesheet" href="https://source.zoom.us/1.9.1/css/react-select.css" />
    </head>
    <body>
        <script src="https://source.zoom.us/1.9.1/lib/vendor/react.min.js"></script>
        <script src="https://source.zoom.us/1.9.1/lib/vendor/react-dom.min.js"></script>
        <script src="https://source.zoom.us/1.9.1/lib/vendor/redux.min.js"></script>
        <script src="https://source.zoom.us/1.9.1/lib/vendor/redux-thunk.min.js"></script>
        <script src="https://source.zoom.us/1.9.1/lib/vendor/jquery.min.js"></script>
        <script src="https://source.zoom.us/1.9.1/lib/vendor/lodash.min.js"></script>
        <script src="https://source.zoom.us/zoom-meeting-1.9.1.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/3.1.9/crypto-js.min.js"></script>
        <script type="text/javascript">
            var audioJoin = 0;
            var videoJoin = 0;

            function controlUserInterface(_) {
                var audioButton = document.getElementsByClassName('join-audio-by-voip__join-btn')[0];
                var audioContainer = document.getElementsByClassName('join-audio-container')[0];
                var leave = document.getElementsByClassName('footer__leave-btn-container')[0];
                var more = document.getElementsByClassName('more-button')[0];
                var participantControls = document.getElementsByClassName('participants-item__buttons')[0];
                var raiseHandContainer = document.getElementsByClassName('participants-section-container__participants-footer')[0];
                var videoButton = document.getElementsByClassName('send-video-container__btn')[0];
                var videoContainer = document.getElementsByClassName('send-video-container')[0];

                if (audioButton && !'%_AUDIO_MUTED_%' && audioJoin < 500) {
                    audioButton.click();
                    audioJoin++;
                }

                if (audioContainer && !'%_AUDIO_MUTED_%') {
                    audioContainer.style.visibility = 'hidden';
                }

                if (leave) {
                    leave.style.visibility = 'hidden';
                }

                if (more) {
                    more.style.visibility = 'hidden';
                }

                if (participantControls) {
                    participantControls.style.visibility = 'hidden';
                }

                if (raiseHandContainer && !'%_ALLOW_RAISE_HAND_%') {
                    raiseHandContainer.style.visibility = 'hidden';
                }

                if (videoButton && !'%_VIDEO_MUTED_%' && videoJoin < 500) {
                    videoButton.click();
                    videoJoin++;
                }

                if (videoContainer && !'%_VIDEO_MUTED_%') {
                    videoContainer.style.visibility = 'hidden';
                }

                requestAnimationFrame(controlUserInterface);
            }

            function startMeeting(credentials) {
                const ATTENDEE = 0;
                var signature = credentials.signature;

                if (!ZoomMtg.checkSystemRequirements()) {
                    alert('This system does not meet the necessary requirements for Zoom!');
                }

                ZoomMtg.setZoomJSLib('https://source.zoom.us/1.9.1/lib', '/av');
                ZoomMtg.preLoadWasm();
                ZoomMtg.prepareJssdk();

                if (!signature) {
                    signature = ZoomMtg.generateSignature({
                        meetingNumber: credentials.meetingNumber,
                        apiKey: credentials.apiKey,
                        apiSecret: credentials.apiSecret,
                        role: ATTENDEE,
                        error: function (res) {
                            alert(`Failed to generate signature: ${JSON.stringify(res)}`);
                        }
                    });
                }

                ZoomMtg.init({
                    audioPanelAlwaysOpen: false,
                    disableCallOut: true,
                    disableInvite: true,
                    disableJoinAudio: false,
                    disableRecord: true,
                    disableReport: true,
                    disableVoIP: false,
                    leaveUrl: 'doesnotexist',
                    isLockBottom: true,
                    isShowJoiningErrorDialog: true,
                    isSupportAV: true,
                    isSupportBreakout: false,
                    isSupportChat: '%_ALLOW_CHAT_%',
                    isSupportCC: '%_ALLOW_CLOSED_CAPTIONS_%',
                    isSupportPolling: false,
                    isSupportQA: false,
                    isSupportNonverbal: false,
                    screenShare: false,
                    sharingMode: 'both',
                    showMeetingHeader: true,
                    showPureSharingContent: false,
                    videoDrag: true,
                    videoHeader: true,
                    meetingInfo: [
                        'topic',
                        'host',
                        'participant',
                        //'mn',
                        //'pwd',
                        //'telPwd',
                        //'invite',
                        //'dc'
                    ],
                    error: function (res) {
                        alert(`Failed to initialize meeting: ${JSON.stringify(res)}`);
                    },
                    success: function () {
                        ZoomMtg.join({
                            apiKey: credentials.apiKey,
                            meetingNumber: credentials.meetingNumber,
                            passWord: credentials.password,
                            signature: signature,
                            userName: credentials.userName,
                            error: function (res) {
                                alert(`Failed to join meeting: ${JSON.stringify(res)}`);
                            },
                            success: function (res) {
                                requestAnimationFrame(controlUserInterface);
                            }
                        });
                    }
                });
            }

            function webMessageReceived(args) {
                if ('credentials' in args.data) {
                    startMeeting(args.data.credentials);
                }
            }

            window.addEventListener('unload', () => ZoomMtg.leaveMeeting({}));
            window.chrome.webview.addEventListener('message', webMessageReceived);
            window.chrome.webview.postMessage('credentials');
        </script>
    </body>
</html>