SES-159 #78
@ -1,4 +1,4 @@
|
||||
<h1 mat-dialog-title>Chose Monsters</h1>
|
||||
<h1 mat-dialog-title>Choose Monsters</h1>
|
||||
|
||||
<div mat-dialog-content>
|
||||
<mat-form-field>
|
||||
<mat-label>Filter</mat-label>
|
||||
|
@ -25,7 +25,7 @@
|
||||
}
|
||||
.turn-tracker-list {
|
||||
border: solid 1px #3d4751;
|
||||
min-height: 60px;
|
||||
min-height: 81px;
|
||||
background: #606f80;
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
|
@ -36,9 +36,9 @@
|
||||
<div
|
||||
cdkDropList
|
||||
[cdkDropListData]="characterList"
|
||||
class="turn-tracker-list character-list"
|
||||
class="turn-tracker-list"
|
||||
(cdkDropListDropped)="drop($event)">
|
||||
<div class="turn-tracker-box" *ngFor="let item of characterList" cdkDrag>
|
||||
<div class="turn-tracker-box character-list" *ngFor="let item of characterList" cdkDrag>
|
||||
<span class="turn-tracker-box-name">
|
||||
{{item.name}}
|
||||
</span>
|
||||
|
@ -1,4 +1,4 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { Component, OnDestroy, OnInit } from '@angular/core';
|
||||
import {
|
||||
CdkDragDrop,
|
||||
moveItemInArray,
|
||||
@ -9,16 +9,23 @@ import { first } from 'rxjs/operators';
|
||||
import { MatDialog } from '@angular/material';
|
||||
import { ChooseMonsterDialogComponent } from '../choose-monster-dialog/choose-monster-dialog.component';
|
||||
import { MonsterViewModel } from '../../../types/viewmodels/monster-viewmodels/MonsterViewModel';
|
||||
import { Store } from '@ngrx/store';
|
||||
import { AddTurnTrackerList } from '../../store/actions/game-master.actions';
|
||||
import { AppState } from '../../store/models/app-state.model';
|
||||
|
||||
@Component({
|
||||
selector: 'app-game-master-turntracker',
|
||||
templateUrl: './game-master-turntracker.component.html',
|
||||
styleUrls: ['./game-master-turntracker.component.css'],
|
||||
})
|
||||
export class GameMasterTurntrackerComponent implements OnInit {
|
||||
turnTrackerList: { name: string; characterId: number; monsterId: number }[];
|
||||
export class GameMasterTurntrackerComponent implements OnInit, OnDestroy {
|
||||
turnTrackerList: {
|
||||
name: string;
|
||||
characterId: number;
|
||||
monsterId: number;
|
||||
}[] = [];
|
||||
|
||||
characterList: { name: string; characterId: number }[];
|
||||
characterList: { name: string; characterId: number }[] = [];
|
||||
|
||||
drop(event: CdkDragDrop<any[]>) {
|
||||
if (event.previousContainer === event.container) {
|
||||
@ -38,17 +45,16 @@ export class GameMasterTurntrackerComponent implements OnInit {
|
||||
}
|
||||
s426128 marked this conversation as resolved
s426128
commented
tego przykładu chyba nie potrzebujemy? dziwnie wygląda wydanie tego do pokazu aplikacji tego przykładu chyba nie potrzebujemy? dziwnie wygląda wydanie tego do pokazu aplikacji
|
||||
constructor(
|
||||
private characterService: CharacterService,
|
||||
public dialog: MatDialog
|
||||
public dialog: MatDialog,
|
||||
private store: Store<AppState>
|
||||
) {
|
||||
this.turnTrackerList = [
|
||||
{
|
||||
monsterId: 1,
|
||||
name:
|
||||
'StrasznaaaaaaaaySt rasznaaaaaaaay Strasznaaaaaaaa yStrasznaaaaaaaayStra sznaaaaaaaay StrasznaaaaaaaayvStrasznaaaaaaaay Strasznaaaaaaaay',
|
||||
characterId: null,
|
||||
},
|
||||
];
|
||||
this.GetLoggedCharacters();
|
||||
this.store
|
||||
.select((s) => s.gameMasterStore.turnTrackerList)
|
||||
.pipe(first())
|
||||
.subscribe((result) => {
|
||||
this.turnTrackerList = result;
|
||||
this.GetLoggedCharacters();
|
||||
});
|
||||
}
|
||||
|
||||
ngOnInit() {}
|
||||
@ -97,28 +103,36 @@ export class GameMasterTurntrackerComponent implements OnInit {
|
||||
});
|
||||
|
||||
dialogRef.afterClosed().subscribe((result: MonsterViewModel[]) => {
|
||||
let monstersOnList = this.turnTrackerList.filter(
|
||||
(c) => c.monsterId !== null
|
||||
);
|
||||
result.forEach((ele) => {
|
||||
if (monstersOnList.map((e) => e.name).includes(ele.name)) {
|
||||
debugger;
|
||||
let maxCurrentId = Math.max(
|
||||
...monstersOnList.map((e) => e.monsterId),
|
||||
0
|
||||
);
|
||||
maxCurrentId += 1;
|
||||
this.turnTrackerList = [
|
||||
...this.turnTrackerList,
|
||||
{ name: ele.name, characterId: null, monsterId: maxCurrentId },
|
||||
];
|
||||
} else {
|
||||
this.turnTrackerList = [
|
||||
...this.turnTrackerList,
|
||||
{ name: ele.name, characterId: null, monsterId: 1 },
|
||||
];
|
||||
}
|
||||
});
|
||||
if (result != null) {
|
||||
let monstersOnList = this.turnTrackerList.filter(
|
||||
(c) => c.monsterId !== null
|
||||
);
|
||||
result.forEach((ele) => {
|
||||
if (monstersOnList.map((e) => e.name).includes(ele.name)) {
|
||||
debugger;
|
||||
let maxCurrentId = Math.max(
|
||||
...monstersOnList.map((e) => e.monsterId),
|
||||
0
|
||||
);
|
||||
maxCurrentId += 1;
|
||||
this.turnTrackerList = [
|
||||
...this.turnTrackerList,
|
||||
{ name: ele.name, characterId: null, monsterId: maxCurrentId },
|
||||
];
|
||||
} else {
|
||||
this.turnTrackerList = [
|
||||
...this.turnTrackerList,
|
||||
{ name: ele.name, characterId: null, monsterId: 1 },
|
||||
];
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
this.store.dispatch(
|
||||
new AddTurnTrackerList({ turnTrackerList: this.turnTrackerList })
|
||||
);
|
||||
}
|
||||
}
|
||||
|
@ -0,0 +1,21 @@
|
||||
import { Action } from '@ngrx/store';
|
||||
|
||||
export enum GameMasterActionTypes {
|
||||
ADD_TURN_TRACKER_LIST = '[GAME MASTER] Add turn tracker list',
|
||||
}
|
||||
|
||||
export class AddTurnTrackerList implements Action {
|
||||
readonly type = GameMasterActionTypes.ADD_TURN_TRACKER_LIST;
|
||||
|
||||
constructor(
|
||||
public payload: {
|
||||
turnTrackerList: {
|
||||
name: string;
|
||||
characterId: number;
|
||||
monsterId: number;
|
||||
}[];
|
||||
}
|
||||
) {}
|
||||
}
|
||||
|
||||
export type GameMasterAction = AddTurnTrackerList;
|
@ -1,15 +1,19 @@
|
||||
import {AppStoreModel} from './app-store.model';
|
||||
import {ActionReducerMap} from '@ngrx/store';
|
||||
import {AppReducer} from '../reducers/app.reducer';
|
||||
import {PlayerStoreModel} from './player-store.model';
|
||||
import {PlayerReducer} from '../reducers/player.reducer';
|
||||
import { AppStoreModel } from './app-store.model';
|
||||
import { ActionReducerMap } from '@ngrx/store';
|
||||
import { AppReducer } from '../reducers/app.reducer';
|
||||
import { PlayerStoreModel } from './player-store.model';
|
||||
import { PlayerReducer } from '../reducers/player.reducer';
|
||||
import { GameMasterStoreModel } from './game-master-store.model';
|
||||
import { GameMasterReducer } from '../reducers/game-master.reducer';
|
||||
|
||||
export interface AppState {
|
||||
appStore: AppStoreModel;
|
||||
playerStore: PlayerStoreModel;
|
||||
gameMasterStore: GameMasterStoreModel;
|
||||
}
|
||||
|
||||
export const reducers: ActionReducerMap<AppState> = {
|
||||
appStore: AppReducer,
|
||||
playerStore: PlayerReducer,
|
||||
gameMasterStore: GameMasterReducer,
|
||||
};
|
||||
|
@ -0,0 +1,7 @@
|
||||
export interface GameMasterStoreModel {
|
||||
turnTrackerList: {
|
||||
name: string;
|
||||
characterId: number;
|
||||
monsterId: number;
|
||||
}[];
|
||||
}
|
@ -0,0 +1,21 @@
|
||||
import { GameMasterStoreModel } from '../models/game-master-store.model';
|
||||
import {
|
||||
GameMasterAction,
|
||||
GameMasterActionTypes,
|
||||
} from '../actions/game-master.actions';
|
||||
|
||||
const initialState: GameMasterStoreModel = {
|
||||
turnTrackerList: [],
|
||||
};
|
||||
|
||||
export function GameMasterReducer(
|
||||
state: GameMasterStoreModel = initialState,
|
||||
action: GameMasterAction
|
||||
) {
|
||||
switch (action.type) {
|
||||
case GameMasterActionTypes.ADD_TURN_TRACKER_LIST:
|
||||
return { ...state, turnTrackerList: action.payload.turnTrackerList };
|
||||
default:
|
||||
return state;
|
||||
}
|
||||
}
|
Loading…
Reference in New Issue
Block a user
Choose Monsters : )