s426135/session-companion
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

SES-139 added dialog on character click in gm screen

Browse Source
This commit is contained in:
Łukasz Góreczny 2021-01-10 15:28:14 +01:00
parent b13a34044b
commit edb72d1701
6 changed files with 58 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
SessionCompanion/SessionCompanion/ClientApp/src/app/app.module.ts
View File

@ -25,6 +25,7 @@ import {
MatPaginatorModule,
MatTableModule,
MatSortModule,
MatDialogModule,
} from '@angular/material';
import { UserService } from '../services/user.service';
import { StoreModule } from '@ngrx/store';
@ -35,6 +36,7 @@ import { CharacterService } from '../services/character.service';
import { AbilityCardComponent } from './components/ability-card/ability-card.component';
import { GameMasterSpellsTableComponent } from './components/game-master-spells-table/game-master-spells-table.component';
import { GameMasterArmorsTableComponent } from './components/game-master-armors-table/game-master-armors-table.component';
import { GameMasterCharacterActionsDialogComponent } from './components/game-master-character-actions-dialog/game-master-character-actions-dialog.component';
@NgModule({
declarations: [
@ -48,6 +50,7 @@ import { GameMasterArmorsTableComponent } from './components/game-master-armors-
AbilityCardComponent,
GameMasterSpellsTableComponent,
GameMasterArmorsTableComponent,
GameMasterCharacterActionsDialogComponent,
],
imports: [
BrowserModule.withServerTransition({ appId: 'ng-cli-universal' }),
@ -66,6 +69,7 @@ import { GameMasterArmorsTableComponent } from './components/game-master-armors-
MatSidenavModule,
MatToolbarModule,
MatListModule,
MatDialogModule,
MatPaginatorModule,
StoreModule.forRoot(reducers),
StoreDevtoolsModule.instrument({
@ -79,6 +83,7 @@ import { GameMasterArmorsTableComponent } from './components/game-master-armors-
entryComponents: [
GameMasterSpellsTableComponent,
GameMasterArmorsTableComponent,
GameMasterCharacterActionsDialogComponent,
],
})
export class AppModule {}

12
SessionCompanion/SessionCompanion/ClientApp/src/app/components/game-master-character-actions-dialog/game-master-character-actions-dialog.component.css Normal file
View File

@ -0,0 +1,12 @@
.character-dialog-title {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
::ng-deep .mat-dialog-container {
background-color: #4a5867;
color: whitesmoke;
box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2),
0 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 5px 20px 4px #d8d8d8;
}

5
SessionCompanion/SessionCompanion/ClientApp/src/app/components/game-master-character-actions-dialog/game-master-character-actions-dialog.component.html Normal file
View File

@ -0,0 +1,5 @@
<h1 mat-dialog-title class="character-dialog-title">
{{characterName}}
</h1>
<div mat-dialog-content>
</div>

22
SessionCompanion/SessionCompanion/ClientApp/src/app/components/game-master-character-actions-dialog/game-master-character-actions-dialog.component.ts Normal file
View File

@ -0,0 +1,22 @@
import { Component, Inject, OnInit } from '@angular/core';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material';
@Component({
selector: 'app-game-master-character-actions-dialog',
templateUrl: './game-master-character-actions-dialog.component.html',
styleUrls: ['./game-master-character-actions-dialog.component.css'],
})
export class GameMasterCharacterActionsDialogComponent implements OnInit {
characterId: number;
characterName: string;
constructor(
public dialogRef: MatDialogRef<GameMasterCharacterActionsDialogComponent>,
@Inject(MAT_DIALOG_DATA) public data: any
) {}
ngOnInit() {
this.characterId = this.data.characterid;
this.characterName = this.data.characterName;
}
}

2
SessionCompanion/SessionCompanion/ClientApp/src/app/components/game-master-dashboard/game-master-dashboard.component.html
View File

@ -79,7 +79,7 @@
</div>
<mat-divider></mat-divider>
<mat-nav-list>
<mat-list-item *ngFor="let loggedCharacter of loggedCharacters">
<mat-list-item *ngFor="let loggedCharacter of loggedCharacters" (click)="OpenCharacterDialog(loggedCharacter.id, loggedCharacter.name)">
<mat-icon
svgIcon="{{ loggedCharacter.class.toLowerCase() }}"
mat-list-icon

14
SessionCompanion/SessionCompanion/ClientApp/src/app/components/game-master-dashboard/game-master-dashboard.component.ts
View File

@ -13,6 +13,8 @@ import { first } from 'rxjs/operators';
import { LeftNavItem } from '../../../types/LeftNavItem';
import { GameMasterSpellsTableComponent } from '../game-master-spells-table/game-master-spells-table.component';
import { GameMasterArmorsTableComponent } from '../game-master-armors-table/game-master-armors-table.component';
import { MatDialog } from '@angular/material';
import { GameMasterCharacterActionsDialogComponent } from '../game-master-character-actions-dialog/game-master-character-actions-dialog.component';
@Component({
selector: 'app-game-master-dashboard',
@ -53,7 +55,8 @@ export class GameMasterDashboardComponent implements OnInit, OnDestroy {
constructor(
private signalRService: GMSignalRService,
private characterService: CharacterService
private characterService: CharacterService,
public dialog: MatDialog
) {
this.SubscribeToEvents();
}
@ -96,6 +99,15 @@ export class GameMasterDashboardComponent implements OnInit, OnDestroy {
);
}
public OpenCharacterDialog(characterid: number, characterName: string) {
const dialogRef = this.dialog.open(
GameMasterCharacterActionsDialogComponent,
{
data: { characterid: characterid, characterName: characterName },
}
);
}
ChangeMiddleComponent(componentName: string): void {
switch (componentName) {
case 'GameMasterSpellsTableComponent':