SES-103 #38

Merged
s426134 merged 4 commits from SES-103 into dev 2020-12-21 17:00:11 +01:00
12 changed files with 201 additions and 74 deletions
Showing only changes of commit b49bdae96a - Show all commits

View File

@ -2610,6 +2610,36 @@
} }
} }
}, },
"@ngrx/store": {
"version": "10.1.1",
"resolved": "https://registry.npmjs.org/@ngrx/store/-/store-10.1.1.tgz",
"integrity": "sha512-JiSC1Y6yR2H5/FVgEDeQjXdzn20ru1Vw/4NnISHcwHT3tAn/cpT28cIh24r6HMCSqBwaqGLgCdpoi0TR2ZLkRQ==",
"requires": {
"tslib": "^2.0.0"
},
"dependencies": {
"tslib": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.0.3.tgz",
"integrity": "sha512-uZtkfKblCEQtZKBF6EBXVZeQNl82yqtDQdv+eck8u7tdPxjLu2/lp5/uPW+um2tpuxINHWy3GhiccY7QgEaVHQ=="
}
}
},
"@ngrx/store-devtools": {
"version": "10.1.1",
"resolved": "https://registry.npmjs.org/@ngrx/store-devtools/-/store-devtools-10.1.1.tgz",
"integrity": "sha512-w6hsuUqOndZHnRzFaONpzjgNKIPT8wCRejhru+ZyK/L/Q9zRSyBuKLhZLf/zhZXd0qx0vHjjxltDcKoEXNfviQ==",
"requires": {
"tslib": "^2.0.0"
},
"dependencies": {
"tslib": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.0.3.tgz",
"integrity": "sha512-uZtkfKblCEQtZKBF6EBXVZeQNl82yqtDQdv+eck8u7tdPxjLu2/lp5/uPW+um2tpuxINHWy3GhiccY7QgEaVHQ=="
}
}
},
"@ngtools/webpack": { "@ngtools/webpack": {
"version": "8.3.26", "version": "8.3.26",
"resolved": "https://registry.npmjs.org/@ngtools/webpack/-/webpack-8.3.26.tgz", "resolved": "https://registry.npmjs.org/@ngtools/webpack/-/webpack-8.3.26.tgz",

View File

@ -1,62 +1,64 @@
{ {
"name": "sessioncompanion", "name": "sessioncompanion",
"version": "0.0.0", "version": "0.0.0",
"scripts": { "scripts": {
"ng": "ng", "ng": "ng",
"start": "ng serve", "start": "ng serve",
"build": "ng build", "build": "ng build",
"build:ssr": "ng run SessionCompanion:server:dev", "build:ssr": "ng run SessionCompanion:server:dev",
"test": "ng test", "test": "ng test",
"lint": "ng lint", "lint": "ng lint",
"e2e": "ng e2e" "e2e": "ng e2e"
}, },
"private": true, "private": true,
"dependencies": { "dependencies": {
"@angular/animations": "8.2.12", "@angular/animations": "8.2.12",
"@angular/cdk": "~8.2.3", "@angular/cdk": "~8.2.3",
"@angular/common": "8.2.12", "@angular/common": "8.2.12",
"@angular/compiler": "8.2.12", "@angular/compiler": "8.2.12",
"@angular/core": "8.2.12", "@angular/core": "8.2.12",
"@angular/forms": "8.2.12", "@angular/forms": "8.2.12",
"@angular/material": "^8.2.3", "@angular/material": "^8.2.3",
"@angular/platform-browser": "8.2.12", "@angular/platform-browser": "8.2.12",
"@angular/platform-browser-dynamic": "8.2.12", "@angular/platform-browser-dynamic": "8.2.12",
"@angular/platform-server": "8.2.12", "@angular/platform-server": "8.2.12",
"@angular/router": "8.2.12", "@angular/router": "8.2.12",
"@microsoft/signalr": "^5.0.0", "@microsoft/signalr": "^5.0.0",
"@nguniversal/module-map-ngfactory-loader": "8.1.1", "@ngrx/store": "^10.1.1",
"aspnet-prerendering": "^3.0.1", "@ngrx/store-devtools": "^10.1.1",
"bootstrap": "^4.3.1", "@nguniversal/module-map-ngfactory-loader": "8.1.1",
"core-js": "^3.3.3", "aspnet-prerendering": "^3.0.1",
"hammerjs": "^2.0.8", "bootstrap": "^4.3.1",
"jquery": "3.4.1", "core-js": "^3.3.3",
"oidc-client": "^1.9.1", "hammerjs": "^2.0.8",
"popper.js": "^1.16.0", "jquery": "3.4.1",
"rxjs": "^6.5.3", "oidc-client": "^1.9.1",
"zone.js": "0.9.1" "popper.js": "^1.16.0",
}, "rxjs": "^6.5.3",
"devDependencies": { "zone.js": "0.9.1"
"@angular-devkit/build-angular": "^0.803.26", },
"@angular/cli": "^8.3.26", "devDependencies": {
"@angular/compiler-cli": "^8.2.14", "@angular-devkit/build-angular": "^0.803.26",
"@angular/language-service": "^8.2.12", "@angular/cli": "^8.3.26",
"@types/jasmine": "~3.4.4", "@angular/compiler-cli": "^8.2.14",
"@types/jasminewd2": "~2.0.8", "@angular/language-service": "^8.2.12",
"@types/node": "~12.11.6", "@types/jasmine": "~3.4.4",
"codelyzer": "^5.2.0", "@types/jasminewd2": "~2.0.8",
"jasmine-core": "~3.5.0", "@types/node": "~12.11.6",
"jasmine-spec-reporter": "~4.2.1", "codelyzer": "^5.2.0",
"karma": "^5.0.2", "jasmine-core": "~3.5.0",
"karma-chrome-launcher": "~3.1.0", "jasmine-spec-reporter": "~4.2.1",
"karma-coverage-istanbul-reporter": "~2.1.0", "karma": "^5.0.2",
"karma-jasmine": "~2.0.1", "karma-chrome-launcher": "~3.1.0",
"karma-jasmine-html-reporter": "^1.4.2", "karma-coverage-istanbul-reporter": "~2.1.0",
"typescript": "3.5.3" "karma-jasmine": "~2.0.1",
}, "karma-jasmine-html-reporter": "^1.4.2",
"optionalDependencies": { "typescript": "3.5.3"
"node-sass": "^4.12.0", },
"protractor": "~5.4.2", "optionalDependencies": {
"ts-node": "~8.4.1", "node-sass": "^4.12.0",
"tslint": "~5.20.0" "protractor": "~5.4.2",
} "ts-node": "~8.4.1",
} "tslint": "~5.20.0"
}
}

View File

@ -23,7 +23,7 @@ const routes: Routes = [
pathMatch: 'full' pathMatch: 'full'
}, },
{ {
path: 'gamemaster', path: 'game-master',
component: GameMasterDashboardComponent, component: GameMasterDashboardComponent,
pathMatch: 'full' pathMatch: 'full'
}, },

View File

@ -21,6 +21,11 @@ import {
MatIconModule, MatSidenavModule, MatToolbarModule, MatListModule MatIconModule, MatSidenavModule, MatToolbarModule, MatListModule
} from '@angular/material'; } from '@angular/material';
import {UserService} from '../services/user.service'; import {UserService} from '../services/user.service';
import { StoreModule } from '@ngrx/store';
import { StoreDevtoolsModule } from '@ngrx/store-devtools';
import { reducers} from './reducers';
import {AppReducer} from './store/reducers/app.reducer';
import {environment} from '../environments/environment';
@NgModule({ @NgModule({
declarations: [ declarations: [
@ -49,6 +54,10 @@ BrowserModule.withServerTransition({ appId: 'ng-cli-universal' }),
MatSidenavModule, MatSidenavModule,
MatToolbarModule, MatToolbarModule,
MatListModule, MatListModule,
StoreModule.forRoot({app: AppReducer}),
StoreDevtoolsModule.instrument({
logOnly: environment.production
})
], ],
providers: [ providers: [
UserService UserService

View File

@ -1,4 +1,4 @@
<div class="container font"> <div class="container font">
<button (click)="SignInWithRole()" id="player-button" class="button font">Player</button> <button (click)="SignInWithRole('player')" id="player-button" class="button font">Player</button>
<button (click)="SignInWithRole()" id="game-master-button" class="button font">Game Master</button> <button (click)="SignInWithRole('game-master')" id="game-master-button" class="button font">Game Master</button>
</div> </div>

View File

@ -1,5 +1,8 @@
import { Component } from '@angular/core'; import { Component } from '@angular/core';
import { Router } from '@angular/router'; import { Router } from '@angular/router';
import { Store } from '@ngrx/store';
import {AddRole} from '../../store/actions/app.actions';
@Component({ @Component({
selector: 'app-select-role', selector: 'app-select-role',
@ -9,14 +12,15 @@ import { Router } from '@angular/router';
export class SelectRoleComponent { export class SelectRoleComponent {
isExpanded = false; isExpanded = false;
constructor(private router: Router) {} constructor(private router: Router, private store: Store<{ role: string }>) {}
collapse() { collapse() {
this.isExpanded = false; this.isExpanded = false;
} }
SignInWithRole() { SignInWithRole(role: string) {
this.router.navigate(['login']) this.store.dispatch(new AddRole({role: role}));
this.router.navigate(['login']);
} }
toggle() { toggle() {

View File

@ -1,24 +1,31 @@
import { Component, OnDestroy } from '@angular/core'; import {Component, OnDestroy, OnInit} from '@angular/core';
import { FormGroup, Validators, FormBuilder } from '@angular/forms'; import { FormGroup, Validators, FormBuilder } from '@angular/forms';
import { Router } from '@angular/router'; import { Router } from '@angular/router';
import {UserService} from '../../../services/user.service'; import {UserService} from '../../../services/user.service';
import {ErrorResponse} from '../../../types/ErrorResponse'; import {ErrorResponse} from '../../../types/ErrorResponse';
import {Subscription} from 'rxjs'; import {Observable, Subscription} from 'rxjs';
import {HttpErrorResponse} from '@angular/common/http'; import {HttpErrorResponse} from '@angular/common/http';
import {AppStoreModel} from '../../store/models/app-store.model';
import { Store } from '@ngrx/store';
import {AddUserId} from '../../store/actions/app.actions';
@Component({ @Component({
selector: 'app-sign-in', selector: 'app-sign-in',
templateUrl: './sign-in.component.html', templateUrl: './sign-in.component.html',
styleUrls: ['./sign-in.component.css'] styleUrls: ['./sign-in.component.css']
}) })
export class SignInComponent implements OnDestroy { export class SignInComponent implements OnDestroy, OnInit {
allSubscriptions = new Subscription(); allSubscriptions = new Subscription();
role$: Observable<string>;
isExpanded = false; isExpanded = false;
apiError = false; apiError = false;
apiErrorMessage = ''; apiErrorMessage = '';
constructor(private router: Router, private formBuilder: FormBuilder, private userService: UserService) {} constructor(private router: Router, private formBuilder: FormBuilder,
private userService: UserService, private store: Store<AppStoreModel>) {
}
public signInFormGroup: FormGroup = this.formBuilder.group({ public signInFormGroup: FormGroup = this.formBuilder.group({
signIn: this.formBuilder.group({ signIn: this.formBuilder.group({
@ -29,13 +36,19 @@ export class SignInComponent implements OnDestroy {
}) })
}); });
ngOnInit() {
this.role$ = this.store.select('role');
}
onLoginButtonClick() { onLoginButtonClick() {
console.log(this.role$);
this.allSubscriptions.add( this.allSubscriptions.add(
this.userService.tryLogin( this.userService.tryLogin(
this.signInFormGroup.get('signIn').value['username'], this.signInFormGroup.get('signIn').value['username'],
this.signInFormGroup.get('signIn').value['password']).subscribe( this.signInFormGroup.get('signIn').value['password']).subscribe(
(success) => { (success) => {
this.router.navigate(['player']); this.store.dispatch(new AddUserId({userId: success}));
this.router.navigate([this.role$]);
}, },
(error: ErrorResponse | HttpErrorResponse) => { (error: ErrorResponse | HttpErrorResponse) => {
if (error instanceof HttpErrorResponse) { if (error instanceof HttpErrorResponse) {

View File

@ -0,0 +1,19 @@
import {
ActionReducer,
ActionReducerMap,
createFeatureSelector,
createSelector,
MetaReducer
} from '@ngrx/store';
import { environment } from '../../environments/environment';
export interface State {
}
export const reducers: ActionReducerMap<State> = {
};
export const metaReducers: MetaReducer<State>[] = !environment.production ? [] : [];

View File

@ -0,0 +1,23 @@
import {AppStoreModel} from '../models/app-store.model';
import { Action } from '@ngrx/store';
export enum AppActionTypes {
ADD_USER_ID = '[APP] Add user id',
ADD_ROLE = '[APP] Add role'
}
export class AddUserId implements Action {
readonly type = AppActionTypes.ADD_USER_ID;
constructor(public payload: {userId: number}) {
}
}
export class AddRole implements Action {
readonly type = AppActionTypes.ADD_ROLE;
constructor(public payload: {role: string}) {
}
}
export type AppAction = AddUserId | AddRole;

View File

@ -0,0 +1,5 @@
import {AppStoreModel} from './app-store.model';
export interface AppState {
readonly player: AppStoreModel;
}

View File

@ -0,0 +1,4 @@
export interface AppStoreModel {
userId: number;
role: string;
}

View File

@ -0,0 +1,18 @@
import {AppStoreModel} from '../models/app-store.model';
import {AppAction, AppActionTypes} from '../actions/app.actions';
const initialState: AppStoreModel = {
userId: null,
role: ''
};
export function AppReducer(state: AppStoreModel = initialState, action: AppAction) {
switch (action.type) {
case AppActionTypes.ADD_USER_ID:
return {...state, userId: action.payload.userId};
case AppActionTypes.ADD_ROLE:
return {...state, role: action.payload.role};
default:
return state;
}
}