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

openvidu-testapp: updated to new createConnection API

pull/553/head
pabloFuente 2020-10-20 22:23:08 +02:00
parent fb393554cb
commit 93c86d3efb
7 changed files with 30 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
openvidu-testapp/src/app/components/dialogs/session-api-dialog/session-api-dialog.component.html
View File

@ -17,10 +17,10 @@
<input matInput id="stream-id-field" placeholder="streamId" [(ngModel)]="streamId"> <input matInput id="stream-id-field" placeholder="streamId" [(ngModel)]="streamId">
</mat-form-field> </mat-form-field>
<div style="margin-left:9px"> <div style="margin-left:9px">
<mat-checkbox class="checkbox-form" [(ngModel)]="tokenOptions.record" id="record-checkbox">Record <mat-checkbox class="checkbox-form" [(ngModel)]="connectionOptions.record" id="record-checkbox">Record
</mat-checkbox> </mat-checkbox>
<mat-form-field class="inner-text-input" [style.fontSize.px]=14> <mat-form-field class="inner-text-input" [style.fontSize.px]=14>
<mat-select [(ngModel)]="tokenOptions.role" id="token-role-select"> <mat-select [(ngModel)]="connectionOptions.role" id="token-role-select">
<mat-option *ngFor="let enumerator of enumToArray(openviduRoles)" [value]="enumerator"> <mat-option *ngFor="let enumerator of enumToArray(openviduRoles)" [value]="enumerator">
<span [attr.id]="'option-' + enumerator">{{ enumerator }}</span> <span [attr.id]="'option-' + enumerator">{{ enumerator }}</span>
</mat-option> </mat-option>

8
openvidu-testapp/src/app/components/dialogs/session-api-dialog/session-api-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 { OpenVidu as OpenViduAPI, Session as SessionAPI, Recording, RecordingProperties, RecordingLayout, TokenOptions, OpenViduRole } from 'openvidu-node-client'; import { OpenVidu as OpenViduAPI, Session as SessionAPI, Recording, RecordingProperties, RecordingLayout, ConnectionOptions, OpenViduRole } from 'openvidu-node-client';
@Component({ @Component({
selector: 'app-session-api-dialog', selector: 'app-session-api-dialog',
@ -26,7 +26,7 @@ export class SessionApiDialogComponent {
recPropertiesIcon = 'add_circle'; recPropertiesIcon = 'add_circle';
showRecProperties = false; showRecProperties = false;
tokenOptions: TokenOptions = { connectionOptions: ConnectionOptions = {
record: true, record: true,
role: OpenViduRole.PUBLISHER role: OpenViduRole.PUBLISHER
}; };
@ -174,9 +174,9 @@ export class SessionApiDialogComponent {
updateConnection() { updateConnection() {
console.log('Updating connection'); console.log('Updating connection');
this.session.updateConnection(this.connectionId, this.tokenOptions) this.session.updateConnection(this.connectionId, this.connectionOptions)
.then(modifiedConnection => { .then(modifiedConnection => {
this.response = 'Connection updated: ' + JSON.stringify({ role: modifiedConnection.role, record: modifiedConnection.record }); this.response = 'Connection updated: ' + JSON.stringify({ role: modifiedConnection.connectionOptions.role, record: modifiedConnection.connectionOptions.record });
}) })
.catch(error => { .catch(error => {
this.response = 'Error [' + error.message + ']'; this.response = 'Error [' + error.message + ']';

14
openvidu-testapp/src/app/components/dialogs/session-properties-dialog/session-properties-dialog.component.html
View File

@ -68,7 +68,7 @@
<mat-dialog-content> <mat-dialog-content>
<label class="label">Role</label> <label class="label">Role</label>
<div id="role-div"> <div id="role-div">
<mat-radio-group name="Role" [(ngModel)]="tokenOptions.role"> <mat-radio-group name="Role" [(ngModel)]="connectionOptions.role">
<mat-radio-button id="radio-btn-sub" value="SUBSCRIBER">SUB</mat-radio-button> <mat-radio-button id="radio-btn-sub" value="SUBSCRIBER">SUB</mat-radio-button>
<mat-radio-button id="radio-btn-pub" value="PUBLISHER">PUB</mat-radio-button> <mat-radio-button id="radio-btn-pub" value="PUBLISHER">PUB</mat-radio-button>
<mat-radio-button id="radio-btn-mod" value="MODERATOR">MOD</mat-radio-button> <mat-radio-button id="radio-btn-mod" value="MODERATOR">MOD</mat-radio-button>
@ -79,19 +79,19 @@
<div id="kurento-config-div"> <div id="kurento-config-div">
<mat-form-field style="width: 39%; margin-right: 5px"> <mat-form-field style="width: 39%; margin-right: 5px">
<input matInput placeholder="Max recv" type="number" <input matInput placeholder="Max recv" type="number"
[(ngModel)]="tokenOptions.kurentoOptions.videoMaxRecvBandwidth"> [(ngModel)]="connectionOptions.kurentoOptions.videoMaxRecvBandwidth">
</mat-form-field> </mat-form-field>
<mat-form-field style="width: 39%"> <mat-form-field style="width: 39%">
<input matInput placeholder="Min recv" type="number" <input matInput placeholder="Min recv" type="number"
[(ngModel)]="tokenOptions.kurentoOptions.videoMinRecvBandwidth"> [(ngModel)]="connectionOptions.kurentoOptions.videoMinRecvBandwidth">
</mat-form-field> </mat-form-field>
<mat-form-field style="width: 39%; margin-right: 5px"> <mat-form-field style="width: 39%; margin-right: 5px">
<input matInput placeholder="Max send" type="number" <input matInput placeholder="Max send" type="number"
[(ngModel)]="tokenOptions.kurentoOptions.videoMaxSendBandwidth"> [(ngModel)]="connectionOptions.kurentoOptions.videoMaxSendBandwidth">
</mat-form-field> </mat-form-field>
<mat-form-field style="width: 39%"> <mat-form-field style="width: 39%">
<input matInput placeholder="Min send" type="number" <input matInput placeholder="Min send" type="number"
[(ngModel)]="tokenOptions.kurentoOptions.videoMinSendBandwidth"> [(ngModel)]="connectionOptions.kurentoOptions.videoMinSendBandwidth">
</mat-form-field> </mat-form-field>
<mat-chip-list *ngIf="filters.length > 0"> <mat-chip-list *ngIf="filters.length > 0">
<mat-chip style="height: 20px" *ngFor="let filterName of filters" <mat-chip style="height: 20px" *ngFor="let filterName of filters"
@ -108,7 +108,7 @@
</div> </div>
<div id="record-div"> <div id="record-div">
<mat-checkbox class="checkbox-form" [(ngModel)]="tokenOptions.record" id="record-checkbox">Record <mat-checkbox class="checkbox-form" [(ngModel)]="connectionOptions.record" id="record-checkbox">Record
</mat-checkbox> </mat-checkbox>
</div> </div>
@ -132,6 +132,6 @@
<mat-dialog-actions> <mat-dialog-actions>
<button id="cancel-btn" mat-button [mat-dialog-close]="undefined">CANCEL</button> <button id="cancel-btn" mat-button [mat-dialog-close]="undefined">CANCEL</button>
<button id="save-btn" mat-button <button id="save-btn" mat-button
[mat-dialog-close]="{sessionProperties: sessionProperties, turnConf: turnConf, manualTurnConf: manualTurnConf, customToken: customToken, forcePublishing: forcePublishing, tokenOptions: generateTokenOptions()}">SAVE</button> [mat-dialog-close]="{sessionProperties: sessionProperties, turnConf: turnConf, manualTurnConf: manualTurnConf, customToken: customToken, forcePublishing: forcePublishing, connectionOptions: generateConnectionOptions()}">SAVE</button>
</mat-dialog-actions> </mat-dialog-actions>
</div> </div>

12
openvidu-testapp/src/app/components/dialogs/session-properties-dialog/session-properties-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 { SessionProperties, MediaMode, Recording, RecordingMode, RecordingLayout, TokenOptions } from 'openvidu-node-client'; import { SessionProperties, MediaMode, Recording, RecordingMode, RecordingLayout, ConnectionOptions } from 'openvidu-node-client';
@Component({ @Component({
selector: 'app-session-properties-dialog', selector: 'app-session-properties-dialog',
@ -15,7 +15,7 @@ export class SessionPropertiesDialogComponent {
manualTurnConf: RTCIceServer = { urls: [] }; manualTurnConf: RTCIceServer = { urls: [] };
customToken: string; customToken: string;
forcePublishing: boolean = false; forcePublishing: boolean = false;
tokenOptions: TokenOptions; connectionOptions: ConnectionOptions;
filterName = 'GStreamerFilter'; filterName = 'GStreamerFilter';
filters: string[] = []; filters: string[] = [];
@ -32,16 +32,16 @@ export class SessionPropertiesDialogComponent {
this.manualTurnConf = data.manualTurnConf; this.manualTurnConf = data.manualTurnConf;
this.customToken = data.customToken; this.customToken = data.customToken;
this.forcePublishing = data.forcePublishing; this.forcePublishing = data.forcePublishing;
this.tokenOptions = data.tokenOptions; this.connectionOptions = data.connectionOptions;
} }
enumToArray(enumerator: any) { enumToArray(enumerator: any) {
return Object.keys(enumerator); return Object.keys(enumerator);
} }
generateTokenOptions(): TokenOptions { generateConnectionOptions(): ConnectionOptions {
this.tokenOptions.kurentoOptions.allowedFilters = this.filters; this.connectionOptions.kurentoOptions.allowedFilters = this.filters;
return this.tokenOptions; return this.connectionOptions;
} }
} }

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

@ -15,11 +15,11 @@ import {
MediaMode, MediaMode,
RecordingMode, RecordingMode,
RecordingLayout, RecordingLayout,
TokenOptions, Connection,
ConnectionOptions,
OpenViduRole, OpenViduRole,
RecordingProperties, RecordingProperties,
Recording, Recording,
Token
} from 'openvidu-node-client'; } from 'openvidu-node-client';
import { MatDialog, MAT_CHECKBOX_CLICK_ACTION } from '@angular/material'; import { MatDialog, MAT_CHECKBOX_CLICK_ACTION } from '@angular/material';
import { ExtensionDialogComponent } from '../dialogs/extension-dialog/extension-dialog.component'; import { ExtensionDialogComponent } from '../dialogs/extension-dialog/extension-dialog.component';
@ -129,7 +129,7 @@ export class OpenviduInstanceComponent implements OnInit, OnChanges, OnDestroy {
manualTurnConf: RTCIceServer = { urls: [] }; manualTurnConf: RTCIceServer = { urls: [] };
customToken: string; customToken: string;
forcePublishing: boolean; forcePublishing: boolean;
tokenOptions: TokenOptions = { connectionOptions: ConnectionOptions = {
role: OpenViduRole.PUBLISHER, role: OpenViduRole.PUBLISHER,
record: true, record: true,
kurentoOptions: { kurentoOptions: {
@ -199,8 +199,8 @@ export class OpenviduInstanceComponent implements OnInit, OnChanges, OnDestroy {
if (!!this.customToken) { if (!!this.customToken) {
this.joinSessionShared(this.customToken); this.joinSessionShared(this.customToken);
} else { } else {
const token: Token = await this.getToken(); const connection: Connection = await this.createConnection();
this.joinSessionShared(token.token); this.joinSessionShared(connection.token);
} }
} }
@ -566,7 +566,7 @@ export class OpenviduInstanceComponent implements OnInit, OnChanges, OnDestroy {
manualTurnConf: this.manualTurnConf, manualTurnConf: this.manualTurnConf,
customToken: this.customToken, customToken: this.customToken,
forcePublishing: this.forcePublishing, forcePublishing: this.forcePublishing,
tokenOptions: this.tokenOptions, connectionOptions: this.connectionOptions,
}, },
width: '450px' width: '450px'
}); });
@ -581,7 +581,7 @@ export class OpenviduInstanceComponent implements OnInit, OnChanges, OnDestroy {
this.manualTurnConf = result.manualTurnConf; this.manualTurnConf = result.manualTurnConf;
this.customToken = result.customToken; this.customToken = result.customToken;
this.forcePublishing = result.forcePublishing; this.forcePublishing = result.forcePublishing;
this.tokenOptions = result.tokenOptions; this.connectionOptions = result.connectionOptions;
} }
document.getElementById('session-settings-btn-' + this.index).classList.remove('cdk-program-focused'); document.getElementById('session-settings-btn-' + this.index).classList.remove('cdk-program-focused');
}); });
@ -692,8 +692,8 @@ export class OpenviduInstanceComponent implements OnInit, OnChanges, OnDestroy {
this.sessionAPI = await this.OV_NodeClient.createSession(this.sessionProperties); this.sessionAPI = await this.OV_NodeClient.createSession(this.sessionProperties);
} }
async getToken(): Promise<Token> { async createConnection(): Promise<Connection> {
return this.sessionAPI.createToken(this.tokenOptions); return this.sessionAPI.createConnection(this.connectionOptions);
} }
updateEventFromChild(event: OpenViduEvent) { updateEventFromChild(event: OpenViduEvent) {

2
openvidu-testapp/src/app/components/test-apirest/test-apirest.component.ts
View File

@ -91,7 +91,7 @@ export class TestApirestComponent implements OnInit, OnDestroy {
getToken() { getToken() {
const sessionId = this.data[this.selectedRadioIndex][0]; const sessionId = this.data[this.selectedRadioIndex][0];
this.openviduRestService.getToken(this.openviduUrl, this.openviduSecret, sessionId, this.selectedRole, this.serverData) this.openviduRestService.getToken(sessionId, this.selectedRole, this.serverData)
.then((token) => { .then((token) => {
this.updateData(); this.updateData();
}) })

2
openvidu-testapp/src/app/services/openvidu-rest.service.ts
View File

@ -29,7 +29,7 @@ export class OpenviduRestService {
}); });
} }
getToken(openviduURL: string, openviduSecret: string, sessionId: string, role: string, serverData: string): Promise<string> { getToken(sessionId: string, role: string, serverData: string): Promise<string> {
const session: SessionAPI = this.sessionIdSession.get(sessionId); const session: SessionAPI = this.sessionIdSession.get(sessionId);
const OVRole: OpenViduRoleAPI = OpenViduRoleAPI[role]; const OVRole: OpenViduRoleAPI = OpenViduRoleAPI[role];