From 06e6f496ee880d6d1541f53e1553359762879061 Mon Sep 17 00:00:00 2001 From: pabloFuente Date: Mon, 5 Mar 2018 23:54:12 +0100 Subject: [PATCH] Bug fix: 'videoElementCreated' and 'videoPlaying' events NOT launched when no id is passed to initPublisher() --- .../ts/OpenViduInternal/LocalRecorder.ts | 3 +- .../ts/OpenViduInternal/OpenViduInternal.ts | 2 +- .../ts/OpenViduInternal/Stream.ts | 109 ++++++++++-------- 3 files changed, 60 insertions(+), 54 deletions(-) diff --git a/openvidu-browser/ts/OpenViduInternal/LocalRecorder.ts b/openvidu-browser/ts/OpenViduInternal/LocalRecorder.ts index 42f0069b..bc2c8ee0 100644 --- a/openvidu-browser/ts/OpenViduInternal/LocalRecorder.ts +++ b/openvidu-browser/ts/OpenViduInternal/LocalRecorder.ts @@ -229,8 +229,7 @@ export class LocalRecorder { http.open("POST", endpoint, true); let sendable = new FormData(); - sendable.append("name", this.id); - sendable.append("file", this.blob); + sendable.append("file", this.blob, this.id + ".webm"); http.onreadystatechange = () => { if (http.readyState === 4) { diff --git a/openvidu-browser/ts/OpenViduInternal/OpenViduInternal.ts b/openvidu-browser/ts/OpenViduInternal/OpenViduInternal.ts index ecb57a92..a582fa61 100644 --- a/openvidu-browser/ts/OpenViduInternal/OpenViduInternal.ts +++ b/openvidu-browser/ts/OpenViduInternal/OpenViduInternal.ts @@ -137,7 +137,7 @@ export class OpenViduInternal { return this.localStream; } - cameraReady(localStream: Stream, parentId: string): HTMLVideoElement { + cameraReady(localStream: Stream, parentId: string) { this.localStream = localStream; let videoElement = this.localStream.playOnlyVideo(parentId, null); this.localStream.emitStreamReadyEvent(); diff --git a/openvidu-browser/ts/OpenViduInternal/Stream.ts b/openvidu-browser/ts/OpenViduInternal/Stream.ts index a828333e..a9b045ae 100644 --- a/openvidu-browser/ts/OpenViduInternal/Stream.ts +++ b/openvidu-browser/ts/OpenViduInternal/Stream.ts @@ -146,8 +146,8 @@ export class Stream { return this.video; } - setVideoElement(video: HTMLVideoElement) { - this.video = video; + setVideoElement(video) { + if (!!video) this.video = video; } getParentId() { @@ -267,45 +267,49 @@ export class Stream { } playOnlyVideo(parentElement, thumbnailId) { + if (!!parentElement) { - this.video = document.createElement('video'); + this.video = document.createElement('video'); - this.video.id = (this.local ? 'local-' : 'remote-') + 'video-' + this.streamId; - this.video.autoplay = true; - this.video.controls = false; - this.ee.emitEvent('mediastream-updated'); + this.video.id = (this.local ? 'local-' : 'remote-') + 'video-' + this.streamId; + this.video.autoplay = true; + this.video.controls = false; + this.ee.emitEvent('mediastream-updated'); - if (this.local && !this.displayMyRemote()) { - this.video.muted = true; - this.video.oncanplay = () => { - console.info("Local 'Stream' with id [" + this.streamId + "] video is now playing"); - this.ee.emitEvent('video-is-playing', [{ - element: this.video - }]); - }; - } else { - this.video.title = this.streamId; - } - - if (typeof parentElement === "string") { - this.parentId = parentElement; - - let parentElementDom = document.getElementById(parentElement); - if (parentElementDom) { - this.video = parentElementDom.appendChild(this.video); - this.ee.emitEvent('video-element-created-by-stream', [{ - element: this.video - }]); - this.isVideoELementCreated = true; + if (this.local && !this.displayMyRemote()) { + this.video.muted = true; + this.video.onplaying = () => { + console.info("Local 'Stream' with id [" + this.streamId + "] video is now playing"); + this.ee.emitEvent('video-is-playing', [{ + element: this.video + }]); + }; + } else { + this.video.title = this.streamId; } - } else { - this.parentId = parentElement.id; - this.video = parentElement.appendChild(this.video); + + if (typeof parentElement === "string") { + this.parentId = parentElement; + + let parentElementDom = document.getElementById(parentElement); + if (parentElementDom) { + this.video = parentElementDom.appendChild(this.video); + this.ee.emitEvent('video-element-created-by-stream', [{ + element: this.video + }]); + this.isVideoELementCreated = true; + } + } else { + this.parentId = parentElement.id; + this.video = parentElement.appendChild(this.video); + } + + this.isReadyToPublish = true; + + return this.video; } - this.isReadyToPublish = true; - - return this.video; + return null; } playThumbnail(thumbnailId) { @@ -602,22 +606,25 @@ export class Stream { } } - // let thumbnailId = this.video.thumb; - this.video.oncanplay = () => { - if (this.local && this.displayMyRemote()) { - console.info("Your own remote 'Stream' with id [" + this.streamId + "] video is now playing"); - this.ee.emitEvent('remote-video-is-playing', [{ - element: this.video - }]); - } else if (!this.local && !this.displayMyRemote()) { - console.info("Remote 'Stream' with id [" + this.streamId + "] video is now playing"); - this.ee.emitEvent('video-is-playing', [{ - element: this.video - }]); - } - //show(thumbnailId); - //this.hideSpinner(this.streamId); - }; + + if (!!this.video) { + // let thumbnailId = this.video.thumb; + this.video.onplaying = () => { + if (this.local && this.displayMyRemote()) { + console.info("Your own remote 'Stream' with id [" + this.streamId + "] video is now playing"); + this.ee.emitEvent('remote-video-is-playing', [{ + element: this.video + }]); + } else if (!this.local && !this.displayMyRemote()) { + console.info("Remote 'Stream' with id [" + this.streamId + "] video is now playing"); + this.ee.emitEvent('video-is-playing', [{ + element: this.video + }]); + } + //show(thumbnailId); + //this.hideSpinner(this.streamId); + }; + } this.room.emitEvent('stream-subscribed', [{ stream: this }]);