Introduce Enum for fraction names;Add player detail tab

pull/18/head
HardiReady 2017-11-07 14:02:49 +01:00
parent 56a119f549
commit 205c4ffc3a
10 changed files with 71 additions and 65 deletions

View File

@ -22,10 +22,10 @@ overview.route('/')
let countOpfor = 0; let countOpfor = 0;
let countBlufor = 0; let countBlufor = 0;
const armyOverview = { const armyOverview = {
NATO: { BLUFOR: {
squads: [] squads: []
}, },
CSAT: { OPFOR: {
squads: [] squads: []
} }
}; };
@ -72,12 +72,12 @@ overview.route('/')
s.memberCount = squadMembers.length; s.memberCount = squadMembers.length;
if (s.fraction === 'BLUFOR') { if (s.fraction === 'BLUFOR') {
delete s.fraction; delete s.fraction;
armyOverview.NATO.squads.push(s); armyOverview.BLUFOR.squads.push(s);
countBlufor += s.members.length; countBlufor += s.members.length;
} }
if (s.fraction === 'OPFOR') { if (s.fraction === 'OPFOR') {
delete s.fraction; delete s.fraction;
armyOverview.CSAT.squads.push(s); armyOverview.OPFOR.squads.push(s);
countOpfor += s.members.length; countOpfor += s.members.length;
} }
callback(); callback();
@ -88,8 +88,8 @@ overview.route('/')
if (err) { if (err) {
return next(err); return next(err);
} }
armyOverview.NATO.memberCount = countBlufor; armyOverview.BLUFOR.memberCount = countBlufor;
armyOverview.CSAT.memberCount = countOpfor; armyOverview.OPFOR.memberCount = countOpfor;
res.locals.items = armyOverview; res.locals.items = armyOverview;
res.locals.processed = true; res.locals.processed = true;
next(); next();

View File

