ambiser
/
openvidu
mirror of https://github.com/OpenVidu/openvidu.git
8
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

openvidu-components: Integrated broadcast feature

pull/780/head
Carlos Santos 2023-02-17 15:12:10 +01:00
parent 6aab00900e
commit d4be677613
25 changed files with 132 additions and 277 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
openvidu-components-angular/e2e/angular.test.ts
View File

@ -1050,30 +1050,6 @@ describe('Testing ATTRIBUTE DIRECTIVES', () => {
expect(await utils.isPresent('ov-streaming-activity')).to.be.false; expect(await utils.isPresent('ov-streaming-activity')).to.be.false;
}); });
it('should SHOW STARTING STREAMING status', async () => {
await browser.get(`${url}`);
await utils.clickOn('#ovActivitiesPanel-checkbox');
await utils.clickOn('#streamingInfo-checkbox');
await utils.clickOn('#apply-btn');
await utils.checkToolbarIsPresent();
// Open more options menu
await utils.clickOn('#activities-panel-btn');
await browser.sleep(500);
await utils.waitForElement('#custom-activities-panel');
console.log('before');
const status = await utils.waitForElement('#streaming-status');
expect(await status.getAttribute('innerText')).equals('STARTED');
});
it('should SHOW STREAMING ERROR', async () => { it('should SHOW STREAMING ERROR', async () => {
await browser.get(`${url}`); await browser.get(`${url}`);
@ -1099,7 +1075,6 @@ describe('Testing ATTRIBUTE DIRECTIVES', () => {
await browser.sleep(500); await browser.sleep(500);
const error = await utils.waitForElement('#streaming-error'); const error = await utils.waitForElement('#streaming-error');
expect(await error.getAttribute('innerText')).equals('TEST_ERROR'); expect(await error.getAttribute('innerText')).equals('TEST_ERROR');
}); });
}); });
@ -1258,6 +1233,5 @@ describe('Testing EVENTS', () => {
await utils.waitForElement('#onActivitiesPanelButtonClicked'); await utils.waitForElement('#onActivitiesPanelButtonClicked');
expect(await utils.isPresent('#onActivitiesPanelButtonClicked')).to.be.true; expect(await utils.isPresent('#onActivitiesPanelButtonClicked')).to.be.true;
}); });
}); });

5
openvidu-components-angular/e2e/webcomponent-app/app.js
View File

