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

SES-156 added routing for creating character

This commit is contained in:
Natalia Gawron 2021-01-22 19:46:09 +01:00
parent 844137b551
commit 9c41f51820
9 changed files with 86 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
SessionCompanion/SessionCompanion/ClientApp/src/app.routing.ts
View File

@ -5,6 +5,7 @@ import { RegistrationComponent } from './app/components/registration/registratio
import {GameMasterDashboardComponent} from './app/components/game-master-dashboard/game-master-dashboard.component';
import {PlayerDashboardComponent} from './app/components/player-dashboard/player-dashboard.component';
import { SelectCharacterComponent } from './app/components/select-character/select-character.component';
import {CreateCharacterComponent} from "./app/components/create-character/create-character.component";
const routes: Routes = [
{
@ -37,6 +38,11 @@ const routes: Routes = [
component: SelectCharacterComponent,
pathMatch: 'full'
},
{
path: 'create-character',
component: CreateCharacterComponent,
pathMatch: 'full'
},
];
export const appRoutingModule = RouterModule.forRoot(routes);

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

@ -62,6 +62,7 @@ import { MessageDialogComponent } from './shared/message-dialog/message-dialog.c
import { GameMasterTurntrackerComponent } from './components/game-master-turntracker/game-master-turntracker.component';
import { DragDropModule } from '@angular/cdk/drag-drop';
import { ChooseMonsterDialogComponent } from './components/choose-monster-dialog/choose-monster-dialog.component';
import { CreateCharacterComponent } from './components/create-character/create-character.component';
@NgModule({
declarations: [
@ -90,6 +91,7 @@ import { ChooseMonsterDialogComponent } from './components/choose-monster-dialog
MessageDialogComponent,
GameMasterTurntrackerComponent,
ChooseMonsterDialogComponent,
CreateCharacterComponent,
],
imports: [
BrowserModule.withServerTransition({ appId: 'ng-cli-universal' }),
@ -151,6 +153,7 @@ import { ChooseMonsterDialogComponent } from './components/choose-monster-dialog
MessageDialogComponent,
GameMasterTurntrackerComponent,
ChooseMonsterDialogComponent,
CreateCharacterComponent,
],
})
export class AppModule {}

1
SessionCompanion/SessionCompanion/ClientApp/src/app/components/create-character/create-character.component.css Normal file
View File

@ -0,0 +1 @@
@import "../../../styles.css";

8
SessionCompanion/SessionCompanion/ClientApp/src/app/components/create-character/create-character.component.html Normal file
View File

@ -0,0 +1,8 @@
<p>create-character works!</p>
<button
id="create-character-submit-button"
mat-raised-button
class="btn-primary form-container"
(click)="onCreateCharacterButton()">
CONTINUE
</button>

25
SessionCompanion/SessionCompanion/ClientApp/src/app/components/create-character/create-character.component.spec.ts Normal file
View File

@ -0,0 +1,25 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { CreateCharacterComponent } from './create-character.component';
describe('CreateCharacterComponent', () => {
let component: CreateCharacterComponent;
let fixture: ComponentFixture<CreateCharacterComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ CreateCharacterComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(CreateCharacterComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

19
SessionCompanion/SessionCompanion/ClientApp/src/app/components/create-character/create-character.component.ts Normal file
View File

@ -0,0 +1,19 @@
import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
@Component({
selector: 'app-create-character',
templateUrl: './create-character.component.html',
styleUrls: ['./create-character.component.css']
})
export class CreateCharacterComponent implements OnInit {
constructor(private router: Router) { }
ngOnInit() {
}
onCreateCharacterButton() {
this.router.navigate(['select-character']);
}
}

5
SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.css
View File

@ -69,3 +69,8 @@ input {
padding-top: 5%;
}
}
.mat-divider--custom-style {
background-color: #9e8b6e;
box-shadow: 0 1px 0 0 #d8d8d8;
}

19
SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.html
View File

@ -1,15 +1,26 @@
<div class="container">
<mat-icon matSuffix class="arrow-back arrow-select" (click)="onArrowBackClick()">arrow_back</mat-icon>
<div class="primary-text header">Select character</div>
<div *ngFor="let character of charactersList" class="primary-text header">Select character</div>
<mat-divider *ngFor="let character of charactersList" class="mat-divider--custom-style"></mat-divider>
<mat-list>
<mat-divider></mat-divider>
<mat-list-item *ngFor="let character of charactersList">
<mat-icon mat-list-icon>account_circle</mat-icon>
<div mat-line>{{character.name}}</div>
<div mat-line (click)="onCharacterClick(character.id)">{{character.name}}</div>
<mat-icon matSuffix class="arrow-forward arrow-select" (click)="onCharacterClick(character.id)">arrow_forward</mat-icon>
<div mat-line> {{character.className}} level: {{character.level}}</div>
<mat-divider></mat-divider>
<mat-divider class="mat-divider--custom-style"></mat-divider>
</mat-list-item>
</mat-list>
<div *ngFor="let character of charactersList" class="primary-text header">or</div>
<div class="primary-text header">Create character</div>
<mat-divider class="mat-divider--custom-style"></mat-divider>
<mat-list>
<mat-list-item>
<mat-icon mat-list-icon>account_circle</mat-icon>
<div mat-line>Create character</div>
<mat-icon matSuffix class="arrow-forward arrow-select" (click)="onCreateCharacter()">arrow_forward</mat-icon>
</mat-list-item>
</mat-list>
<mat-divider class="mat-divider--custom-style"></mat-divider>
</div>

4
SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.ts
View File

@ -46,4 +46,8 @@ export class SelectCharacterComponent implements OnInit {
this.store.dispatch(new ClearUserId());
this.router.navigate(['login']);
}
onCreateCharacter() {
this.router.navigate(['create-character']);
}
}