From 190274762b075d6bbbfd15c1def779e43f291404 Mon Sep 17 00:00:00 2001
From: lazorfuzz <leontosy@gmail.com>
Date: Thu, 7 Jun 2018 03:31:15 -0700
Subject: [PATCH] Fix video chat example
---
README.md | 15 ++++++++++-----
1 file changed, 10 insertions(+), 5 deletions(-)
diff --git a/README.md b/README.md
index e68a910..7155b53 100644
--- a/README.md
+++ b/README.md
@@ -129,6 +129,7 @@ class Party extends Component {
this.state = {
nick: this.props.nick,
roomID: `party-${this.props.roomName}`,
+ peers: [],
muted: false,
camPaused: false
};
@@ -145,6 +146,7 @@ class Party extends Component {
autoRequestMedia: true,
// Optional: nickname
nick: this.state.nick,
+ debug: true
});
this.webrtc.on('videoAdded', this.addVideo);
@@ -155,11 +157,15 @@ class Party extends Component {
}
addVideo = (stream, peer) => {
- this.webrtc.attachStream(stream, this.remoteVideos[peer.id]);
+ this.setState({ peers: [...this.state.peers, peer] }, () => {
+ this.webrtc.attachStream(stream, this.remoteVideos[peer.id]);
+ });
}
removeVideo = (peer) => {
- // Clean up video
+ this.setState({
+ peers: this.state.peers.filter(p => !p.closed)
+ });
}
handleConnectionError = (peer) => {
@@ -175,10 +181,9 @@ class Party extends Component {
}
// Show fellow peers in the room
- generateRemotes = () => this.webrtc.getPeers().map((p) => (
+ generateRemotes = () => this.state.peers.map((p) => (
<div key={p.id}>
- // The video parent container needs a special id
- <div id={`${this.webrtc.getContainerId(p)}`}>
+ <div id={/* The video container needs a special id */ `${this.webrtc.getContainerId(p)}`}>
<video
key={this.webrtc.getId(p)}
// Important: The video element needs both an id and ref
--
GitLab