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 4 other peers are connected with you. Click to send them some fruit.
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