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

openvidu-testapp: update to filter refactoring

pull/108/merge
pabloFuente 2018-08-28 11:31:55 +02:00
parent d3b25765d1
commit 9a5920b102
5 changed files with 41 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
openvidu-testapp/src/app/components/dialogs/filter-dialog/filter-dialog.component.ts
View File

@ -1,7 +1,7 @@
import { Component, Inject } from '@angular/core'; import { Component, Inject } from '@angular/core';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material'; import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material';
import { Session, Stream } from 'openvidu-browser'; import { Session, Stream, FilterEvent } from 'openvidu-browser';
@Component({ @Component({
selector: 'app-session-api-dialog', selector: 'app-session-api-dialog',
@ -12,6 +12,7 @@ export class FilterDialogComponent {
session: Session; session: Session;
stream: Stream; stream: Stream;
filterEventHandler: (FilterEvent) => void;
filterType = 'GStreamerFilter'; filterType = 'GStreamerFilter';
filterOptions = '{"command": "videobalance saturation=0.0"}'; filterOptions = '{"command": "videobalance saturation=0.0"}';
@ -27,11 +28,12 @@ export class FilterDialogComponent {
@Inject(MAT_DIALOG_DATA) public data) { @Inject(MAT_DIALOG_DATA) public data) {
this.session = data.session; this.session = data.session;
this.stream = data.stream; this.stream = data.stream;
this.filterEventHandler = data.filterEventHandler;
} }
apply() { apply() {
console.log('Applying filter'); console.log('Applying filter');
this.session.applyFilter(this.stream, this.filterType, JSON.parse(this.filterOptions)) this.stream.applyFilter(this.filterType, JSON.parse(this.filterOptions))
.then(() => { .then(() => {
this.response = 'Filter applied'; this.response = 'Filter applied';
}) })
@ -41,19 +43,23 @@ export class FilterDialogComponent {
} }
execMethod() { execMethod() {
console.log('Executing filter method'); if (!!this.stream.filter) {
this.session.execFilterMethod(this.stream, this.filterMethod, this.filterParams) console.log('Executing filter method');
.then(recording => { this.stream.filter.execMethod(this.filterMethod, this.filterParams)
this.response = 'Filter method executed'; .then(() => {
}) this.response = 'Filter method executed';
.catch(error => { })
this.response = 'Error [' + error.message + ']'; .catch(error => {
}); this.response = 'Error [' + error.message + ']';
});
} else {
console.warn('No filter applied to stream ' + this.stream.streamId);
}
} }
remove() { remove() {
console.log('Removing filter'); console.log('Removing filter');
this.session.removeFilter(this.stream) this.stream.removeFilter()
.then(() => { .then(() => {
this.response = 'Filter removed'; this.response = 'Filter removed';
}) })
@ -64,7 +70,9 @@ export class FilterDialogComponent {
subFilterEvent() { subFilterEvent() {
console.log('Adding filter event'); console.log('Adding filter event');
this.session.addFilterEventListener(this.stream, this.eventType) this.stream.filter.addEventListener(this.eventType, (event: FilterEvent) => {
this.filterEventHandler(event);
})
.then(() => { .then(() => {
this.response = 'Filter event listener added'; this.response = 'Filter event listener added';
}) })
@ -75,7 +83,7 @@ export class FilterDialogComponent {
unsubFilterEvent() { unsubFilterEvent() {
console.log('Removing filter event'); console.log('Removing filter event');
this.session.removeFilterEventListener(this.stream, this.eventType) this.stream.filter.removeEventListener(this.eventType)
.then(() => { .then(() => {
this.response = 'Filter event listener removed'; this.response = 'Filter event listener removed';
}) })

4
openvidu-testapp/src/app/components/dialogs/publisher-properties-dialog/publisher-properties-dialog.component.ts
View File

@ -26,7 +26,7 @@ export class PublisherPropertiesDialogComponent {
audioDevices = []; audioDevices = [];
videoDevices = []; videoDevices = [];
filter: Filter = { type: 'GStreamerFilter', options: { 'command': 'videobalance saturation=0.0' } }; filter = { type: 'GStreamerFilter', options: { 'command': 'videobalance saturation=0.0' } };
stringOptions = '{"command":"videobalance saturation=0.0"}'; stringOptions = '{"command":"videobalance saturation=0.0"}';
constructor(public dialogRef: MatDialogRef<PublisherPropertiesDialogComponent>, constructor(public dialogRef: MatDialogRef<PublisherPropertiesDialogComponent>,
@ -83,7 +83,7 @@ export class PublisherPropertiesDialogComponent {
if (!this.filter.type) { if (!this.filter.type) {
delete this.publisherProperties.filter; delete this.publisherProperties.filter;
} else { } else {
this.publisherProperties.filter = this.filter; this.publisherProperties.filter = new Filter(this.filter.type, this.filter.options);
} }
return this.publisherProperties; return this.publisherProperties;
} }

4
openvidu-testapp/src/app/components/openvidu-instance/openvidu-instance.component.html
View File

@ -127,9 +127,9 @@
</div> </div>
<div [attr.id]="'remote-vid-' + session.connection.connectionId" fxFlex="240px" class="video-container"> <div [attr.id]="'remote-vid-' + session.connection.connectionId" fxFlex="240px" class="video-container">
<div [attr.id]="'local-vid-' + session.connection.connectionId"></div> <div [attr.id]="'local-vid-' + session.connection.connectionId"></div>
<app-video *ngIf="this.publisher" [streamManager]="this.publisher" [OV]="OV" [properties]="publisherProperties" (updateEventListInParent)="udpateEventFromChild($event)"> <app-video *ngIf="this.publisher" [streamManager]="this.publisher" [OV]="OV" [properties]="publisherProperties" (updateEventListInParent)="updateEventFromChild($event)">
</app-video> </app-video>
<app-video *ngFor="let subscriber of this.subscribers" [streamManager]="subscriber" [OV]="OV" (updateEventListInParent)="udpateEventFromChild($event)" <app-video *ngFor="let subscriber of this.subscribers" [streamManager]="subscriber" [OV]="OV" (updateEventListInParent)="updateEventFromChild($event)"
(reSubbed)="updateSubscriberFromChild($event)"> (reSubbed)="updateSubscriberFromChild($event)">
</app-video> </app-video>
</div> </div>

20
openvidu-testapp/src/app/components/openvidu-instance/openvidu-instance.component.ts
View File

@ -111,8 +111,7 @@ export class OpenviduInstanceComponent implements OnInit, OnChanges, OnDestroy {
recordingStopped: true, recordingStopped: true,
signal: true, signal: true,
publisherStartSpeaking: false, publisherStartSpeaking: false,
publisherStopSpeaking: false, publisherStopSpeaking: false
filterEventDispatched: true
}; };
// Session properties dialog // Session properties dialog
@ -243,7 +242,7 @@ export class OpenviduInstanceComponent implements OnInit, OnChanges, OnDestroy {
this.subscribers = []; this.subscribers = [];
} }
private updateEventList(event: string, content: string) { updateEventList(event: string, content: string) {
this.events.push({ name: event, content: content }); this.events.push({ name: event, content: content });
this.testFeedService.pushNewEvent(this.sessionName, this.session.connection.connectionId, event, content); this.testFeedService.pushNewEvent(this.sessionName, this.session.connection.connectionId, event, content);
} }
@ -435,16 +434,6 @@ export class OpenviduInstanceComponent implements OnInit, OnChanges, OnDestroy {
}); });
} }
} }
if (this.sessionEvents.filterEventDispatched !== oldValues.filterEventDispatched || firstTime) {
this.session.off('filterEventDispatched');
if (this.sessionEvents.filterEventDispatched) {
this.session.on('filterEventDispatched', (event: FilterEvent) => {
this.updateEventList('filterEventDispatched',
event.filter.type + ' {type: ' + event.eventType + ', data: ' + event.data.toString() + '}');
});
}
}
} }
syncInitPublisher() { syncInitPublisher() {
@ -609,8 +598,7 @@ export class OpenviduInstanceComponent implements OnInit, OnChanges, OnDestroy {
recordingStopped: result.recordingStopped, recordingStopped: result.recordingStopped,
signal: result.signal, signal: result.signal,
publisherStartSpeaking: result.publisherStartSpeaking, publisherStartSpeaking: result.publisherStartSpeaking,
publisherStopSpeaking: result.publisherStopSpeaking, publisherStopSpeaking: result.publisherStopSpeaking
filterEventDispatched: result.filterEventDispatched
}; };
document.getElementById('session-events-btn-' + this.index).classList.remove('cdk-program-focused'); document.getElementById('session-events-btn-' + this.index).classList.remove('cdk-program-focused');
}); });
@ -644,7 +632,7 @@ export class OpenviduInstanceComponent implements OnInit, OnChanges, OnDestroy {
}); });
} }
udpateEventFromChild(event) { updateEventFromChild(event) {
this.updateEventList(event.event, event.content); this.updateEventList(event.event, event.content);
} }

13
openvidu-testapp/src/app/components/video/video.component.ts
View File

@ -624,10 +624,21 @@ export class VideoComponent implements OnInit, OnDestroy {
filterConfig() { filterConfig() {
this.dialog.open(FilterDialogComponent, { this.dialog.open(FilterDialogComponent, {
data: { session: this.streamManager.stream.session, stream: this.streamManager.stream }, data: {
session: this.streamManager.stream.session,
stream: this.streamManager.stream,
filterEventHandler: this.emitFilterEventToParent.bind(this)
},
disableClose: true, disableClose: true,
width: '450px' width: '450px'
}); });
} }
emitFilterEventToParent(event) {
this.updateEventListInParent.emit({
event: 'filterEvent',
content: event.data
});
}
} }