Below is some code describing what始s happening on this site right now.
Anyone on this page will connect directly to others in real-time, syncing mouse movement and clicks. (Try it, I dare you).
Trystero can connect peers via 馃寠 BitTorrent, 馃惁 Nostr, 馃摗 MQTT, 馃獝 IPFS, 鈿★笍 Supabase, and 馃敟 Firebase.
Right now you始re the only person with the page open, but you can cheat and just open this URL in another tab to see what it始s like with others.
Here始s how you use it.
Join a room with an app ID and a room ID:
import {joinRoom} from 'trystero'
const room = joinRoom({appId: 'trystero-lounge'}, '101')
Listen for peers joining and leaving (leaving out some boring UI code):
room.onPeerJoin(addCursor)
room.onPeerLeave(removeCursor)
Make some actions to send and respond to:
const [sendMove, getMove] = room.makeAction('mouseMove')
const [sendClick, getClick] = room.makeAction('click')
Broadcast your actions to other peers:
window.addEventListener('mousemove', e => sendMove([e.clientX, e.clientY]))
window.addEventListener('click', () => sendClick(randomFruit())
And listen for when peers send theirs:
getMove(([x, y], peerId) => setCursorPosition(peerId, x, y))
getClick((fruit, peerId) => dropFruitFrom(peerId, fruit))
That始s all this page is doing, but you can do much more like audio/video streams and binary data (like files). Peruse the readme to see how.
-o-<<| Dan Motzenbecker | github/dmotz