@extends('layouts.admin')
@section('admin')
    <div id="root"></div>
@endsection

@section('js')

    <script src="https://unpkg.com/@zegocloud/zego-uikit-prebuilt/zego-uikit-prebuilt.js"></script>
    <script>
        window.onload = function () {
            function getUrlParams(url) {
                let urlStr = url.split('?')[1];
                const urlSearchParams = new URLSearchParams(urlStr);
                const result = Object.fromEntries(urlSearchParams.entries());
                return result;
            }


            // Generate a Token by calling a method.
            // @param 1: appID
            // @param 2: serverSecret
            // @param 3: Room ID
            // @param 4: User ID
            // @param 5: Username
            const roomID = getUrlParams(window.location.href)['roomID'] || (Math.floor(Math.random() * 10000) + "");
            const userID = Math.floor(Math.random() * 10000) + "";
            const userName = "userName" + userID;
            const appID = 651299240;
            const serverSecret = "8ddf52aa17b5f6d447f8384f32ec68e8";
            const kitToken = ZegoUIKitPrebuilt.generateKitTokenForTest(appID, serverSecret, roomID, userID, userName);


            // You can assign different roles based on url parameters.
            let role = getUrlParams(window.location.href)['role'] || 'Host';
            role = role === 'Host' ? ZegoUIKitPrebuilt.Host : ZegoUIKitPrebuilt.Audience;
            let config = {}
            if (role === 'Host') {
                config = {
                    turnOnCameraWhenJoining: true,
                    showMyCameraToggleButton: true,
                    showAudioVideoSettingsButton: true,
                    showScreenSharingButton: true,
                    showTextChat: true,
                    showUserList: true,
                }
            }
            const zp = ZegoUIKitPrebuilt.create(kitToken);
            zp.joinRoom({
                container: document.querySelector("#root"),
                scenario: {
                    mode: ZegoUIKitPrebuilt.LiveStreaming,
                    config: {
                        role,
                    },
                },
                sharedLinks: [{
                    name: 'Join as an audience',
                    url:
                        window.location.protocol + '//' +
                        window.location.host +
                        window.location.pathname +
                        '?roomID=' +
                        roomID +
                        '&role=Audience',
                }],
                ...config
            });
        }
    </script>

@endsection