renyicun
/
ZhongMianAdmin


			
				
					
						
						
							12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
							<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>主持人</title>
        <style>
            html,
            body {
                width: 100%;
                height: 100%;
                margin: 0;
                overflow: hidden;
            }
            .scene {
                width: 100%;
                height: 100%;
            }
            #toolbar {
                position: absolute;
                left: 0;
                bottom: 0;
                z-index: 1000;
            }
        </style>
    </head>
    <body>
        <div id="scene" class="scene"></div>
        <script src="../../libs/socket.io.min.js"></script>
        <script src="//4dkk.4dage.com/v4/sdk/4.2.2/kankan-sdk-deps.js"></script>
        <script src="//4dkk.4dage.com/v4/sdk/4.2.2/kankan-sdk.js"></script>
        <script>
            function getURLParams(params) {
                var p = []
                for (let key in params) {
                    p.push(key + '=' + encodeURIComponent(params[key]))
                }
                return p.join('&')
            }

            function createSocket(config) {
                var socket = io('https://epx-ws.4dkankan.com/', {
                    path: '/ws-sync',
                    transports: ['websocket'],
                })
                return socket
            }

            var kankan = null
            var isJoined = false
            var socket = createSocket()

            socket.on('connect', () => {
                socket.emit('join', {
                    userId: Date.now().toString(),
                    roomId: 'test-room',
                    role: 'leader',
                })
            })

            socket.on('join', data => {
                isJoined = true
            })

            socket.on('action', data => {
                if (data.type == 'error') {
                } else if (data.type == 'user-init') {
                    kankan.Connect.follow.sync()
                } 
            })

            socket.on('sync', data => {
                kankan.Connect.sync.receive(data)
            })

            var kankan = new KanKan({
                dom: '#scene',
                num: 'KJ-JYo2ZZyKKJ',
            })

            kankan.Scene.on('loaded', () => {
                kankan.Connect.sync.start()
            })

            kankan.Connect.sync.on('data', data => {
                if (isJoined) {
                    socket.emit('sync', data)
                }
            })

            kankan.render()
        </script>
    </body>
</html>