openvidu-testapp: TURN conf in scenarios. Reload stream info button

pull/88/merge
pabloFuente 2018-06-19 09:34:35 +02:00
parent c07fed7621
commit c8400a6d69
3 changed files with 65 additions and 52 deletions

View File

@ -27,6 +27,6 @@ app-openvidu-instance {
width: 100%;
}
#back-report-btn {
.report-btn{
float: right;
}

View File

@ -22,9 +22,13 @@
<div class="report-div">
<mat-form-field class="report-field" appearance="fill">
<mat-label>Report</mat-label>
<button *ngIf="isFocusedOnReport" id="back-report-btn" mat-mini-fab color="primary" (click)="$event.stopPropagation(); textAreaValue = stringifyAllReports; isFocusedOnReport = false;">
<button *ngIf="isFocusedOnReport" id="back-report-btn" class="report-btn" mat-mini-fab color="primary"
(click)="$event.stopPropagation(); textAreaValue = stringifyAllReports; isFocusedOnReport = false;">
<mat-icon aria-label="Go back to all streams">undo</mat-icon>
</button>
<button *ngIf="!!textAreaValue && !isFocusedOnReport" id="update-report-btn" class="report-btn" mat-mini-fab color="primary" (click)="$event.stopPropagation(); updateRemoteStreamsInfo()">
<mat-icon aria-label="Update stream info">replay</mat-icon>
</button>
<textarea matInput readonly [value]="textAreaValue" [mat-autosize]="true" [disabled]="!textAreaValue"></textarea>
</mat-form-field>
</div>

View File

