From 886ecb6366bc5ad9167eb816f50d3dd80e9f3b25 Mon Sep 17 00:00:00 2001
From: netpro2k <netpro2k@gmail.com>
Date: Mon, 4 Dec 2017 16:11:45 -0800
Subject: [PATCH] Fix issues with multiple screen shares and improve video
debug
---
src/components/networked-video-player.css | 11 ++++++++---
src/components/networked-video-player.js | 13 +++++++++++--
2 files changed, 19 insertions(+), 5 deletions(-)
diff --git a/src/components/networked-video-player.css b/src/components/networked-video-player.css
index 6c10dd330..e68593958 100644
--- a/src/components/networked-video-player.css
+++ b/src/components/networked-video-player.css
@@ -1,7 +1,12 @@
:local(.video) {
- position: absolute;
- bottom: 0;
height: 100px;
background: black;
- display: none;
+ margin: 5px;
+}
+
+:local(.container) {
+ position: absolute;
+ bottom: 0;
+ display: flex;
+ visibility: hidden; /* toggle to show debug video elements */
}
diff --git a/src/components/networked-video-player.js b/src/components/networked-video-player.js
index e2ceecf81..6e0218a9f 100644
--- a/src/components/networked-video-player.js
+++ b/src/components/networked-video-player.js
@@ -11,6 +11,14 @@ const nafConnected = function() {
AFRAME.registerComponent("networked-video-player", {
schema: {},
async init() {
+ let container = document.getElementById("nvp-debug-container");
+ if (!container) {
+ container = document.createElement("div");
+ container.id = "nvp-debug-container";
+ container.classList.add(styles.container);
+ document.body.appendChild(container);
+ }
+
await nafConnected();
const networkedEl = NAF.utils.getNetworkedEntity(this.el);
@@ -27,9 +35,10 @@ AFRAME.registerComponent("networked-video-player", {
}
const v = document.createElement("video");
+ v.id = `nvp-video-${ownerId}`;
v.classList.add(styles.video);
v.srcObject = new MediaStream(stream.getVideoTracks()); // We only want the video track so make a new MediaStream
- document.body.appendChild(v);
+ container.appendChild(v);
v.play();
this.videoEl = v;
@@ -46,7 +55,7 @@ AFRAME.registerComponent("networked-video-player", {
remove() {
if (this.videoEl) {
- this.videoEl.parent.removeChild(this.videoEl);
+ this.videoEl.parentNode.removeChild(this.videoEl);
}
}
});
--
GitLab