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>
|
<div mat-dialog-content>
|
||||||
<mat-form-field>
|
<mat-form-field>
|
||||||
<mat-label>Filter</mat-label>
|
<mat-label>Filter</mat-label>
|
||||||
|
@ -25,7 +25,7 @@
|
|||||||
}
|
}
|
||||||
.turn-tracker-list {
|
.turn-tracker-list {
|
||||||
border: solid 1px #3d4751;
|
border: solid 1px #3d4751;
|
||||||
min-height: 60px;
|
min-height: 81px;
|
||||||
background: #606f80;
|
background: #606f80;
|
||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
@ -36,9 +36,9 @@
|
|||||||
<div
|
<div
|
||||||
cdkDropList
|
cdkDropList
|
||||||
[cdkDropListData]="characterList"
|
[cdkDropListData]="characterList"
|
||||||
class="turn-tracker-list character-list"
|
class="turn-tracker-list"
|
||||||
(cdkDropListDropped)="drop($event)">
|
(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">
|
<span class="turn-tracker-box-name">
|
||||||
{{item.name}}
|
{{item.name}}
|
||||||
</span>
|
</span>
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
import { Component, OnInit } from '@angular/core';
|
import { Component, OnDestroy, OnInit } from '@angular/core';
|
||||||
import {
|
import {
|
||||||
CdkDragDrop,
|
CdkDragDrop,
|
||||||
moveItemInArray,
|
moveItemInArray,
|
||||||
@ -9,16 +9,23 @@ import { first } from 'rxjs/operators';
|
|||||||
import { MatDialog } from '@angular/material';
|
import { MatDialog } from '@angular/material';
|
||||||
import { ChooseMonsterDialogComponent } from '../choose-monster-dialog/choose-monster-dialog.component';
|
import { ChooseMonsterDialogComponent } from '../choose-monster-dialog/choose-monster-dialog.component';
|
||||||
import { MonsterViewModel } from '../../../types/viewmodels/monster-viewmodels/MonsterViewModel';
|
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({
|
@Component({
|
||||||
selector: 'app-game-master-turntracker',
|
selector: 'app-game-master-turntracker',
|
||||||
templateUrl: './game-master-turntracker.component.html',
|
templateUrl: './game-master-turntracker.component.html',
|
||||||
styleUrls: ['./game-master-turntracker.component.css'],
|
styleUrls: ['./game-master-turntracker.component.css'],
|
||||||
})
|
})
|
||||||
export class GameMasterTurntrackerComponent implements OnInit {
|
export class GameMasterTurntrackerComponent implements OnInit, OnDestroy {
|
||||||
turnTrackerList: { name: string; characterId: number; monsterId: number }[];
|
turnTrackerList: {
|
||||||
|
name: string;
|
||||||
|
characterId: number;
|
||||||
|
monsterId: number;
|
||||||
|
}[] = [];
|
||||||
|
|
||||||
characterList: { name: string; characterId: number }[];
|
characterList: { name: string; characterId: number }[] = [];
|
||||||
|
|
||||||
drop(event: CdkDragDrop<any[]>) {
|
drop(event: CdkDragDrop<any[]>) {
|
||||||
if (event.previousContainer === event.container) {
|
if (event.previousContainer === event.container) {
|
||||||
@ -38,17 +45,16 @@ export class GameMasterTurntrackerComponent implements OnInit {
|
|||||||
}
|
}
|
||||||
s426128 marked this conversation as resolved
|
|||||||
constructor(
|
constructor(
|
||||||
private characterService: CharacterService,
|
private characterService: CharacterService,
|
||||||
public dialog: MatDialog
|
public dialog: MatDialog,
|
||||||
|
private store: Store<AppState>
|
||||||
) {
|
) {
|
||||||
this.turnTrackerList = [
|
this.store
|
||||||
{
|
.select((s) => s.gameMasterStore.turnTrackerList)
|
||||||
monsterId: 1,
|
.pipe(first())
|
||||||
name:
|
.subscribe((result) => {
|
||||||
'StrasznaaaaaaaaySt rasznaaaaaaaay Strasznaaaaaaaa yStrasznaaaaaaaayStra sznaaaaaaaay StrasznaaaaaaaayvStrasznaaaaaaaay Strasznaaaaaaaay',
|
this.turnTrackerList = result;
|
||||||
characterId: null,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
this.GetLoggedCharacters();
|
this.GetLoggedCharacters();
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
ngOnInit() {}
|
ngOnInit() {}
|
||||||
@ -97,6 +103,7 @@ export class GameMasterTurntrackerComponent implements OnInit {
|
|||||||
});
|
});
|
||||||
|
|
||||||
dialogRef.afterClosed().subscribe((result: MonsterViewModel[]) => {
|
dialogRef.afterClosed().subscribe((result: MonsterViewModel[]) => {
|
||||||
|
if (result != null) {
|
||||||
let monstersOnList = this.turnTrackerList.filter(
|
let monstersOnList = this.turnTrackerList.filter(
|
||||||
(c) => c.monsterId !== null
|
(c) => c.monsterId !== null
|
||||||
);
|
);
|
||||||
@ -119,6 +126,13 @@ export class GameMasterTurntrackerComponent implements OnInit {
|
|||||||
];
|
];
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
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;
|
@ -3,13 +3,17 @@ import {ActionReducerMap} from '@ngrx/store';
|
|||||||
import { AppReducer } from '../reducers/app.reducer';
|
import { AppReducer } from '../reducers/app.reducer';
|
||||||
import { PlayerStoreModel } from './player-store.model';
|
import { PlayerStoreModel } from './player-store.model';
|
||||||
import { PlayerReducer } from '../reducers/player.reducer';
|
import { PlayerReducer } from '../reducers/player.reducer';
|
||||||
|
import { GameMasterStoreModel } from './game-master-store.model';
|
||||||
|
import { GameMasterReducer } from '../reducers/game-master.reducer';
|
||||||
|
|
||||||
export interface AppState {
|
export interface AppState {
|
||||||
appStore: AppStoreModel;
|
appStore: AppStoreModel;
|
||||||
playerStore: PlayerStoreModel;
|
playerStore: PlayerStoreModel;
|
||||||
|
gameMasterStore: GameMasterStoreModel;
|
||||||
}
|
}
|
||||||
|
|
||||||
export const reducers: ActionReducerMap<AppState> = {
|
export const reducers: ActionReducerMap<AppState> = {
|
||||||
appStore: AppReducer,
|
appStore: AppReducer,
|
||||||
playerStore: PlayerReducer,
|
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
tego przykładu chyba nie potrzebujemy? dziwnie wygląda wydanie tego do pokazu aplikacji