diff --git a/openvidu-testapp/src/app/components/dialogs/recording-properties/recording-properties.component.html b/openvidu-testapp/src/app/components/dialogs/recording-properties/recording-properties.component.html index bcfa6e75..35d6db45 100644 --- a/openvidu-testapp/src/app/components/dialogs/recording-properties/recording-properties.component.html +++ b/openvidu-testapp/src/app/components/dialogs/recording-properties/recording-properties.component.html @@ -1,10 +1,10 @@
- + - + {{ enumerator }} @@ -17,13 +17,14 @@
Has audio - Has video + Has + video Ignore failed streams
+ *ngIf="isBroadcast || (recordingProperties.hasVideo && (recordingProperties.outputMode === 'COMPOSED' || recordingProperties.outputMode === 'COMPOSED_QUICK_START'))"> @@ -50,4 +51,4 @@ [(ngModel)]="recordingProperties.shmSize">
-
+ \ No newline at end of file diff --git a/openvidu-testapp/src/app/components/dialogs/recording-properties/recording-properties.component.ts b/openvidu-testapp/src/app/components/dialogs/recording-properties/recording-properties.component.ts index 1065ed8e..a95e5316 100644 --- a/openvidu-testapp/src/app/components/dialogs/recording-properties/recording-properties.component.ts +++ b/openvidu-testapp/src/app/components/dialogs/recording-properties/recording-properties.component.ts @@ -8,6 +8,9 @@ import { Recording, RecordingLayout, RecordingProperties } from 'openvidu-node-c }) export class RecordingPropertiesComponent { + @Input() + isBroadcast = false; + recMode = Recording.OutputMode; recLayouts = RecordingLayout; diff --git a/openvidu-testapp/src/app/components/dialogs/session-api-dialog/session-api-dialog.component.css b/openvidu-testapp/src/app/components/dialogs/session-api-dialog/session-api-dialog.component.css index 019f895f..01946a68 100644 --- a/openvidu-testapp/src/app/components/dialogs/session-api-dialog/session-api-dialog.component.css +++ b/openvidu-testapp/src/app/components/dialogs/session-api-dialog/session-api-dialog.component.css @@ -1,6 +1,7 @@ #response-text-area { width: 100%; color: #808080; + margin-top: 10px; } #response-text-area textarea { diff --git a/openvidu-testapp/src/app/components/dialogs/session-api-dialog/session-api-dialog.component.html b/openvidu-testapp/src/app/components/dialogs/session-api-dialog/session-api-dialog.component.html index 7698dbe2..b5efdda9 100644 --- a/openvidu-testapp/src/app/components/dialogs/session-api-dialog/session-api-dialog.component.html +++ b/openvidu-testapp/src/app/components/dialogs/session-api-dialog/session-api-dialog.component.html @@ -6,9 +6,10 @@ - + + @@ -33,22 +34,25 @@
Custom Ice Servers - + {{ i }} -
- - - - - - - - - +
+ + + + + + + + +
@@ -59,9 +63,10 @@ [disabled]="!connectionId">Disconnect -
+ +
@@ -86,13 +91,35 @@
+ + + + +
+ + + + + + + + +
+ + + + -
+ \ No newline at end of file diff --git a/openvidu-testapp/src/app/components/dialogs/session-api-dialog/session-api-dialog.component.ts b/openvidu-testapp/src/app/components/dialogs/session-api-dialog/session-api-dialog.component.ts index 7fe101b4..e3cd7823 100644 --- a/openvidu-testapp/src/app/components/dialogs/session-api-dialog/session-api-dialog.component.ts +++ b/openvidu-testapp/src/app/components/dialogs/session-api-dialog/session-api-dialog.component.ts @@ -19,13 +19,18 @@ export class SessionApiDialogComponent { response: string; recordingProperties: RecordingProperties; - openviduRoles = OpenViduRole; - customLayout = ''; recPropertiesIcon = 'add_circle'; showRecProperties = false; + + broadcastProperties: RecordingProperties; + broadcastPropertiesIcon = 'add_circle'; + showBroadcastProperties = false; + broadcastUrl: string = 'rtmp://172.17.0.1/live'; + numCustomIceServers = 0; configuredCustomIceServers = [] + openviduRoles = OpenViduRole; connectionProperties: ConnectionProperties = { record: true, role: OpenViduRole.PUBLISHER, @@ -41,6 +46,10 @@ export class SessionApiDialogComponent { if (!this.recordingProperties.mediaNode) { this.recordingProperties.mediaNode = { id: '' }; } + this.broadcastProperties = data.broadcastProperties; + if (!this.broadcastProperties.mediaNode) { + this.broadcastProperties.mediaNode = { id: '' }; + } } closeSession() { @@ -241,6 +250,11 @@ export class SessionApiDialogComponent { this.recPropertiesIcon = this.showRecProperties ? 'remove_circle' : 'add_circle'; } + toggleBroadcastProperties() { + this.showBroadcastProperties = !this.showBroadcastProperties; + this.broadcastPropertiesIcon = this.showBroadcastProperties ? 'remove_circle' : 'add_circle'; + } + changedNumIceServers(numIceServers: number) { // Save Previous Ice Servers let previousIceServers = []; @@ -250,14 +264,44 @@ export class SessionApiDialogComponent { // Fill empty ice servers this.configuredCustomIceServers = [] - for(let i = 1; i <= numIceServers; i++) { + for (let i = 1; i <= numIceServers; i++) { this.configuredCustomIceServers.push({}); } // Add previous items - for(let i = 0; i < previousIceServers.length && i < this.configuredCustomIceServers.length; i++) { + for (let i = 0; i < previousIceServers.length && i < this.configuredCustomIceServers.length; i++) { this.configuredCustomIceServers[0] = previousIceServers[0]; } } + startBroadcast() { + console.log('Starting broadcast'); + const finalBroadcastProperties = { + recordingLayout: this.broadcastProperties.recordingLayout, + customLayout: this.broadcastProperties.customLayout, + resolution: this.broadcastProperties.resolution, + frameRate: this.broadcastProperties.frameRate, + hasAudio: this.broadcastProperties.hasAudio, + shmSize: this.broadcastProperties.shmSize, + mediaNode: !this.broadcastProperties.mediaNode.id ? undefined : this.broadcastProperties.mediaNode + } + this.OV.startBroadcast(this.sessionId, this.broadcastUrl, finalBroadcastProperties) + .then(() => { + this.response = 'Broadcast started'; + }) + .catch(error => { + this.response = 'Error [' + error.message + ']'; + }); + } + + stopBroadcast() { + this.OV.stopBroadcst(this.sessionId) + .then(() => { + this.response = 'Broadcast stopped'; + }) + .catch(error => { + this.response = 'Error [' + error.message + ']'; + }); + } + } diff --git a/openvidu-testapp/src/app/components/openvidu-instance/openvidu-instance.component.ts b/openvidu-testapp/src/app/components/openvidu-instance/openvidu-instance.component.ts index 91466ef3..b46a566c 100644 --- a/openvidu-testapp/src/app/components/openvidu-instance/openvidu-instance.component.ts +++ b/openvidu-testapp/src/app/components/openvidu-instance/openvidu-instance.component.ts @@ -67,6 +67,9 @@ export class OpenviduInstanceComponent implements OnInit, OnChanges, OnDestroy { // Recording options recordingProperties: RecordingProperties; + // Broadcast options + broadcastProperties: RecordingProperties; + // OpenVidu Browser objects OV: OpenVidu; session: Session; @@ -292,7 +295,7 @@ export class OpenviduInstanceComponent implements OnInit, OnChanges, OnDestroy { updateEventList(eventName: string, eventContent: string, event: Event) { const eventInterface: OpenViduEvent = { eventName, eventContent, event }; this.events.push(eventInterface); - this.testFeedService.pushNewEvent({user: this.index, event}); + this.testFeedService.pushNewEvent({ user: this.index, event }); } toggleSubscribeTo(): void { @@ -698,7 +701,8 @@ export class OpenviduInstanceComponent implements OnInit, OnChanges, OnDestroy { openVidu: !!this.OV_NodeClient ? this.OV_NodeClient : new OpenViduAPI(this.openviduUrl, this.openviduSecret), session: this.sessionAPI, sessionId: !!this.session ? this.session.sessionId : this.sessionName, - recordingProperties: !!this.recordingProperties ? this.recordingProperties : this.sessionProperties.defaultRecordingProperties + recordingProperties: !!this.recordingProperties ? this.recordingProperties : this.sessionProperties.defaultRecordingProperties, + broadcastProperties: !!this.broadcastProperties ? this.broadcastProperties : this.sessionProperties.defaultRecordingProperties }, disableClose: true });