diff --git a/package.json b/package.json index 66e48af..f362eff 100644 --- a/package.json +++ b/package.json @@ -17,7 +17,7 @@ "@angular/common": "^5.2.0", "@angular/compiler": "^5.2.0", "@angular/core": "^5.2.0", - "@angular/flex-layout": "^2.0.0-beta.12", + "@angular/flex-layout": "2.0.0-beta.12", "@angular/forms": "^5.2.0", "@angular/http": "^5.2.0", "@angular/material": "^5.2.1", diff --git a/src/app/board/control-container/control-container.component.ts b/src/app/board/control-container/control-container.component.ts index dcf14ce..a7e2ec4 100644 --- a/src/app/board/control-container/control-container.component.ts +++ b/src/app/board/control-container/control-container.component.ts @@ -3,7 +3,7 @@ import { Store } from '@ngrx/store'; import { Observable } from 'rxjs/Observable'; import { map } from 'rxjs/operators'; import * as fromStore from '../../store'; -import { ResetScore, StartPlaying, StopPlaying } from '../../store/actions'; +import { ResetScore, StartPlaying, StopPlaying, ResetAttempts, AddAttempt, AddScore } from '../../store/actions'; // import { AddScore } from '../../store/actions/score.actions'; // import { AddAttempt } from '../../store/actions/attempts.actions'; import { Attempt } from './../../store/reducers/attempts.reducer'; @@ -105,6 +105,7 @@ export class ControlContainerComponent implements OnInit { private startGame() { this.store.dispatch(new StartPlaying()); this.store.dispatch(new ResetScore()); + this.store.dispatch(new ResetAttempts()); // TODO #10 dispatch the Action for reset the attempts here this.startGameSound.nativeElement.play(); setTimeout(() => this.generateRandomControl(), this.TIME_TO_START_GAME); @@ -132,9 +133,9 @@ export class ControlContainerComponent implements OnInit { } private pressButtonEffect(button: ElementRef, - colorClassName: string, - timeDelay: number, - isPressedByUser = false) { + colorClassName: string, + timeDelay: number, + isPressedByUser = false) { const dom = button.nativeElement.querySelector('button'); dom.click(); dom.classList.add(colorClassName); @@ -154,6 +155,7 @@ export class ControlContainerComponent implements OnInit { if (this.currentArrow === arrowPressed) { this.sayGood(); // TODO #12: Dispatch the AddScore action here adding as parameter 20 points :D + this.store.dispatch(new AddScore(20)); this.registerAttempt(arrowPressed, true); } else { this.registerAttempt(arrowPressed, false); @@ -179,6 +181,7 @@ export class ControlContainerComponent implements OnInit { } // TODO #11: Dispatch the AddAttempt action here, adding as parameter the current attempt + this.store.dispatch(new AddAttempt(attempt)); } private sayGameOver() { diff --git a/src/app/score/count-down/count-down.component.ts b/src/app/score/count-down/count-down.component.ts index af318ae..182068a 100644 --- a/src/app/score/count-down/count-down.component.ts +++ b/src/app/score/count-down/count-down.component.ts @@ -16,7 +16,7 @@ export class CountDownComponent implements OnInit { runningCountDown: boolean; // Constants // TODO #14: Update the count down to 10 seconds - TIME_COUNT_DOWN = 3; + TIME_COUNT_DOWN = 10; constructor(private store: Store) { } diff --git a/src/app/score/score-display/score-display.component.ts b/src/app/score/score-display/score-display.component.ts index 14705c8..a52d74d 100644 --- a/src/app/score/score-display/score-display.component.ts +++ b/src/app/score/score-display/score-display.component.ts @@ -18,6 +18,6 @@ export class ScoreDisplayComponent implements OnInit { ngOnInit() { // TODO #13: If you want to show the current score, remove the next comment. - // this.score$ = this.store.pipe(map(state => state.score.scoreValue)); + this.score$ = this.store.pipe(map(state => state.score.scoreValue)); } } diff --git a/src/app/store/actions/attempts.actions.ts b/src/app/store/actions/attempts.actions.ts index 60501a3..699d898 100644 --- a/src/app/store/actions/attempts.actions.ts +++ b/src/app/store/actions/attempts.actions.ts @@ -1,13 +1,22 @@ +import { Action } from '@ngrx/store'; +import { Attempt } from '../reducers/attempts.reducer'; // Action Constants // TODO #1 : Define the ADD_ATTEMPT and RESET_ATTEMPT actions export const RESET_ATTEMPTS = '[Attempts] Reset Attempts'; +export const ADD_ATTEMPT = '[Attempts] Add Attempt'; // Action Creators // TODO #2 : Define the AddAttempt and ResetAttempts implementing the Action (@ngrx/store) interface -export class ResetAttempts { +export class ResetAttempts implements Action { + readonly type = RESET_ATTEMPTS; +} + +export class AddAttempt implements Action { + readonly type = ADD_ATTEMPT; + constructor(public payload: Attempt) { } } // Action Types // TODO #3: Complete types for the Attempts Actions -export type AttemptsActions = ResetAttempts; +export type AttemptsActions = ResetAttempts | AddAttempt; diff --git a/src/app/store/actions/score.actions.ts b/src/app/store/actions/score.actions.ts index 8a79ebd..63805f5 100644 --- a/src/app/store/actions/score.actions.ts +++ b/src/app/store/actions/score.actions.ts @@ -1,15 +1,22 @@ // Action Constants -// TODO #4 Add actions here +// TODO #4 Add the action to add score here import { Action } from '@ngrx/store'; +import { ScoreState } from '../reducers/score.reducer'; export const RESET_SCORE = '[Score] Setting the score to 0'; +export const ADD_SCORE = '[Score] Adding score in 1 point'; // Action Creators -// TODO #5 Implement action creators here +// TODO #5 Implement action creators to add the score here export class ResetScore implements Action { readonly type = RESET_SCORE; } +export class AddScore implements Action { + readonly type = ADD_SCORE; + constructor(public payload: number) { } +} + // Action Types -// TODO #6 Implement action types here. Do not forget export your things. -export type ScoreActions = ResetScore; +// TODO #6 Implement action types remaining here. Do not forget export your things. +export type ScoreActions = ResetScore | AddScore; diff --git a/src/app/store/reducers/attempts.reducer.ts b/src/app/store/reducers/attempts.reducer.ts index 6b578fd..a418db1 100644 --- a/src/app/store/reducers/attempts.reducer.ts +++ b/src/app/store/reducers/attempts.reducer.ts @@ -24,5 +24,18 @@ export const initialState: AttemptsState = { */ export function reducer(state = initialState, action: fromAttempts.AttemptsActions): AttemptsState { // TODO #7 : Implement the reducer for the actions created + switch (action.type) { + case fromAttempts.RESET_ATTEMPTS: { + return { + attempts: [] + }; + } + case fromAttempts.ADD_ATTEMPT: { + const newAttemps = [...state.attempts, action.payload]; + return { + attempts: newAttemps + }; + } + } return state; } diff --git a/src/app/store/reducers/index.ts b/src/app/store/reducers/index.ts index 03fbf9e..7d39bda 100644 --- a/src/app/store/reducers/index.ts +++ b/src/app/store/reducers/index.ts @@ -8,6 +8,8 @@ import { ActionReducerMap } from '@ngrx/store'; */ export interface ApplicationState { ui: fromUi.UiState; + attempts: fromAttempts.AttemptsState; + score: fromScore.ScoreState; } /** @@ -16,4 +18,6 @@ export interface ApplicationState { */ export const reducers: ActionReducerMap = { ui: fromUi.reducer, + attempts: fromAttempts.reducer, + score: fromScore.reducer }; diff --git a/src/app/store/reducers/score.reducer.ts b/src/app/store/reducers/score.reducer.ts index 05de644..1263bd6 100644 --- a/src/app/store/reducers/score.reducer.ts +++ b/src/app/store/reducers/score.reducer.ts @@ -8,7 +8,7 @@ export interface ScoreState { // Initial state definition // TODO #9 : Fix the initial state export const initialState: ScoreState = { - scoreValue: 9999999 + scoreValue: 0 }; /** @@ -26,6 +26,13 @@ export function reducer(state = initialState, action: fromScore.ScoreActions): S scoreValue: 0 }; + case fromScore.ADD_SCORE: { + const newScore = state.scoreValue + action.payload; + return { + scoreValue: newScore + }; + } + default: return state; } diff --git a/yarn.lock b/yarn.lock index 691f464..d9b3e36 100644 --- a/yarn.lock +++ b/yarn.lock @@ -129,7 +129,7 @@ dependencies: tslib "^1.7.1" -"@angular/flex-layout@^2.0.0-beta.12": +"@angular/flex-layout@2.0.0-beta.12": version "2.0.0-beta.12" resolved "https://registry.yarnpkg.com/@angular/flex-layout/-/flex-layout-2.0.0-beta.12.tgz#80970dc1d60f27fa41537659926f3238f759f343" dependencies: