2017-09-28 19:13:29 +02:00
|
|
|
import { Component, HostListener, OnInit } from '@angular/core';
|
2017-09-26 18:13:00 +02:00
|
|
|
import { OpenviduRestService } from '../../services/openvidu-rest.service';
|
2017-09-27 16:24:39 +02:00
|
|
|
import { DataSource } from '@angular/cdk/table';
|
|
|
|
import { Observable } from 'rxjs/Observable';
|
|
|
|
import 'rxjs/add/observable/of';
|
|
|
|
|
|
|
|
import * as colormap from 'colormap';
|
|
|
|
const numColors = 64;
|
|
|
|
|
|
|
|
declare var $: any;
|
2017-09-26 18:13:00 +02:00
|
|
|
|
|
|
|
@Component({
|
|
|
|
selector: 'app-dashboard',
|
|
|
|
templateUrl: './dashboard.component.html',
|
2017-09-27 16:24:39 +02:00
|
|
|
styleUrls: ['./dashboard.component.css'],
|
2017-09-26 18:13:00 +02:00
|
|
|
})
|
|
|
|
export class DashboardComponent implements OnInit {
|
|
|
|
|
2017-09-27 16:24:39 +02:00
|
|
|
openviduURL = 'https://localhost:8443';
|
|
|
|
openviduSecret = 'MY_SECRET';
|
2017-09-28 19:13:29 +02:00
|
|
|
|
|
|
|
// OpenViduInstance collection
|
|
|
|
users = [true];
|
|
|
|
|
|
|
|
// API REST params
|
2017-09-27 16:24:39 +02:00
|
|
|
serverData = 'data_test';
|
|
|
|
selectedRadioIndex = 0;
|
2017-09-28 19:13:29 +02:00
|
|
|
selectedRole = 'PUBLISHER';
|
2017-09-27 16:24:39 +02:00
|
|
|
openViduRoles = ['SUBSCRIBER', 'PUBLISHER', 'MODERATOR'];
|
|
|
|
|
|
|
|
// API REST data collected
|
|
|
|
data = [];
|
2017-09-28 19:13:29 +02:00
|
|
|
|
2017-09-27 16:24:39 +02:00
|
|
|
cg;
|
|
|
|
|
2017-09-26 18:13:00 +02:00
|
|
|
constructor(private openviduRestService: OpenviduRestService) {
|
2017-09-27 16:24:39 +02:00
|
|
|
const options = {
|
|
|
|
colormap: [
|
|
|
|
{ 'index': 0, 'rgb': [135, 196, 213] },
|
|
|
|
{ 'index': 1, 'rgb': [255, 230, 151] }],
|
|
|
|
nshades: numColors,
|
|
|
|
format: 'hex'
|
|
|
|
};
|
|
|
|
this.cg = colormap(options);
|
2017-09-26 18:13:00 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
ngOnInit() { }
|
|
|
|
|
2017-09-28 19:13:29 +02:00
|
|
|
private addUser() {
|
|
|
|
this.users.push(true);
|
2017-09-26 18:13:00 +02:00
|
|
|
}
|
|
|
|
|
2017-09-27 18:42:11 +02:00
|
|
|
/* API REST TAB */
|
|
|
|
|
2017-09-26 18:13:00 +02:00
|
|
|
private getSessionId() {
|
2017-09-27 16:24:39 +02:00
|
|
|
this.openviduRestService.getSessionId(this.openviduURL, this.openviduSecret)
|
2017-09-26 18:13:00 +02:00
|
|
|
.then((sessionId) => {
|
2017-09-27 16:24:39 +02:00
|
|
|
this.updateData();
|
2017-09-26 18:13:00 +02:00
|
|
|
})
|
|
|
|
.catch((error) => {
|
|
|
|
console.error('Error getting a sessionId', error);
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
private getToken() {
|
2017-09-27 16:24:39 +02:00
|
|
|
const sessionId = this.data[this.selectedRadioIndex][0];
|
|
|
|
|
|
|
|
this.openviduRestService.getToken(this.openviduURL, this.openviduSecret, sessionId, this.selectedRole, this.serverData)
|
2017-09-26 18:13:00 +02:00
|
|
|
.then((token) => {
|
2017-09-27 16:24:39 +02:00
|
|
|
this.updateData();
|
2017-09-26 18:13:00 +02:00
|
|
|
})
|
|
|
|
.catch((error) => {
|
|
|
|
console.error('Error getting a token', error);
|
|
|
|
});
|
|
|
|
}
|
2017-09-27 16:24:39 +02:00
|
|
|
|
|
|
|
private updateData() {
|
|
|
|
this.data = Array.from(this.openviduRestService.getAvailableParams());
|
|
|
|
}
|
|
|
|
|
|
|
|
private getTokenDisabled(): boolean {
|
|
|
|
return ((this.data.length === 0) || this.selectedRadioIndex === undefined);
|
|
|
|
}
|
|
|
|
|
|
|
|
private getBackgroundColor(index: number) {
|
|
|
|
return this.cg[((index + 1) * 15) % numColors];
|
|
|
|
}
|
|
|
|
|
|
|
|
private cleanAllSessions() {
|
|
|
|
this.data = [];
|
|
|
|
this.openviduRestService.sessionIdSession.clear();
|
|
|
|
this.openviduRestService.sessionIdTokenOpenViduRole.clear();
|
|
|
|
}
|
2017-09-27 18:42:11 +02:00
|
|
|
|
|
|
|
/* API REST TAB */
|
|
|
|
|
2017-09-26 18:13:00 +02:00
|
|
|
}
|