@ -182,6 +182,12 @@ export class TestScenariosComponent implements OnInit, OnDestroy {
this.getToken().then(token => {
const OV = new OpenVidu();
if (this.turnConf === 'freeice') {
OV.setAdvancedConfiguration({ iceServers: 'freeice' });
} else if (this.turnConf === 'manual') {
OV.setAdvancedConfiguration({ iceServers: [this.manualTurnConf] });
}
const session = OV.initSession();
this.OVs.push(OV);
@ -294,48 +300,6 @@ export class TestScenariosComponent implements OnInit, OnDestroy {
}
addReportForStream(event: StreamManagerWrapper) {
const getSessionInfo = () => {
let headers = new HttpHeaders();
headers = headers.append('Authorization', 'Basic ' + btoa('OPENVIDUAPP:' + this.openviduSecret));
this.http.get(this.openviduUrl + 'api/sessions/' + this.fixedSessionId, { headers }).subscribe(
sessionInfo => {
this.report.streamsOut.items.forEach(report => {
const streamOutRemoteInfo = sessionInfo['connections']
.find(c => c.connectionId === report.connectionId).publishers
.find(p => {
report.webrtcTagName = p.webrtcTagName;
return p.webrtcTagName === report.streamId;
});
report.remoteCandidatePair = {
localCandidate: this.parseRemoteCandidatePair(streamOutRemoteInfo.localCandidate),
remoteCandidate: this.parseRemoteCandidatePair(streamOutRemoteInfo.remoteCandidate)
};
});
this.report.streamsIn.items.forEach(report => {
const streamInRemoteInfo = sessionInfo['connections']
.find(c => c.connectionId === report.connectionId).subscribers
.find(p => {
report.webrtcTagName = p.webrtcTagName;
return p.webrtcTagName === report.connectionId + '_' + report.streamId;
});
report.remoteCandidatePair = {
localCandidate: this.parseRemoteCandidatePair(streamInRemoteInfo.localCandidate),
remoteCandidate: this.parseRemoteCandidatePair(streamInRemoteInfo.remoteCandidate)
};
});
this.stringifyAllReports = JSON.stringify(this.report, null, '\t');
if (!this.textAreaValue) {
this.textAreaValue = this.stringifyAllReports;
}
},
error => { }
);
};
event.streamManager.stream.getSelectedIceCandidate()
.then(localCandidatePair => {
@ -346,14 +310,16 @@ export class TestScenariosComponent implements OnInit, OnDestroy {
connectionId: event.connectionId,
streamId: event.streamManager.stream.streamId,
state: event.state,
localCandidatePair: {
candidatePairSelectedByBrowser: {
localCandidate: localCandidatePair.localCandidate,
remoteCandidate: localCandidatePair.remoteCandidate
},
remoteCandidatePair: {
candidatePairSelectedByKms: {
localCandidate: {},
remoteCandidate: {}
}
},
iceCandidatesSentByBrowser: event.streamManager.stream.getLocalIceCandidateList(),
iceCandidatesReceivedByBrowser: event.streamManager.stream.getRemoteIceCandidateList()
};
this.report.streamsIn.count++;
@ -363,14 +329,16 @@ export class TestScenariosComponent implements OnInit, OnDestroy {
connectionId: event.connectionId,
streamId: event.streamManager.stream.streamId,
state: event.state,
localCandidatePair: {
candidatePairSelectedByBrowser: {
localCandidate: localCandidatePair.localCandidate,
remoteCandidate: localCandidatePair.remoteCandidate
},
remoteCandidatePair: {
candidatePairSelectedByKms: {
localCandidate: {},
remoteCandidate: {}
}
},
iceCandidatesSentByBrowser: event.streamManager.stream.getLocalIceCandidateList(),
iceCandidatesReceivedByBrowser: event.streamManager.stream.getRemoteIceCandidateList()
};
this.report.streamsOut.count++;
@ -378,13 +346,53 @@ export class TestScenariosComponent implements OnInit, OnDestroy {
}
if (++this.numberOfReports === this.totalNumberOfStreams) {
getSessionInfo();
this.updateRemoteStreamsInfo();
}
})
.catch();
}
private updateRemoteStreamsInfo() {
let headers = new HttpHeaders();
headers = headers.append('Authorization', 'Basic ' + btoa('OPENVIDUAPP:' + this.openviduSecret));
this.http.get(this.openviduUrl + 'api/sessions/' + this.fixedSessionId, { headers }).subscribe(
sessionInfo => {
this.report.streamsOut.items.forEach(report => {
const streamOutRemoteInfo = sessionInfo['connections']
.find(c => c.connectionId === report.connectionId).publishers
.find(p => {
report.webrtcTagName = p.webrtcTagName;
return p.webrtcTagName === report.streamId;
});
report.candidatePairSelectedByKms = {
localCandidate: this.parseRemoteCandidatePair(streamOutRemoteInfo.localCandidate),
remoteCandidate: this.parseRemoteCandidatePair(streamOutRemoteInfo.remoteCandidate)
};
});
this.report.streamsIn.items.forEach(report => {
const streamInRemoteInfo = sessionInfo['connections']
.find(c => c.connectionId === report.connectionId).subscribers
.find(p => {
report.webrtcTagName = p.webrtcTagName;
return p.webrtcTagName === report.connectionId + '_' + report.streamId;
});
report.candidatePairSelectedByKms = {
localCandidate: this.parseRemoteCandidatePair(streamInRemoteInfo.localCandidate),
remoteCandidate: this.parseRemoteCandidatePair(streamInRemoteInfo.remoteCandidate)
};
});
this.stringifyAllReports = JSON.stringify(this.report, null, '\t');
console.log('Info has changed: ' + !(this.stringifyAllReports === this.textAreaValue));
this.textAreaValue = this.stringifyAllReports;
},
error => { }
);
}
private parseRemoteCandidatePair(candidateStr: string) {
const array = candidateStr.split(/\s+/);
return {
@ -392,7 +400,8 @@ export class TestScenariosComponent implements OnInit, OnDestroy {
ipAddress: array[4],
transport: array[2].toLowerCase(),
candidateType: array[7],
priority: array[3]
priority: array[3],
raw: candidateStr
};
}