@ -129,7 +129,6 @@ $(document).ready(() => {
webComponent.addEventListener('onToolbarStopStreamingClicked', async (event) => { webComponent.addEventListener('onToolbarStopStreamingClicked', async (event) => {
appendElement('onToolbarStopStreamingClicked'); appendElement('onToolbarStopStreamingClicked');
webComponent.streamingActivityStreamingInfo = { status: 'stopped', id: '01' };
}); });
webComponent.addEventListener('onActivitiesPanelStartRecordingClicked', async (event) => { webComponent.addEventListener('onActivitiesPanelStartRecordingClicked', async (event) => {
@ -144,17 +143,15 @@ $(document).ready(() => {
// }); // });
webComponent.addEventListener('onActivitiesPanelDeleteRecordingClicked', (event) => webComponent.addEventListener('onActivitiesPanelDeleteRecordingClicked', (event) =>
appendElement('onActivitiesPanelDeleteRecordingClicked') appendElement('onActivitiesPanelDeleteRecordingClicked');
); );
webComponent.addEventListener('onActivitiesPanelStartStreamingClicked', async (event) => { webComponent.addEventListener('onActivitiesPanelStartStreamingClicked', async (event) => {
appendElement('onActivitiesPanelStartStreamingClicked'); appendElement('onActivitiesPanelStartStreamingClicked');
webComponent.streamingActivityStreamingInfo = { status: 'started', id: '01' };
}); });
webComponent.addEventListener('onActivitiesPanelStopStreamingClicked', async (event) => { webComponent.addEventListener('onActivitiesPanelStopStreamingClicked', async (event) => {
appendElement('onActivitiesPanelStopStreamingClicked'); appendElement('onActivitiesPanelStopStreamingClicked');
webComponent.streamingActivityStreamingInfo = { status: 'stopped', id: '01' };
}); });
webComponent.addEventListener('onSessionCreated', (event) => { webComponent.addEventListener('onSessionCreated', (event) => {

83
openvidu-components-angular/e2e/webcomponent.test.ts
View File

@ -830,50 +830,51 @@ describe('Testing videoconference EVENTS', () => {
expect(await utils.isPresent('#onToolbarStartRecordingClicked')).to.be.true; expect(await utils.isPresent('#onToolbarStartRecordingClicked')).to.be.true;
}); });
it('should receive the onToolbarStopStreamingClicked event', async () => { // TODO: it needs an OpenVidu PRO
await browser.get(`${url}&prejoin=false`); // it('should receive the onToolbarStopStreamingClicked event', async () => {
// await browser.get(`${url}&prejoin=false`);
await utils.checkSessionIsPresent(); // await utils.checkSessionIsPresent();
await utils.checkToolbarIsPresent(); // await utils.checkToolbarIsPresent();
// Open more options menu // // Open more options menu
await utils.waitForElement('#more-options-btn'); // await utils.waitForElement('#more-options-btn');
expect(await utils.isPresent('#more-options-btn')).to.be.true; // expect(await utils.isPresent('#more-options-btn')).to.be.true;
await utils.clickOn('#more-options-btn'); // await utils.clickOn('#more-options-btn');
await browser.sleep(500); // await browser.sleep(500);
await utils.waitForElement('.mat-menu-content'); // await utils.waitForElement('.mat-menu-content');
await utils.waitForElement('#streaming-btn'); // await utils.waitForElement('#streaming-btn');
await utils.clickOn('#streaming-btn'); // await utils.clickOn('#streaming-btn');
await browser.sleep(500); // await browser.sleep(500);
await utils.waitForElement('.sidenav-menu'); // await utils.waitForElement('.sidenav-menu');
await utils.waitForElement('#activities-container'); // await utils.waitForElement('#activities-container');
await utils.waitForElement('#streaming-url-input'); // await utils.waitForElement('#streaming-url-input');
const input = await utils.waitForElement('#rtmp-url-input'); // const input = await utils.waitForElement('#rtmp-url-input');
await input.sendKeys('RTMPurl'); // await input.sendKeys('RTMPurl');
await utils.clickOn('#streaming-btn'); // await utils.clickOn('#streaming-btn');
// Open more options menu // // Open more options menu
await utils.waitForElement('#more-options-btn'); // await utils.waitForElement('#more-options-btn');
expect(await utils.isPresent('#more-options-btn')).to.be.true; // expect(await utils.isPresent('#more-options-btn')).to.be.true;
await utils.clickOn('#more-options-btn'); // await utils.clickOn('#more-options-btn');
await browser.sleep(500); // await browser.sleep(500);
await utils.waitForElement('.mat-menu-content'); // await utils.waitForElement('.mat-menu-content');
await utils.waitForElement('#streaming-btn'); // await utils.waitForElement('#streaming-btn');
await utils.clickOn('#streaming-btn'); // await utils.clickOn('#streaming-btn');
// Checking if onToolbarStopStreamingClicked has been received // // Checking if onToolbarStopStreamingClicked has been received
await utils.waitForElement('#onToolbarStopStreamingClicked'); // await utils.waitForElement('#onToolbarStopStreamingClicked');
expect(await utils.isPresent('#onToolbarStopStreamingClicked')).to.be.true; // expect(await utils.isPresent('#onToolbarStopStreamingClicked')).to.be.true;
}); // });
it('should receive the onActivitiesPanelStartRecordingClicked event', async () => { it('should receive the onActivitiesPanelStartRecordingClicked event', async () => {
let element; let element;
@ -940,7 +941,7 @@ describe('Testing videoconference EVENTS', () => {
expect(await utils.isPresent('#onActivitiesPanelDeleteRecordingClicked')).to.be.true; expect(await utils.isPresent('#onActivitiesPanelDeleteRecordingClicked')).to.be.true;
}); });
it('should receive the onActivitiesPanelStartStreaming and onActivitiesPanelStopStreamingClicked events', async () => { it('should receive the onActivitiesPanelStartStreaming event', async () => {
await browser.get(`${url}&prejoin=false`); await browser.get(`${url}&prejoin=false`);
await utils.checkSessionIsPresent(); await utils.checkSessionIsPresent();
@ -972,16 +973,18 @@ describe('Testing videoconference EVENTS', () => {
// Checking if onActivitiesPanelStartStreamingClicked has been received // Checking if onActivitiesPanelStartStreamingClicked has been received
await utils.waitForElement('#onActivitiesPanelStartStreamingClicked'); await utils.waitForElement('#onActivitiesPanelStartStreamingClicked');
expect(await utils.isPresent('#onActivitiesPanelStartStreamingClicked')).to.be.true; expect(await utils.isPresent('#onActivitiesPanelStartStreamingClicked')).to.be.true;
expect(await utils.isPresent('#streaming-tag')).to.be.true;
await utils.clickOn('#stop-streaming-btn');
// Checking if onActivitiesPanelStopStreamingClicked has been received
await utils.waitForElement('#onActivitiesPanelStopStreamingClicked');
expect(await utils.isPresent('#onActivitiesPanelStopStreamingClicked')).to.be.true;
expect(await utils.isPresent('#streaming-tag')).to.be.false;
// TODO: it needs an OpenVidu PRO (onActivitiesPanelStopStreamingClicked event)
// expect(await utils.isPresent('#streaming-tag')).to.be.true;
// await utils.clickOn('#stop-streaming-btn');
// // Checking if onActivitiesPanelStopStreamingClicked has been received
// await utils.waitForElement('#onActivitiesPanelStopStreamingClicked');
// expect(await utils.isPresent('#onActivitiesPanelStopStreamingClicked')).to.be.true;
// expect(await utils.isPresent('#streaming-tag')).to.be.false;
}); });
it('should receive the onSessionCreated event', async () => { it('should receive the onSessionCreated event', async () => {

22
openvidu-components-angular/projects/openvidu-angular/src/lib/components/panel/activities-panel/streaming-activity/streaming-activity.component.ts
View File

@ -1,7 +1,6 @@
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, EventEmitter, Input, OnInit, Output } from '@angular/core'; import { ChangeDetectionStrategy, ChangeDetectorRef, Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
import { Subscription } from 'rxjs'; import { Subscription } from 'rxjs';
import { Signal } from '../../../../models/signal.model'; import { StreamingError, StreamingStatus } from '../../../../models/streaming.model';
import { StreamingError, StreamingInfo, StreamingStatus } from '../../../../models/streaming.model';
import { OpenViduAngularConfigService } from '../../../../services/config/openvidu-angular.config.service'; import { OpenViduAngularConfigService } from '../../../../services/config/openvidu-angular.config.service';
import { OpenViduService } from '../../../../services/openvidu/openvidu.service'; import { OpenViduService } from '../../../../services/openvidu/openvidu.service';
import { ParticipantService } from '../../../../services/participant/participant.service'; import { ParticipantService } from '../../../../services/participant/participant.service';
@ -71,7 +70,6 @@ export class StreamingActivityComponent implements OnInit {
*/ */
isRtmpModuleAvailable: boolean = true; isRtmpModuleAvailable: boolean = true;
private streamingSub: Subscription; private streamingSub: Subscription;
private streamingInfoSub: Subscription;
private streamingErrorSub: Subscription; private streamingErrorSub: Subscription;
/** /**
@ -91,7 +89,6 @@ export class StreamingActivityComponent implements OnInit {
ngOnInit(): void { ngOnInit(): void {
this.isSessionCreator = this.participantService.amIModerator(); this.isSessionCreator = this.participantService.amIModerator();
this.subscribeToStreamingStatus(); this.subscribeToStreamingStatus();
this.subscribeToStreamingInfo();
this.subscribeToStreamingError(); this.subscribeToStreamingError();
} }
@ -100,7 +97,6 @@ export class StreamingActivityComponent implements OnInit {
*/ */
ngOnDestroy() { ngOnDestroy() {
if (this.streamingSub) this.streamingSub.unsubscribe(); if (this.streamingSub) this.streamingSub.unsubscribe();
if (this.streamingInfoSub) this.streamingInfoSub.unsubscribe();
if (this.streamingErrorSub) this.streamingErrorSub.unsubscribe(); if (this.streamingErrorSub) this.streamingErrorSub.unsubscribe();
} }
@ -156,27 +152,11 @@ export class StreamingActivityComponent implements OnInit {
if (!!ev) { if (!!ev) {
this.streamingStatus = ev.status; this.streamingStatus = ev.status;
this.cd.markForCheck(); this.cd.markForCheck();
if (this.isSessionCreator) {
//TODO: Remove it when RTMP Exported was included on OV and streaming ready event was fired.
const signal =
this.streamingStatus === StreamingStatus.STARTED ? Signal.STREAMING_STARTED : Signal.STREAMING_STOPPED;
this.openviduService.sendSignal(signal);
}
} }
} }
); );
} }
//TODO: Remove this directive when RTMP Exported was included on OV and streaming ready event was fired.
private subscribeToStreamingInfo() {
this.streamingInfoSub = this.libService.streamingInfoObs.subscribe((info: StreamingInfo | undefined) => {
if (!!info) {
this.streamingService.updateStatus(info.status);
this.cd.markForCheck();
}
});
}
private subscribeToStreamingError() { private subscribeToStreamingError() {
this.streamingErrorSub = this.libService.streamingErrorObs.subscribe((error: StreamingError | undefined) => { this.streamingErrorSub = this.libService.streamingErrorObs.subscribe((error: StreamingError | undefined) => {
if (!!error) { if (!!error) {

14
openvidu-components-angular/projects/openvidu-angular/src/lib/components/session/session.component.ts
View File

@ -170,12 +170,14 @@ export class SessionComponent implements OnInit, OnDestroy {
async ngOnInit() { async ngOnInit() {
if (!this.usedInPrejoinPage) { if (!this.usedInPrejoinPage) {
if (!this.openviduService.getScreenToken()) { if (!this.openviduService.getScreenToken()) {
// Hide screenshare button if screen token does not exist // Hide screenshare button if screen token does not exist
this.libService.screenshareButton.next(false); this.libService.screenshareButton.next(false);
} }
this.session = this.openviduService.getWebcamSession(); this.session = this.openviduService.getWebcamSession();
this.sessionScreen = this.openviduService.getScreenSession(); this.sessionScreen = this.openviduService.getScreenSession();
this.subscribeToOpenViduException(); this.subscribeToOpenViduException();
this.subscribeToCaptionLanguage(); this.subscribeToCaptionLanguage();
this.subscribeToConnectionCreatedAndDestroyed(); this.subscribeToConnectionCreatedAndDestroyed();
@ -197,8 +199,7 @@ export class SessionComponent implements OnInit, OnDestroy {
this.subscribeToRecordingEvents(); this.subscribeToRecordingEvents();
} }
if (this.libService.isStreamingEnabled() && !this.participantService.amIModerator()) { if (this.libService.isStreamingEnabled()) {
//TODO: Remove it when RTMP Exported was included on OV and streaming ready event was fired.
this.subscribeToStreamingEvents(); this.subscribeToStreamingEvents();
} }
} }
@ -447,13 +448,8 @@ export class SessionComponent implements OnInit, OnDestroy {
} }
private subscribeToStreamingEvents() { private subscribeToStreamingEvents() {
this.session.on(`signal:${Signal.STREAMING_STARTED}`, (event: any) => { this.session.on('broadcastStarted', () => this.streamingService.updateStatus(StreamingStatus.STARTED));
this.streamingService.updateStatus(StreamingStatus.STARTED); this.session.on('broadcastStopped', () => this.streamingService.updateStatus(StreamingStatus.STOPPED));
});
this.session.on(`signal:${Signal.STREAMING_STOPPED}`, (event: any) => {
this.streamingService.updateStatus(StreamingStatus.STOPPED);
});
} }
private startUpdateLayoutInterval() { private startUpdateLayoutInterval() {

4
openvidu-components-angular/projects/openvidu-angular/src/lib/directives/api/api.directive.module.ts
View File

@ -9,7 +9,7 @@ import {
StreamDisplayParticipantNameDirective, StreamDisplayParticipantNameDirective,
StreamSettingsButtonDirective StreamSettingsButtonDirective
} from './stream.directive'; } from './stream.directive';
import { StreamingActivityStreamingErrorDirective, StreamingActivityStreamingInfoDirective } from './streaming-activity.directive'; import { StreamingActivityStreamingErrorDirective } from './streaming-activity.directive';
import { import {
ToolbarActivitiesPanelButtonDirective, ToolbarActivitiesPanelButtonDirective,
ToolbarBackgroundEffectsButtonDirective, ToolbarBackgroundEffectsButtonDirective,
@ -69,7 +69,6 @@ import {
RecordingActivityRecordingsListDirective, RecordingActivityRecordingsListDirective,
RecordingActivityRecordingErrorDirective, RecordingActivityRecordingErrorDirective,
StreamingActivityStreamingErrorDirective, StreamingActivityStreamingErrorDirective,
StreamingActivityStreamingInfoDirective,
AdminRecordingsListDirective, AdminRecordingsListDirective,
AdminLoginDirective AdminLoginDirective
], ],
@ -105,7 +104,6 @@ import {
RecordingActivityRecordingsListDirective, RecordingActivityRecordingsListDirective,
RecordingActivityRecordingErrorDirective, RecordingActivityRecordingErrorDirective,
StreamingActivityStreamingErrorDirective, StreamingActivityStreamingErrorDirective,
StreamingActivityStreamingInfoDirective,
AdminRecordingsListDirective, AdminRecordingsListDirective,
AdminLoginDirective AdminLoginDirective
] ]

63
openvidu-components-angular/projects/openvidu-angular/src/lib/directives/api/streaming-activity.directive.ts
View File

@ -1,8 +1,7 @@
import { AfterViewInit, Directive, ElementRef, Input, OnDestroy } from '@angular/core'; import { AfterViewInit, Directive, ElementRef, Input, OnDestroy } from '@angular/core';
import { StreamingError, StreamingInfo, StreamingStatus } from '../../models/streaming.model'; import { StreamingError } from '../../models/streaming.model';
import { OpenViduAngularConfigService } from '../../services/config/openvidu-angular.config.service'; import { OpenViduAngularConfigService } from '../../services/config/openvidu-angular.config.service';
/** /**
* The **streamingError** directive allows to show any possible error with the streaming in the {@link StreamingActivityComponent}. * The **streamingError** directive allows to show any possible error with the streaming in the {@link StreamingActivityComponent}.
* *
@ -54,63 +53,3 @@ export class StreamingActivityStreamingErrorDirective implements AfterViewInit,
} }
} }
} }
//TODO: Remove this directive when RTMP Exported was included on OV and streaming ready event was fired.
/**
* The **streamingInfo** directive allows show the live streaming info in {@link StreamingActivityComponent}.
*
* Default: `undefined`
*
* Type: {@link StreamingInfo}
*
* It can be used in the parent element {@link VideoconferenceComponent} specifying the name of the `streamingActivity` component:
*
* @example
* <ov-videoconference [streamingActivityStreamingInfo]="info"></ov-videoconference>
*
* \
* And it also can be used in the {@link StreamingActivityComponent}.
* @example
* <ov-streaming-activity [streamingInfo]="info"></ov-streaming-activity>
*/
@Directive({
selector: 'ov-videoconference[streamingActivityStreamingInfo], ov-streaming-activity[streamingInfo]'
})
export class StreamingActivityStreamingInfoDirective implements AfterViewInit, OnDestroy {
@Input() set streamingActivityStreamingInfo(value: StreamingInfo) {
this.streamingValue = value;
this.update(this.streamingValue);
}
@Input() set streamingInfo(value: StreamingInfo) {
this.streamingValue = value;
this.update(this.streamingValue);
}
streamingValue: StreamingInfo | undefined = undefined;
constructor(public elementRef: ElementRef, private libService: OpenViduAngularConfigService) {}
ngAfterViewInit() {
this.update(this.streamingValue);
}
ngOnDestroy(): void {
this.clear();
}
clear() {
this.streamingValue = undefined;
this.update(undefined);
}
update(value: StreamingInfo | undefined) {
if (this.libService.streamingInfo.getValue() !== value) {
if(value) {
// Forced value to right enum
const index = Object.values(StreamingStatus).indexOf(value.status.toLowerCase() as unknown as StreamingStatus);
const key = Object.keys(StreamingStatus)[index];
value.status = StreamingStatus[key];
}
this.libService.streamingInfo.next(value);
}
}
}

10
openvidu-components-angular/projects/openvidu-angular/src/lib/lang/cn.json
View File

@ -105,14 +105,14 @@
}, },
"STREAMING": { "STREAMING": {
"TITLE": "直播", "TITLE": "直播",
"SUBTITLE": "将会议直播给观众", "SUBTITLE": "向观众直播您的会议",
"CONTENT_SUBTITLE": "OpenVidu需要RTMP直播平台的URL。", "CONTENT_SUBTITLE": "OpenVidu需要直播平台的网址。",
"START": "开始直播", "START": "开始直播",
"STOP": "结束直播", "STOP": "结束直播",
"URL": "输入您的RTMP URL", "URL": "插入您的直播网址",
"CANCEL": "取消", "CANCEL": "取消",
"REQUIRED_URL": "RTMP url 是必需的", "REQUIRED_URL": "需要提供直播网址",
"NO_MODERATOR": "只有主持人才能开始流媒体" "NO_MODERATOR": "只有MODERATOR才能开始直播"
} }
}, },
"ERRORS": { "ERRORS": {

12
openvidu-components-angular/projects/openvidu-angular/src/lib/lang/de.json
View File

@ -105,14 +105,14 @@
}, },
"STREAMING": { "STREAMING": {
"TITLE": "Streaming", "TITLE": "Streaming",
"SUBTITLE": "Streamen Sie Ihr Meeting an Ihr Publikum", "SUBTITLE": "Streamen Sie Ihr Meeting für Ihr Publikum",
"CONTENT_SUBTITLE": "OpenVidu benötigt die RTMP-URL der Streaming-Plattform.", "CONTENT_SUBTITLE": "OpenVidu benötigt die URL der Streaming-Plattform.",
"START": "Streaming starten", "START": "Streaming starten",
"STOP": "Streaming beenden", "STOP": "Streaming beenden",
"URL": "Geben Sie Ihre RTMP-URL ein", "URL": "Geben Sie Ihre Streaming-URL ein",
"CANCEL": "Absagen", "CANCEL": "Abbrechen",
"REQUIRED_URL": "RTMP url ist erforderlich", "REQUIRED_URL": "Die Streaming-URL ist erforderlich",
"NO_MODERATOR": "Nur der Moderator kann den Stream starten" "NO_MODERATOR": "Nur der MODERATOR kann das Streaming starten"
} }
}, },
"ERRORS": { "ERRORS": {

6
openvidu-components-angular/projects/openvidu-angular/src/lib/lang/en.json
View File

@ -107,12 +107,12 @@
"STREAMING": { "STREAMING": {
"TITLE": "Streaming", "TITLE": "Streaming",
"SUBTITLE": "Stream your meeting to your audience", "SUBTITLE": "Stream your meeting to your audience",
"CONTENT_SUBTITLE": "OpenVidu need the RTMP url of the streaming platform.", "CONTENT_SUBTITLE": "OpenVidu need the url of the streaming platform.",
"START": "Start streaming", "START": "Start streaming",
"STOP": "End streaming", "STOP": "End streaming",
"URL": "Insert your RTMP url", "URL": "Insert your streaming url",
"CANCEL": "Cancel", "CANCEL": "Cancel",
"REQUIRED_URL": "The RTMP url is required", "REQUIRED_URL": "The streaming url is required",
"NO_MODERATOR": "Only the MODERATOR can start the streaming" "NO_MODERATOR": "Only the MODERATOR can start the streaming"
} }
}, },

4
openvidu-components-angular/projects/openvidu-angular/src/lib/lang/es.json
View File

@ -106,10 +106,10 @@
"STREAMING": { "STREAMING": {
"TITLE": "Streaming", "TITLE": "Streaming",
"SUBTITLE": "Comparte tu llamada con tu público", "SUBTITLE": "Comparte tu llamada con tu público",
"CONTENT_SUBTITLE": "OpenVidu necesita la url RTMP de tu plataforma de streaming.", "CONTENT_SUBTITLE": "OpenVidu necesita la url de tu plataforma de streaming.",
"START": "Empezar streaming", "START": "Empezar streaming",
"STOP": "Finalizar streaming", "STOP": "Finalizar streaming",
"URL": "Inserta tu url RTMP", "URL": "Inserta tu url de streaming",
"CANCEL": "Cancelar", "CANCEL": "Cancelar",
"NO_MODERATOR": "Solo el MODERADOR puede iniciar el streaming" "NO_MODERATOR": "Solo el MODERADOR puede iniciar el streaming"
} }

16
openvidu-components-angular/projects/openvidu-angular/src/lib/lang/fr.json
View File

@ -104,15 +104,15 @@
"NO_MODERATOR": "Seul le MODERATEUR peut lancer l'enregistrement" "NO_MODERATOR": "Seul le MODERATEUR peut lancer l'enregistrement"
}, },
"STREAMING": { "STREAMING": {
"TITLE": "Diffusion", "TITLE": "Streaming",
"SUBTITLE": "Diffusez votre réunion à votre public", "SUBTITLE": "Diffusez votre réunion en direct à votre public",
"CONTENT_SUBTITLE": "OpenVidu a besoin de l'URL RTMP de la plateforme de diffusion.", "CONTENT_SUBTITLE": "OpenVidu a besoin de l'URL de la plateforme de streaming.",
"START": "Démarrer la diffusion", "START": "Commencer le streaming",
"STOP": "Arrêter la diffusion", "STOP": "Arrêter le streaming",
"URL": "Insérez votre URL RTMP", "URL": "Insérez votre URL de streaming",
"CANCEL": "Annuler", "CANCEL": "Annuler",
"REQUIRED_URL": "L'URL RTMP est obligatoire", "REQUIRED_URL": "L'URL de streaming est requise",
"NO_MODERATOR": "Seul le MODÉRATEUR peut démarrer le streaming" "NO_MODERATOR": "Seul le MODERATEUR peut démarrer le streaming"
} }
}, },
"ERRORS": { "ERRORS": {

12
openvidu-components-angular/projects/openvidu-angular/src/lib/lang/hi.json
View File

@ -105,14 +105,14 @@
}, },
"STREAMING": { "STREAMING": {
"TITLE": "स्ट्रीमिंग", "TITLE": "स्ट्रीमिंग",
"SUBTITLE": "अपने मीटिंग को अपने दर्शकों को स्ट्रीम करें", "SUBTITLE": "अपने दर्शकों के लिए अपनी मीटिंग स्ट्रीम करें",
"CONTENT_SUBTITLE": "OpenVidu को स्ट्रीमिंग प्लेटफॉर्म के RTMP url की आवश्यकता है।", "CONTENT_SUBTITLE": "OpenVidu को स्ट्रीमिंग प्लेटफ़ॉर्म का URL चाहिए।",
"START": "स्ट्रीमिंग शुरू करें", "START": "स्ट्रीमिंग शुरू करें",
"STOP": "स्ट्रीमिंग बंद करें", "STOP": "स्ट्रीमिंग समाप्त करें",
"URL": "अपना RTMP url दर्ज करें", "URL": "अपना स्ट्रीमिंग URL इन्सर्ट करें",
"CANCEL": "रद्द करें", "CANCEL": "रद्द करें",
"REQUIRED_URL": "RTMP url आवश्यक है", "REQUIRED_URL": "स्ट्रीमिंग URL अनिवार्य है",
"NO_MODERATOR": "केवल मोडेरेटर स्ट्रीमिंग शुरू कर सकते हैं" "NO_MODERATOR": "केवल मॉडरेटर स्ट्रीमिंग शुरू कर सकते हैं"
} }
}, },
"ERRORS": { "ERRORS": {

12
openvidu-components-angular/projects/openvidu-angular/src/lib/lang/it.json
View File

@ -105,14 +105,14 @@
}, },
"STREAMING": { "STREAMING": {
"TITLE": "Streaming", "TITLE": "Streaming",
"SUBTITLE": "Trasmetti in streaming la tua riunione al tuo pubblico", "SUBTITLE": "Trasmetti la tua riunione al tuo pubblico",
"CONTENT_SUBTITLE": "OpenVidu necessita dell'URL RTMP della piattaforma di streaming", "CONTENT_SUBTITLE": "OpenVidu ha bisogno dell'URL della piattaforma di streaming.",
"START": "Avvia lo streaming", "START": "Inizia lo streaming",
"STOP": "Termina lo streaming", "STOP": "Termina lo streaming",
"URL": "Inserisci il tuo URL RTMP", "URL": "Inserisci il tuo URL di streaming",
"CANCEL": "Annulla", "CANCEL": "Annulla",
"REQUIRED_URL": "RTMP url è obbligatorio", "REQUIRED_URL": "L'URL di streaming è obbligatorio",
"NO_MODERATOR": "Solo il MODERATORE può iniziare la trasmissione" "NO_MODERATOR": "Solo il MODERATORE può avviare lo streaming"
} }
}, },
"ERRORS": { "ERRORS": {

15
openvidu-components-angular/projects/openvidu-angular/src/lib/lang/ja.json
View File

@ -105,15 +105,14 @@
}, },
"STREAMING": { "STREAMING": {
"TITLE": "ストリーミング", "TITLE": "ストリーミング",
"SUBTITLE": "会議を観客にストリーミング", "SUBTITLE": "ミーティングを視聴者にストリーミングする",
"CONTENT_SUBTITLE": "OpenViduはストリーミングプラットフォームのRTMP URLが必要です。", "CONTENT_SUBTITLE": "OpenViduはストリーミングプラットフォームのURLが必要です。",
"START": "ストリーミングを開始", "START": "ストリーミングを開始する",
"STOP": "ストリーミングを終了", "STOP": "ストリーミングを終了する",
"URL": "RTMP URLを入力してください", "URL": "ストリーミングURLを挿入してください",
"CANCEL": "キャンセル", "CANCEL": "キャンセル",
"REQUIRED_URL": "RTMP url は必須です", "REQUIRED_URL": "ストリーミングURLは必須です",
"NO_MODERATOR": "モデレーターのみがストリーミングを開始できます" "NO_MODERATOR": "MODERATORのみがストリーミングを開始できます"
} }
}, },
"ERRORS": { "ERRORS": {

16
openvidu-components-angular/projects/openvidu-angular/src/lib/lang/nl.json
View File

@ -104,15 +104,15 @@
"NO_MODERATOR": "Alleen de MOEDERATOR kan de opname starten" "NO_MODERATOR": "Alleen de MOEDERATOR kan de opname starten"
}, },
"STREAMING": { "STREAMING": {
"TITLE": "Streamen", "TITLE": "Streaming",
"SUBTITLE": "Stream je meeting naar je publiek", "SUBTITLE": "Stream uw vergadering naar uw publiek",
"CONTENT_SUBTITLE": "OpenVidu heeft de RTMP url van de streaming platform nodig.", "CONTENT_SUBTITLE": "OpenVidu heeft de url van het streamingplatform nodig.",
"START": "Start streamen", "START": "Start met streamen",
"STOP": "Stop streamen", "STOP": "Stop met streamen",
"URL": "Voer je RTMP url in", "URL": "Voeg uw stream-URL in",
"CANCEL": "Annuleren", "CANCEL": "Annuleren",
"REQUIRED_URL": "RTMP url is verplicht", "REQUIRED_URL": "De stream-URL is vereist",
"NO_MODERATOR": "Alleen de moderator kan de streaming starten" "NO_MODERATOR": "Alleen de MODERATOR kan beginnen met streamen"
} }
}, },
"ERRORS": { "ERRORS": {

14
openvidu-components-angular/projects/openvidu-angular/src/lib/lang/pt.json
View File

@ -105,14 +105,14 @@
}, },
"STREAMING": { "STREAMING": {
"TITLE": "Streaming", "TITLE": "Streaming",
"SUBTITLE": "Transmita sua reunião para seu público", "SUBTITLE": "Transmita sua reunião para sua audiência",
"CONTENT_SUBTITLE": "O OpenVidu precisa da url RTMP da plataforma de streaming.", "CONTENT_SUBTITLE": "O OpenVidu precisa do URL da plataforma de streaming.",
"START": "Iniciar transmissão", "START": "Iniciar streaming",
"STOP": "Finalizar transmissão", "STOP": "Finalizar streaming",
"URL": "Insira seu url RTMP", "URL": "Insira seu URL de streaming",
"CANCEL": "Cancelar", "CANCEL": "Cancelar",
"REQUIRED_URL": "O URL RTMP é obrigatório", "REQUIRED_URL": "O URL de streaming é obrigatório",
"NO_MODERATOR": "Somente o MODERADOR pode iniciar a transmissão" "NO_MODERATOR": "Apenas o MODERADOR pode iniciar o streaming"
} }
}, },
"ERRORS": { "ERRORS": {

6
openvidu-components-angular/projects/openvidu-angular/src/lib/models/signal.model.ts
View File

@ -3,9 +3,5 @@
*/ */
export enum Signal { export enum Signal {
NICKNAME_CHANGED = 'nicknameChanged', NICKNAME_CHANGED = 'nicknameChanged',
CHAT = 'chat', CHAT = 'chat'
//TODO: Remove them when RTMP Exported was included on OV and streaming ready event was fired.
STREAMING_STARTED = "streamingStarted",
STREAMING_STOPPED = "streamingStopped"
} }

11
openvidu-components-angular/projects/openvidu-angular/src/lib/models/streaming.model.ts
View File

@ -6,15 +6,8 @@ export enum StreamingStatus {
FAILED = 'failed' FAILED = 'failed'
} }
export interface StreamingInfo {
id: string,
status: StreamingStatus
}
export interface StreamingError { export interface StreamingError {
message: string, message: string;
// If streaming service is available or not // If streaming service is available or not
rtmpAvailable: boolean rtmpAvailable: boolean;
} }

8
openvidu-components-angular/projects/openvidu-angular/src/lib/services/config/openvidu-angular.config.service.ts
View File

@ -2,7 +2,7 @@ import { Inject, Injectable } from '@angular/core';
import { BehaviorSubject, Observable } from 'rxjs'; import { BehaviorSubject, Observable } from 'rxjs';
import { OpenViduAngularConfig, ParticipantFactoryFunction } from '../../config/openvidu-angular.config'; import { OpenViduAngularConfig, ParticipantFactoryFunction } from '../../config/openvidu-angular.config';
import { RecordingInfo } from '../../models/recording.model'; import { RecordingInfo } from '../../models/recording.model';
import { StreamingError, StreamingInfo } from '../../models/streaming.model'; import { StreamingError } from '../../models/streaming.model';
// import { version } from '../../../../package.json'; // import { version } from '../../../../package.json';
@ -76,10 +76,7 @@ export class OpenViduAngularConfigService {
recordingErrorObs: Observable<any>; recordingErrorObs: Observable<any>;
streamingErrorObs: Observable<StreamingError | undefined>; streamingErrorObs: Observable<StreamingError | undefined>;
streamingError = <BehaviorSubject<StreamingError | undefined>>new BehaviorSubject(undefined); streamingError = <BehaviorSubject<StreamingError | undefined>>new BehaviorSubject(undefined);
streamingInfo = <BehaviorSubject<StreamingInfo | undefined>>new BehaviorSubject(undefined); // Admin
//TODO: Remove this directive when RTMP Exported was included on OV and streaming ready event was fired.
streamingInfoObs: Observable<StreamingInfo | undefined>;
adminRecordingsList: BehaviorSubject<RecordingInfo[]> = new BehaviorSubject(<RecordingInfo[]>[]); adminRecordingsList: BehaviorSubject<RecordingInfo[]> = new BehaviorSubject(<RecordingInfo[]>[]);
adminRecordingsListObs: Observable<RecordingInfo[]>; adminRecordingsListObs: Observable<RecordingInfo[]>;
adminLoginError = <BehaviorSubject<any>>new BehaviorSubject(null); adminLoginError = <BehaviorSubject<any>>new BehaviorSubject(null);
@ -121,7 +118,6 @@ export class OpenViduAngularConfigService {
// Streaming activity // Streaming activity
this.streamingActivityObs = this.streamingActivity.asObservable(); this.streamingActivityObs = this.streamingActivity.asObservable();
this.streamingErrorObs = this.streamingError.asObservable(); this.streamingErrorObs = this.streamingError.asObservable();
this.streamingInfoObs = this.streamingInfo.asObservable();
// Admin dashboard // Admin dashboard
this.adminRecordingsListObs = this.adminRecordingsList.asObservable(); this.adminRecordingsListObs = this.adminRecordingsList.asObservable();
this.adminLoginErrorObs = this.adminLoginError.asObservable(); this.adminLoginErrorObs = this.adminLoginError.asObservable();

1
openvidu-components-angular/src/app/openvidu-call/call.component.html
View File

@ -27,7 +27,6 @@
[recordingActivityRecordingsList]="recordingList" [recordingActivityRecordingsList]="recordingList"
[recordingActivityRecordingError]="recordingError" [recordingActivityRecordingError]="recordingError"
[streamingActivityStreamingError]="streamingError" [streamingActivityStreamingError]="streamingError"
[streamingActivityStreamingInfo]="streamingInfo"
[toolbarSettingsButton]="true" [toolbarSettingsButton]="true"
(onJoinButtonClicked)="onJoinClicked()" (onJoinButtonClicked)="onJoinClicked()"
(onToolbarLeaveButtonClicked)="onToolbarLeaveButtonClicked()" (onToolbarLeaveButtonClicked)="onToolbarLeaveButtonClicked()"

9
openvidu-components-angular/src/app/openvidu-call/call.component.ts
View File

@ -17,7 +17,6 @@ export class CallComponent implements OnInit {
recordingList: RecordingInfo[] = []; recordingList: RecordingInfo[] = [];
recordingError: any; recordingError: any;
streamingError: any; streamingError: any;
streamingInfo: any;
constructor(private restService: RestService) {} constructor(private restService: RestService) {}
@ -86,8 +85,8 @@ export class CallComponent implements OnInit {
console.log('START STREAMING', rtmpUrl); console.log('START STREAMING', rtmpUrl);
try { try {
this.streamingError = null; this.streamingError = null;
this.streamingInfo = await this.restService.startStreaming(rtmpUrl); const resp = await this.restService.startStreaming(rtmpUrl);
console.log('Streaming response ', this.streamingInfo); console.log('Streaming response ', resp);
} catch (error) { } catch (error) {
console.error(error); console.error(error);
this.streamingError = error.error; this.streamingError = error.error;
@ -98,8 +97,8 @@ export class CallComponent implements OnInit {
console.log('STOP STREAMING'); console.log('STOP STREAMING');
try { try {
this.streamingError = null; this.streamingError = null;
this.streamingInfo = await this.restService.stopStreaming(); const resp = await this.restService.stopStreaming();
console.log('Streaming response ', this.streamingInfo); console.log('Streaming response ', resp);
} catch (error) { } catch (error) {
console.error(error); console.error(error);
this.streamingError = error.message || error; this.streamingError = error.message || error;

18
openvidu-components-angular/src/app/services/rest.service.ts
View File

@ -41,14 +41,14 @@ export class RestService {
} }
} }
async startStreaming(rtmpUrl: string) { async startStreaming(broadcastUrl: string) {
try { try {
const options = { const options = {
headers: new HttpHeaders({ headers: new HttpHeaders({
'Content-Type': 'application/json' 'Content-Type': 'application/json'
}) })
}; };
return lastValueFrom(this.http.post<any>(this.baseHref + 'streamings/start', { rtmpUrl}, options)); return lastValueFrom(this.http.post<any>(this.baseHref + 'broadcasts/start', { broadcastUrl }, options));
} catch (error) { } catch (error) {
if (error.status === 404) { if (error.status === 404) {
throw { status: error.status, message: 'Cannot connect with backend. ' + error.url + ' not found' }; throw { status: error.status, message: 'Cannot connect with backend. ' + error.url + ' not found' };
@ -68,10 +68,9 @@ export class RestService {
} }
} }
async stopStreaming() { async stopStreaming() {
try { try {
return lastValueFrom(this.http.delete<any>(`${this.baseHref}streamings/stop`)); return lastValueFrom(this.http.delete<any>(`${this.baseHref}broadcasts/stop`));
} catch (error) { } catch (error) {
if (error.status === 404) { if (error.status === 404) {
throw { status: error.status, message: 'Cannot connect with backend. ' + error.url + ' not found' }; throw { status: error.status, message: 'Cannot connect with backend. ' + error.url + ' not found' };
@ -98,9 +97,7 @@ export class RestService {
async logout(): Promise<void> { async logout(): Promise<void> {
try { try {
return lastValueFrom( return lastValueFrom(this.http.post<any>(`${this.baseHref}auth/admin/logout`, {}));
this.http.post<any>(`${this.baseHref}auth/admin/logout`, {})
);
} catch (error) { } catch (error) {
console.log(error); console.log(error);
if (error.status === 404) { if (error.status === 404) {
@ -110,7 +107,6 @@ export class RestService {
} }
} }
async deleteRecording(id: string): Promise<any[]> { async deleteRecording(id: string): Promise<any[]> {
try { try {
return lastValueFrom(this.http.delete<any>(`${this.baseHref}recordings/delete/${id}`)); return lastValueFrom(this.http.delete<any>(`${this.baseHref}recordings/delete/${id}`));
@ -124,9 +120,7 @@ export class RestService {
} }
getRecordings(): Promise<any[]> { getRecordings(): Promise<any[]> {
return lastValueFrom( return lastValueFrom(this.http.get<any>(`${this.baseHref}recordings`));
this.http.get<any>(`${this.baseHref}recordings`)
);
} }
getRecording(recordingId: string) { getRecording(recordingId: string) {
@ -147,7 +141,7 @@ export class RestService {
getRecording2(recordingId: string) { getRecording2(recordingId: string) {
try { try {
return lastValueFrom( return lastValueFrom(
this.http.get(`${this.baseHref}recordings/${recordingId}`,{ this.http.get(`${this.baseHref}recordings/${recordingId}`, {
responseType: 'blob' responseType: 'blob'
}) })
); );

2
openvidu-components-angular/src/app/testing-app/testing.component.html
View File

@ -209,7 +209,7 @@
id="custom-activities-panel" id="custom-activities-panel"
> >
<ov-recording-activity *ngIf="recordingActivity"></ov-recording-activity> <ov-recording-activity *ngIf="recordingActivity"></ov-recording-activity>
<ov-streaming-activity *ngIf="streamingActivity" [streamingInfo]="streamingInfo" [streamingError]="streamingError"></ov-streaming-activity> <ov-streaming-activity *ngIf="streamingActivity" [streamingError]="streamingError"></ov-streaming-activity>
</ov-activities-panel> </ov-activities-panel>
</ng-template> </ng-template>

16
openvidu-components-angular/src/app/testing-app/testing.component.ts
View File

@ -2,7 +2,7 @@ import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Component, OnInit } from '@angular/core'; import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router'; import { ActivatedRoute } from '@angular/router';
import { PanelService, StreamingError, StreamingInfo, StreamingStatus } from 'openvidu-angular'; import { PanelService, StreamingError } from 'openvidu-angular';
import { Subscription, throwError as observableThrowError } from 'rxjs'; import { Subscription, throwError as observableThrowError } from 'rxjs';
import { catchError } from 'rxjs/operators'; import { catchError } from 'rxjs/operators';
@ -31,7 +31,6 @@ enum StructuralDirectives {
STREAM = 'ovStream' STREAM = 'ovStream'
} }
export enum AttributeDirective { export enum AttributeDirective {
// MINIMAL = 'minimal', // MINIMAL = 'minimal',
// PARTICIPANT_NAME = 'participantName', // PARTICIPANT_NAME = 'participantName',
@ -53,8 +52,7 @@ export enum AttributeDirective {
PARTICIPANT_ITEM_MUTE = 'muteButton', PARTICIPANT_ITEM_MUTE = 'muteButton',
ACTIVITIES_PANEL_RECORDING_ACTIVITY = 'recordingActivity', ACTIVITIES_PANEL_RECORDING_ACTIVITY = 'recordingActivity',
ACTIVITIES_PANEL_STREAMING_ACTIVITY = 'streamingActivity', ACTIVITIES_PANEL_STREAMING_ACTIVITY = 'streamingActivity',
ACTIVITIES_PANEL_STREAMING_INFO = 'streamingInfo', ACTIVITIES_PANEL_STREAMING_ERROR = 'streamingError'
ACTIVITIES_PANEL_STREAMING_ERROR = "streamingError"
} }
@Component({ @Component({
@ -126,7 +124,6 @@ export class TestingComponent implements OnInit {
directives: [ directives: [
{ name: AttributeDirective.ACTIVITIES_PANEL_RECORDING_ACTIVITY, checked: true }, { name: AttributeDirective.ACTIVITIES_PANEL_RECORDING_ACTIVITY, checked: true },
{ name: AttributeDirective.ACTIVITIES_PANEL_STREAMING_ACTIVITY, checked: true }, { name: AttributeDirective.ACTIVITIES_PANEL_STREAMING_ACTIVITY, checked: true },
{ name: AttributeDirective.ACTIVITIES_PANEL_STREAMING_INFO, checked: false },
{ name: AttributeDirective.ACTIVITIES_PANEL_STREAMING_ERROR, checked: false } { name: AttributeDirective.ACTIVITIES_PANEL_STREAMING_ERROR, checked: false }
] ]
} }
@ -160,7 +157,6 @@ export class TestingComponent implements OnInit {
participantItemMuteBtn = true; participantItemMuteBtn = true;
streamingActivity = true; streamingActivity = true;
streamingBtn = true; streamingBtn = true;
streamingInfo: StreamingInfo = undefined;
tokens: { webcam: any; screen: any }; tokens: { webcam: any; screen: any };
@ -304,12 +300,8 @@ export class TestingComponent implements OnInit {
this.streamingActivity = value; this.streamingActivity = value;
break; break;
case AttributeDirective.ACTIVITIES_PANEL_STREAMING_INFO:
this.streamingInfo = { status: StreamingStatus.STARTED, id: '01' };
break;
case AttributeDirective.ACTIVITIES_PANEL_STREAMING_ERROR: case AttributeDirective.ACTIVITIES_PANEL_STREAMING_ERROR:
this.streamingError = {message: 'TEST_ERROR', rtmpAvailable: true}; this.streamingError = { message: 'TEST_ERROR', rtmpAvailable: true };
break; break;
default: default:
break; break;
@ -385,7 +377,7 @@ export class TestingComponent implements OnInit {
createConnection(sessionId): Promise<string> { createConnection(sessionId): Promise<string> {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
const body = {role: 'MODERATOR'}; const body = { role: 'MODERATOR' };
const options = { const options = {
headers: new HttpHeaders({ headers: new HttpHeaders({
Authorization: 'Basic ' + btoa('OPENVIDUAPP:' + this.OPENVIDU_SERVER_SECRET), Authorization: 'Basic ' + btoa('OPENVIDUAPP:' + this.OPENVIDU_SERVER_SECRET),