blog/source/files/magicbroad/assets/index.b2b53b3b.js.map

1 line
10 KiB
Text
Raw Normal View History

2022-06-09 01:09:09 +00:00
{"version":3,"file":"index.b2b53b3b.js","sources":["../../src/pages/DevMesh/index.tsx"],"sourcesContent":["import Button from \"@suid/material/Button\";\nimport TextField from \"@suid/material/TextField\";\nimport { Component, For, Show, createEffect, createResource, createSignal, onCleanup, onMount } from \"solid-js\";\nimport { useBroadClient } from \"../../helpers/BroadClient/solid\";\nimport { createSupabaseAuth } from \"solid-supabase\";\nimport { Participant } from \"../../helpers/BroadClient\";\nimport { validate as uuidValidate } from \"uuid\";\nimport { Peer, PeerConnectionState, Router } from \"../../helpers/mesh\";\nimport { SupabaseDatachannel } from \"../../helpers/mesh/supabase\";\n\nconst PeerView: Component<{peer: Peer}> = (props) => {\n const [connectionState, setConnectionState] = createSignal<PeerConnectionState>(PeerConnectionState.unknown);\n const [singalingState, setSingalingState] = createSignal<RTCSignalingState>(\"stable\");\n const [stateChangedCounter, setStateChangedCounter] = createSignal<number>(0);\n\n const onConnectionStateChanged = (newState: PeerConnectionState) => {\n setConnectionState(newState);\n setStateChangedCounter(prev => prev+1);\n };\n\n const onSingalingStateChanged = () => {\n setSingalingState(props.peer.connection.signalingState);\n setStateChangedCounter(prev => prev+1);\n };\n\n createEffect(() => {\n setConnectionState(props.peer.connectionState);\n });\n\n onMount(() => {\n props.peer.bus.on(\"connectionstatechange\", onConnectionStateChanged);\n props.peer.connection.addEventListener(\"signalingstatechange\", onSingalingStateChanged);\n });\n\n onCleanup(() => {\n props.peer.bus.detach(\"connectionstatechange\", onConnectionStateChanged);\n props.peer.connection.removeEventListener(\"signalingstatechange\", onSingalingStateChanged);\n });\n\n return <p>Peer \"{props.peer.userDeviceId}\" [changed x{stateChangedCounter()}], clk {props.peer.clk.toString()}, connectionState {connectionState()}, singalingState {singalingState()}</p>;\n};\n\nconst DevMesh: Component = () => {\n const [roomName, setRoomName] = createSignal<string>(\"\");\n const [roomId, setRoomId] = createSignal<string>(\"\");\n const [peers, setPeers] = createSignal<Peer[]>([], {equals: false});\n const broadClient = useBroadClient();\n const auth = createSupabaseAuth();\n\n const [routerG, setRouterG] = createSignal<Router>();\n\n const [participants, participantsCtl] = createResource<Participant[]>(() => {\n if (uuidValidate(roomId())) {\n return broadClient.getParticipants(roomId());\n }\n return [];\n });\n\n const connectNetwork = async (roomId: string) => {\n if (!await broadClient.isJoinedRoomById(roomId)) {\n await broadClient.joinRoomById(roomId);\n }\n participantsCtl.refetch();\n const alterChan = SupabaseDatachannel.ofRoom(broadClient.supabase, roomId, broadClient.getUserDeviceId());\n const router = new Router(broadClient.getUserDeviceId(), alterChan, roomId);\n router.bus.on(\"addpeer\", () => {\n setPeers(router.peers);\n });\n router.bus.on(\"removepeer\", (peer: Peer) => {\n peer.disconnect();\n setPeers(router.peers);\n });\n await router.broadcastPeerList();\n setRouterG(router);\n };\n\n const createRoom = async () => {\n const room = await broadClient.createRoom(roomName());\n setRoomId(room.id);\n setRoomName(room.name);\n await connectNetwork(room.id);\n };\n\n const enterRoom = async () => {\n const room = await broadClient.findRoomById(roomId());\n if (room) {\n setRoomId(room.id);\n setRoomName(room.name);\n await connectNetwork(room.id);\n } else {\n alert(`Could not found room ${roomId()}`);\n }\n };\n\n // We just need some cleanup:\n // eslint-disable-next-line solid/reactivi