@ -1,6 +1,6 @@
{ {
"name": "opt-cc", "name": "opt-cc",
"version": "1.6.2", "version": "1.6.3",
"license": "MIT", "license": "MIT",
"author": "Florian Hartwich <hardi@noarch.de>", "author": "Florian Hartwich <hardi@noarch.de>",
"private": true, "private": true,

View File

@ -2,8 +2,8 @@
<h1>Übersicht über alle Spieler, Squads und Armeen</h1> <h1>Übersicht über alle Spieler, Squads und Armeen</h1>
<div class="pull-left" style="width: 45%;"> <div class="pull-left" style="width: 45%;">
<h3 class="text-blufor army-head">NATO</h3> <h3 class="text-blufor army-head">{{BLUFOR}}</h3>
<div class="squad-layout" *ngFor="let squad of army.NATO.squads"> <div class="squad-layout" *ngFor="let squad of army.BLUFOR.squads">
<div class="row colored-row title-row"> <div class="row colored-row title-row">
<div class="squad-cell pull-left"><img <div class="squad-cell pull-left"><img
src="resource/squad/{{squad._id}}.png"></div> src="resource/squad/{{squad._id}}.png"></div>
@ -27,12 +27,12 @@
</div> </div>
</div> </div>
</div> </div>
<div style="padding: 20px; text-align: center;">Armeemitglieder: {{army.NATO.memberCount}}</div> <div style="padding: 20px; text-align: center;">Armeemitglieder: {{army.BLUFOR.memberCount}}</div>
</div> </div>
<div class="pull-right" style="width: 45%;"> <div class="pull-right" style="width: 45%;">
<h3 class="text-opfor army-head">CSAT</h3> <h3 class="text-opfor army-head">{{OPFOR}}</h3>
<div class="squad-layout" *ngFor="let squad of army.CSAT.squads"> <div class="squad-layout" *ngFor="let squad of army.OPFOR.squads">
<div class="row colored-row title-row"> <div class="row colored-row title-row">
<div class="squad-cell pull-left"><img <div class="squad-cell pull-left"><img
src="resource/squad/{{squad._id}}.png"></div> src="resource/squad/{{squad._id}}.png"></div>
@ -56,7 +56,7 @@
</div> </div>
</div> </div>
</div> </div>
<div style="padding: 20px; text-align: center;">Armeemitglieder: {{army.CSAT.memberCount}}</div> <div style="padding: 20px; text-align: center;">Armeemitglieder: {{army.OPFOR.memberCount}}</div>
</div> </div>
</div> </div>

View File

@ -2,6 +2,7 @@ import {Component} from "@angular/core";
import {Army} from "../models/model-interfaces"; import {Army} from "../models/model-interfaces";
import {ArmyService} from "../services/army-service/army.service"; import {ArmyService} from "../services/army-service/army.service";
import {ActivatedRoute, Router} from "@angular/router"; import {ActivatedRoute, Router} from "@angular/router";
import {Fraction} from "../utils/fraction.enum";
@Component({ @Component({
@ -11,7 +12,11 @@ import {ActivatedRoute, Router} from "@angular/router";
}) })
export class ArmyComponent { export class ArmyComponent {
army: Army = {NATO: {squads: [], memberCount: 0}, CSAT: {squads: [], memberCount: 0}}; army: Army = {BLUFOR: {squads: [], memberCount: 0}, OPFOR: {squads: [], memberCount: 0}};
BLUFOR: string = Fraction.BLUFOR;
OPFOR: string = Fraction.OPFOR;
constructor(private router: Router, constructor(private router: Router,
private route: ActivatedRoute, private route: ActivatedRoute,

View File

@ -100,7 +100,7 @@ export interface Decoration {
} }
export interface Army { export interface Army {
NATO: { BLUFOR: {
squads: { squads: {
_id, _id,
name, name,
@ -113,7 +113,7 @@ export interface Army {
}[], }[],
memberCount memberCount
}, },
CSAT: { OPFOR: {
squads: { squads: {
_id, _id,
name, name,

View File

@ -3,12 +3,13 @@ import {ActivatedRoute} from "@angular/router";
import {CarouselConfig} from "ngx-bootstrap"; import {CarouselConfig} from "ngx-bootstrap";
import {CampaignService} from "../../services/logs/campaign.service"; import {CampaignService} from "../../services/logs/campaign.service";
import {ChartUtils} from "../../utils/chart-utils"; import {ChartUtils} from "../../utils/chart-utils";
import {Fraction} from "../../utils/fraction.enum";
@Component({ @Component({
selector: 'stats-overview', selector: 'stats-overview',
templateUrl: './stats-overview.component.html', templateUrl: './stats-overview.component.html',
styleUrls: ['./stats-overview.component.css', '../../style/list-entry.css', '../../style/overview.css'], styleUrls: ['./stats-overview.component.css', '../../style/list-entry.css', '../../style/overview.css'],
inputs: ['campaigns'], inputs: ['campaigns'],
providers: [{provide: CarouselConfig, useValue: {interval: false}}] providers: [{provide: CarouselConfig, useValue: {interval: false}}]
}) })
@ -24,7 +25,7 @@ export class StatisticOverviewComponent {
activeSlideIndex; activeSlideIndex;
colorScheme = { colorScheme = {
domain: ['#0000FF', '#B22222'] domain: [Fraction.COLOR_BLUFOR, Fraction.COLOR_OPFOR]
}; };
gradient = false; gradient = false;
xAxis = true; xAxis = true;
@ -68,10 +69,10 @@ export class StatisticOverviewComponent {
if (this.id === 'all') { if (this.id === 'all') {
this.title = "Gesamtübersicht"; this.title = "Gesamtübersicht";
wars.sort((a, b) => { wars.sort((a, b) => {
// sort by dates, because older campaign can contain newer war // sort by dates, because older campaign can contain newer war
if (a['date'] > (b['date'])) return -1; if (a['date'] > (b['date'])) return -1;
if (a['date'] < (b['date'])) return 1; if (a['date'] < (b['date'])) return 1;
return 0; return 0;
}) })
} else { } else {
this.title = campaign.title; this.title = campaign.title;
@ -100,20 +101,12 @@ export class StatisticOverviewComponent {
} }
initChart(wars: any[]) { initChart(wars: any[]) {
let pointsObj = [ const pointsObj = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
{ const pointsSumObj = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
"name": "NATO", const playersObj = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
"series": []
},
{
"name": "CSAT",
"series": []
}];
let pointsSumObj = JSON.parse(JSON.stringify(pointsObj));
let playersObj = JSON.parse(JSON.stringify(pointsObj));
for (let i = wars.length - 1; i >= 0; i--) { for (let i = wars.length - 1; i >= 0; i--) {
let j = wars.length - i - 1; const j = wars.length - i - 1;
const warDateString = ChartUtils.getShortDateString(wars[i].date); const warDateString = ChartUtils.getShortDateString(wars[i].date);
pointsObj[0].series.push({ pointsObj[0].series.push({
@ -158,7 +151,7 @@ export class StatisticOverviewComponent {
} }
isActiveSlide(index) { isActiveSlide(index) {
return this.activeSlideIndex === index ? '#d9edf7':'white' return this.activeSlideIndex === index ? '#d9edf7' : 'white'
} }
} }

View File

@ -5,9 +5,9 @@
<h2>{{war.title}} - vom {{war.date | date: 'dd.MM.yyyy'}}</h2> <h2>{{war.title}} - vom {{war.date | date: 'dd.MM.yyyy'}}</h2>
<div class="pull-left head-field" style="width: 250px"> <div class="pull-left head-field" style="width: 250px">
<h4>Endpunktestand:</h4> <h4>Endpunktestand:</h4>
<span class="text-blufor" style="font-weight: bold; margin-right: 10px">NATO {{war.ptBlufor}}</span> <span class="text-blufor" style="font-weight: bold; margin-right: 10px">{{BLUFOR}} {{war.ptBlufor}}</span>
<span style="font-size: x-large">|</span> <span style="font-size: x-large">|</span>
<span class="text-opfor" style="font-weight: bold; margin-left: 10px;">{{war.ptOpfor}} CSAT</span> <span class="text-opfor" style="font-weight: bold; margin-left: 10px;">{{war.ptOpfor}} {{OPFOR}}</span>
</div> </div>
<div class="pull-left head-field " style="padding-left: 140px;"> <div class="pull-left head-field " style="padding-left: 140px;">
@ -40,13 +40,13 @@
<input type="radio" name="fractSelect" value="BLUFOR" <input type="radio" name="fractSelect" value="BLUFOR"
[(ngModel)]="fractionRadioSelect" [(ngModel)]="fractionRadioSelect"
#fractRadioBufor #fractRadioBufor
(change)="filterPlayersByFraction(fractRadioBufor.value)">NATO (change)="filterPlayersByFraction(fractRadioBufor.value)">{{BLUFOR}}
</label> </label>
<label class="radio-inline"> <label class="radio-inline">
<input type="radio" name="fractSelect" value="OPFOR" <input type="radio" name="fractSelect" value="OPFOR"
[(ngModel)]="fractionRadioSelect" [(ngModel)]="fractionRadioSelect"
#fractRadioOpfor #fractRadioOpfor
(change)="filterPlayersByFraction(fractRadioOpfor.value)">CSAT (change)="filterPlayersByFraction(fractRadioOpfor.value)">{{OPFOR}}
</label> </label>
<br> <br>
</form> </form>
@ -80,7 +80,7 @@
</ngx-datatable-column> </ngx-datatable-column>
<ngx-datatable-column name="Fraktion" prop="fraction" [width]="100"> <ngx-datatable-column name="Fraktion" prop="fraction" [width]="100">
<ng-template ngx-datatable-cell-template let-value="value"> <ng-template ngx-datatable-cell-template let-value="value">
{{value === 'BLUFOR' ? 'NATO' : 'CSAT'}} {{value === 'BLUFOR' ? BLUFOR : OPFOR}}
</ng-template> </ng-template>
</ngx-datatable-column> </ngx-datatable-column>
<ngx-datatable-column [width]="90" name="Kills" prop="kill"></ngx-datatable-column> <ngx-datatable-column [width]="90" name="Kills" prop="kill"></ngx-datatable-column>
@ -165,6 +165,12 @@
</ngx-charts-area-chart> </ngx-charts-area-chart>
</div> </div>
</tab> </tab>
<tab>
<ng-template tabHeading>
<img src="../../../assets/player-stats-btn.png"> Player
</ng-template>
</tab>
</tabset> </tabset>
</div> </div>

View File

@ -7,6 +7,7 @@ import {LogsService} from "../../services/logs/logs.service";
import {TabsetComponent} from "ngx-bootstrap"; import {TabsetComponent} from "ngx-bootstrap";
import * as d3 from "d3"; import * as d3 from "d3";
import {ChartUtils} from "../../utils/chart-utils"; import {ChartUtils} from "../../utils/chart-utils";
import {Fraction} from "../../utils/fraction.enum";
@Component({ @Component({
@ -16,12 +17,22 @@ import {ChartUtils} from "../../utils/chart-utils";
}) })
export class WarDetailComponent { export class WarDetailComponent {
BLUFOR: string = Fraction.BLUFOR;
OPFOR: string = Fraction.OPFOR;
@ViewChild('overview') private overviewContainer: ElementRef; @ViewChild('overview') private overviewContainer: ElementRef;
@ViewChild('staticTabs') staticTabs: TabsetComponent; @ViewChild('staticTabs') staticTabs: TabsetComponent;
war: War = {players: []}; war: War = {players: []};
logData: any;
initialized: any;
startDateObj: Date;
public chartSelectModel: string; public chartSelectModel: string;
fractionRadioSelect: string; fractionRadioSelect: string;
@ -51,10 +62,8 @@ export class WarDetailComponent {
tmpStabilizeData; tmpStabilizeData;
tmpFlagCaptureData; tmpFlagCaptureData;
initialized;
colorScheme = { colorScheme = {
domain: ['#0000FF', '#B22222'] domain: [Fraction.COLOR_BLUFOR, Fraction.COLOR_OPFOR]
}; };
labelPoints = 'Punkte'; labelPoints = 'Punkte';
@ -80,12 +89,6 @@ export class WarDetailComponent {
timeline = false; timeline = false;
roundDomains = true; roundDomains = true;
startDateObj;
dataMode: string = 'Summe';
dataInterval: number = 0;
logData;
constructor(private route: ActivatedRoute, constructor(private route: ActivatedRoute,
private router: Router, private router: Router,
private warService: WarService, private warService: WarService,
@ -100,7 +103,7 @@ export class WarDetailComponent {
.subscribe(war => { .subscribe(war => {
this.war = war; this.war = war;
this.rows = war.players; this.rows = war.players;
this.playerChart = ChartUtils.getSingleDataArray('CSAT', war.playersOpfor, 'NATO', war.playersBlufor); this.playerChart = ChartUtils.getSingleDataArray(this.OPFOR, war.playersOpfor, this.BLUFOR, war.playersBlufor);
this.initialized = { this.initialized = {
basic: false, basic: false,
@ -187,13 +190,6 @@ export class WarDetailComponent {
} }
} }
toggleDataMode(interval, entryString) {
this.dataInterval = interval;
this.dataMode = entryString;
this.initTransportData();
this.lineChartData = this.tmpTransportData;
}
loadFractionData() { loadFractionData() {
if (this.initialized.basic) { if (this.initialized.basic) {
return; return;
@ -376,14 +372,14 @@ export class WarDetailComponent {
} }
initializeTempCollections() { initializeTempCollections() {
this.tmpPointData = ChartUtils.getMultiDataArray('NATO', 'CSAT'); this.tmpPointData = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
this.tmpBudgetData = ChartUtils.getMultiDataArray('NATO', 'CSAT'); this.tmpBudgetData = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
this.tmpKillData = ChartUtils.getMultiDataArray('NATO', 'CSAT'); this.tmpKillData = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
this.tmpFrienlyFireData = ChartUtils.getMultiDataArray('NATO', 'CSAT'); this.tmpFrienlyFireData = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
this.tmpTransportData = ChartUtils.getMultiDataArray('NATO', 'CSAT'); this.tmpTransportData = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
this.tmpReviveData = ChartUtils.getMultiDataArray('NATO', 'CSAT'); this.tmpReviveData = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
this.tmpStabilizeData = ChartUtils.getMultiDataArray('NATO', 'CSAT'); this.tmpStabilizeData = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
this.tmpFlagCaptureData = ChartUtils.getMultiDataArray('NATO', 'CSAT'); this.tmpFlagCaptureData = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
[this.tmpKillData, this.tmpFrienlyFireData, this.tmpReviveData, this.tmpStabilizeData, this.tmpTransportData].forEach(tmp => { [this.tmpKillData, this.tmpFrienlyFireData, this.tmpReviveData, this.tmpStabilizeData, this.tmpTransportData].forEach(tmp => {
[0, 1].forEach(index => { [0, 1].forEach(index => {

View File

@ -0,0 +1,6 @@
export enum Fraction {
BLUFOR = 'NATO',
OPFOR = 'CSAT',
COLOR_BLUFOR = '#0000FF',
COLOR_OPFOR = '#B22222'
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 623 B