123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778 |
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8" />
- <meta name="viewport" content="width=device-width, initial-scale=1.0" />
- <title>Document</title>
- <style>
- html,
- body {
- width: 100%;
- height: 100%;
- margin: 0;
- overflow: hidden;
- }
- .scene {
- height: 100%;
- float: left;
- width: 50%;
- /* width: 100%; */
- height: 100%;
- }
- </style>
- </head>
- <body>
- <div id="scene" class="scene"></div>
- <div id="scene2" class="scene"></div>
- <!-- <script src="./js/socket.io.min.js"></script> -->
- <script src="./js/socket.io.min.v4.msgpack.js"></script>
- <script src="../dist/sdk/kankan-sdk-deps.js"></script>
- <script src="../dist/sdk/kankan-sdk.js"></script>
- <script>
- function createSocket(config) {
- return io('wss://test-socket.4dkankan.com', {
- path: '/fsl-node',
- query: {
- role: config.role,
- roomId: 'test-room',
- userId: Date.now().toString(),
- sceneNum: 't-iltt6PQ',
- userLimitNum: 30,
- from: 0,
- },
- })
- }
- var socket1 = createSocket({ role: 'leader' })
- var socket2 = createSocket({ role: 'customer' })
- socket1.onAny((event, data) => {
- console.log(data)
- })
- socket2.onAny((event, data) => {
- console.log(data)
- })
- var kankan1 = new KanKan({
- dom: '#scene',
- num: 't-iltt6PQ',
- })
- kankan1.render()
- var kankan2 = new KanKan({
- dom: '#scene2',
- num: 't-iltt6PQ',
- })
- kankan2.render()
- kankan1.Connect.sync.on('data', data => {
- kankan2.Broadcast.sync.receive(data)
- })
- kankan1.Connect.sync.start()
- kankan2.Connect.sync.on('data', data => {
- kankan1.Connect.sync.receive(data)
- })
- kankan2.Connect.sync.start()
- </script>
- </body>
- </html>
|