136 lines
3.7 KiB
TypeScript
136 lines
3.7 KiB
TypeScript
import {Component, ElementRef, Input, OnChanges, OnInit, SimpleChanges, ViewChild} from '@angular/core';
|
|
import {War} from '../../../models/model-interfaces';
|
|
import {TranslateService} from '@ngx-translate/core';
|
|
|
|
|
|
@Component({
|
|
selector: 'cc-server-statistics',
|
|
templateUrl: './server-stats.component.html',
|
|
styleUrls: ['./server-stats.component.css', '../../../style/list-entry.css', '../../../style/hide-scrollbar.css']
|
|
})
|
|
export class ServerStatsComponent implements OnInit, OnChanges {
|
|
|
|
@ViewChild('overview') private overviewContainer: ElementRef;
|
|
|
|
@Input() war: War;
|
|
|
|
@Input() performanceData: any;
|
|
|
|
startDateObj: Date;
|
|
|
|
public activeChartSelect: string;
|
|
|
|
barChartData: any[] = [];
|
|
|
|
lineChartData: any[] = [];
|
|
|
|
showBarChart = true;
|
|
|
|
tmpSingleAvg;
|
|
tmpSingleMin;
|
|
tmpAvgTimeline;
|
|
tmpMinTimeline;
|
|
tmpServerTimeline;
|
|
|
|
readonly labels = {
|
|
singleAvg: 'stats.performance.select.single.avg',
|
|
singleMin: 'stats.performance.select.single.min',
|
|
avgTimeline: 'stats.performance.select.timeline.avg',
|
|
minTimeline: 'stats.performance.select.timeline.min',
|
|
serverFps: 'stats.performance.select.timeline.server',
|
|
};
|
|
readonly labelsAsString = Object.keys(this.labels)
|
|
.map((key) => this.labels[key]);
|
|
|
|
barChartLabel: string;
|
|
lineChartLabel: string;
|
|
|
|
gradient = false;
|
|
yAxis = true;
|
|
xAxis = true;
|
|
legend = false;
|
|
legendTitle = false;
|
|
showXAxisLabel = false;
|
|
showYAxisLabel = true;
|
|
autoscale = true;
|
|
timeline = false;
|
|
roundDomains = true;
|
|
|
|
constructor(private translate: TranslateService) {
|
|
}
|
|
|
|
ngOnInit() {
|
|
this.setBarChartLabel(this.labels.singleAvg);
|
|
}
|
|
|
|
ngOnChanges(changes: SimpleChanges) {
|
|
if (changes.war || changes.performanceData) {
|
|
this.initializeChartData();
|
|
Object.assign(this, [this.barChartData]);
|
|
this.activeChartSelect = this.labels.singleAvg;
|
|
this.startDateObj = new Date(this.war.date);
|
|
this.startDateObj.setHours(0);
|
|
this.startDateObj.setMinutes(1);
|
|
}
|
|
}
|
|
|
|
selectChart(newSelection) {
|
|
this.activeChartSelect = newSelection;
|
|
if (this.activeChartSelect !== this.labels.serverFps) {
|
|
this.showBarChart = true;
|
|
this.setBarChartLabel(this.activeChartSelect);
|
|
switch (this.activeChartSelect) {
|
|
case this.labels.singleAvg:
|
|
this.barChartData = this.tmpSingleAvg;
|
|
break;
|
|
case this.labels.singleMin:
|
|
this.barChartData = this.tmpSingleMin;
|
|
break;
|
|
}
|
|
} else {
|
|
this.showBarChart = false;
|
|
this.setLineChartLabel(this.activeChartSelect);
|
|
switch (this.activeChartSelect) {
|
|
case this.labels.avgTimeline:
|
|
this.lineChartData = this.tmpAvgTimeline;
|
|
break;
|
|
case this.labels.minTimeline:
|
|
this.lineChartData = this.tmpMinTimeline;
|
|
break;
|
|
case this.labels.serverFps:
|
|
this.lineChartData = this.tmpServerTimeline;
|
|
}
|
|
}
|
|
}
|
|
|
|
initializeChartData() {
|
|
this.tmpSingleAvg = [];
|
|
this.tmpSingleMin = [];
|
|
this.performanceData.forEach((entry) => {
|
|
this.tmpSingleAvg.push({
|
|
name: entry.entityName,
|
|
value: entry.singleAvgFps
|
|
});
|
|
this.tmpSingleMin.push({
|
|
name: entry.entityName,
|
|
value: entry.singleMinFps
|
|
});
|
|
});
|
|
this.tmpSingleAvg.sort((a, b) => a.value - b.value);
|
|
this.tmpSingleMin.sort((a, b) => a.value - b.value);
|
|
this.barChartData = this.tmpSingleAvg;
|
|
}
|
|
|
|
setLineChartLabel(i18n: string) {
|
|
this.translate.get(i18n).subscribe((translated) => {
|
|
this.lineChartLabel = translated;
|
|
});
|
|
}
|
|
|
|
setBarChartLabel(i18n: string) {
|
|
this.translate.get(i18n).subscribe((translated) => {
|
|
this.barChartLabel = translated;
|
|
});
|
|
}
|
|
}
|