The connection diagram is an animated visual indicator at the top of every P2P session, showing the real-time bilateral link between you and the other peer.
Visual States
The diagram shows both peers as browser icons connected by a line that animates based on the current state:
- Waiting — dotted gray line; peer's indicator pulses slowly
- Ready — dashed gray line; both peers online
- Connecting — yellow dashes scroll bidirectionally
- Connected — solid green line with a brief flash effect
- Reconnecting — yellow broken dashes with attempt counter
- Failed — static red dashed line
File Transfer Visualization
During a file transfer, data dots flow along the line from sender to receiver. The center badge shows the file name, transfer speed, and a mini progress bar.
Call Visualization
During audio/video calls, the line shows bidirectional data flow dots. The center badge displays the call type, duration, and quality level. Video calls show a thicker line to indicate higher bandwidth.
Peer Info (Whois)
Each side of the diagram shows detailed information about the peer's browser environment: browser name and version, operating system, screen resolution, language, timezone, CPU cores, and color depth. Touch-enabled devices show a touch indicator.