Compare commits

..

No commits in common. "66244467a5063d9f03b28125bb8c374cacb710c6" and "6123a39e5561e7b4744a47147ac88a9cafb33dfc" have entirely different histories.

5 changed files with 70 additions and 127 deletions

View File

@ -1,6 +1,6 @@
{
"name": "opt-cc",
"version": "1.3.2",
"version": "1.3.1",
"license": "MIT",
"private": true,
"scripts": {

View File

@ -35,11 +35,11 @@ import {WarService} from "./services/war-service/war.service";
import {DataTableModule} from "angular2-datatable";
import {NgxChartsModule} from "@swimlane/ngx-charts";
import {BrowserAnimationsModule} from "@angular/platform-browser/animations";
import {AccordionModule, CarouselModule} from "ngx-bootstrap";
import {AccordionModule} from "ngx-bootstrap";
@NgModule({
imports: [BrowserModule, FormsModule, ReactiveFormsModule, appRouting, HttpModule, ClipboardModule, DataTableModule,
BrowserAnimationsModule, NgxChartsModule, AccordionModule.forRoot(), CarouselModule.forRoot()],
BrowserAnimationsModule, NgxChartsModule, AccordionModule.forRoot()],
providers: [
HttpClient,
LoginService,

View File

@ -1,9 +1,3 @@
.slide-chart-container {
.chart-container {
width: 1200px;
margin: auto;
}
:host /deep/ .carousel-control {
width: 5%;
cursor: pointer;
}

View File

@ -1,59 +1,11 @@
<h2 style="margin-bottom: 20px">{{title}}</h2>
<h2>{{title}}</h2>
<div class="btn btn-default" [style.background]="activeSlideIndex === 2 ? '#d9edf7':'white'"
(click)="goToSlide(2)" *ngIf="id != 'all'">Gesamtpunktzahl
</div>
<div class="btn btn-default" [style.background]="activeSlideIndex === 0 ? '#d9edf7':'white'"
(click)="goToSlide(0)">Punkte je Schlacht
</div>
<div class="btn btn-default" [style.background]="activeSlideIndex === 1 ? '#d9edf7':'white'"
(click)="goToSlide(1)">Spielerzahlen
</div>
<h3>Punkte</h3>
<div class="chart-container">
<carousel [(activeSlide)]="activeSlideIndex">
<slide *ngIf="id != 'all'">
<div class="slide-chart-container">
<h3>Gesamtpunktzahl</h3>
<ngx-charts-line-chart
[view]="[1200, 500]"
[scheme]="colorScheme"
[results]="pointSumData"
[gradient]="false"
[xAxis]="true"
[yAxis]="true"
[legend]="true"
[legendTitle]="''"
[showXAxisLabel]="true"
[showYAxisLabel]="true"
[yAxisLabel]="'Gesamtpunkte'"
[autoScale]="true">
</ngx-charts-line-chart>
</div>
</slide>
<slide>
<div class="slide-chart-container">
<h3>Punkte je Schlacht</h3>
<ngx-charts-line-chart
[view]="[1200, 500]"
[scheme]="colorScheme"
[results]="pointData"
[gradient]="false"
[xAxis]="true"
[yAxis]="true"
[legend]="true"
[legendTitle]="''"
[showXAxisLabel]="true"
[showYAxisLabel]="true"
[yAxisLabel]="'Punkte'"
[autoScale]="false">
</ngx-charts-line-chart>
</div>
</slide>
<slide>
<div class="slide-chart-container">
<h3>Spielerzahlen</h3>
<ngx-charts-line-chart
[view]="[1200, 500]"
[view]="[1050, 400]"
[scheme]="colorScheme"
[results]="playerData"
[gradient]="false"
@ -63,9 +15,32 @@
[legendTitle]="''"
[showXAxisLabel]="true"
[showYAxisLabel]="true"
[yAxisLabel]="'Anzahl Spieler'"
[autoScale]="true">
[xAxisLabel]="'Schlachtdatum'"
[yAxisLabel]="'Punkte'"
[autoScale]="false">
</ngx-charts-line-chart>
</div>
</slide>
</carousel>
</div>
<h3 style="margin-top: 370px;">Spielerzahlen</h3>
<div class="chart-container">
<ngx-charts-line-chart
[view]="[1050, 350]"
[scheme]="colorScheme"
[results]="pointData"
[gradient]="false"
[xAxis]="true"
[yAxis]="true"
[legend]="true"
[legendTitle]="''"
[showXAxisLabel]="true"
[showYAxisLabel]="true"
[xAxisLabel]="'Schlachtdatum'"
[yAxisLabel]="'Anzahl Spieler'"
[autoScale]="true"
(select)="onSelect($event)">
</ngx-charts-line-chart>
</div>

View File

@ -1,24 +1,21 @@
import {Component} from "@angular/core";
import {WarService} from "../../services/war-service/war.service";
import {Campaign, War} from "../../models/model-interfaces";
import {WarListComponent} from "../war-list/war-list.component";
import {ActivatedRoute} from "@angular/router";
import {CarouselConfig} from "ngx-bootstrap";
@Component({
selector: 'stats-overview',
templateUrl: './stats-overview.component.html',
styleUrls: ['./stats-overview.component.css'],
inputs: ['campaigns'],
providers: [{provide: CarouselConfig, useValue: {interval: false}}]
inputs: ['campaigns']
})
export class StatisticOverviewComponent {
id = "";
title = "";
activeSlideIndex: number = 0;
pointData: any[] = [];
pointSumData: any[] = [];
playerData: any[] = [];
colorScheme = {
@ -33,25 +30,24 @@ export class StatisticOverviewComponent {
this.route.params
.map(params => params['id'])
.subscribe((id) => {
this.id = id;
if (this.warService.campaigns) {
this.initWars(this.warService.campaigns);
this.initWars(this.warService.campaigns, id);
} else {
this.warService.getAllCampaigns().subscribe(campaigns => {
this.initWars(campaigns);
this.initWars(campaigns, id);
})
}
});
}
initWars(campaigns) {
initWars(campaigns, id) {
let wars = [];
let itemsProcessed = 0;
campaigns = campaigns.filter(campaign => this.id === 'all' || campaign._id === this.id);
campaigns = campaigns.filter(campaign => id === 'all' || campaign._id === id);
campaigns.forEach(campaign => {
if (this.id === 'all') {
this.title = "Gesamtübersicht";
if (id === 'all') {
this.title = "Gesamtübersicht"
} else {
this.title = campaign.title
}
@ -63,10 +59,6 @@ export class StatisticOverviewComponent {
})
}
goToSlide(index: number) {
this.activeSlideIndex = index;
}
initChart(wars: any[]) {
let pointsObj = [
{
@ -77,15 +69,6 @@ export class StatisticOverviewComponent {
"name": "CSAT",
"series": []
}];
let pointsSumObj = [
{
"name": "NATO",
"series": []
},
{
"name": "CSAT",
"series": []
}];
let playersObj = [
{
"name": "NATO",
@ -97,46 +80,37 @@ export class StatisticOverviewComponent {
}
];
for (let i = wars.length - 1; i >= 0; i--) {
let j = wars.length - i - 1;
const isoDate = wars[i].date.slice(0, 10);
const dayDate = parseInt(isoDate.slice(8, 10)) + 1;
const warDateString = (dayDate < 10 ? "0" + dayDate : dayDate) + '.'
+ isoDate.slice(5, 7) + '.' + isoDate.slice(0, 4);
pointsObj[0].series.push({
const bluforData = {
name: warDateString,
value: wars[i].ptBlufor
});
pointsObj[1].series.push({
};
const opforData = {
name: warDateString,
value: wars[i].ptOpfor
});
pointsSumObj[0].series.push({
name: warDateString,
value: pointsSumObj[0].series[j - 1] ?
pointsSumObj[0].series[j - 1].value + wars[i].ptBlufor :
wars[i].ptBlufor
});
pointsSumObj[1].series.push({
name: warDateString,
value: pointsSumObj[1].series[j - 1]
? pointsSumObj[1].series[j - 1].value + wars[i].ptOpfor :
wars[i].ptOpfor
});
playersObj[0].series.push({
};
const bluforPlayers = {
name: warDateString,
value: wars[i].playersBlufor
});
playersObj[1].series.push({
};
const opforPlayers = {
name: warDateString,
value: wars[i].playersOpfor
});
};
playersObj[0].series.push(bluforData);
playersObj[1].series.push(opforData);
pointsObj[0].series.push(bluforPlayers);
pointsObj[1].series.push(opforPlayers);
}
this.pointData = pointsObj;
this.pointSumData = pointsSumObj;
this.playerData = playersObj;
Object.assign(this, [this.pointData, this.pointSumData, this.playerData])
Object.assign(this, [this.playerData, this.pointData])
}
}