diff --git a/package-lock.json b/package-lock.json index 5378f9a..1fa6364 100644 --- a/package-lock.json +++ b/package-lock.json @@ -19,6 +19,7 @@ "@types/crypto-js": "^4.1.1", "angular-cli-ghpages": "^1.0.6", "crypto-js": "^4.1.1", + "moment": "^2.29.4", "rxjs": "~7.8.0", "tslib": "^2.3.0", "xp.css": "^0.2.6", @@ -8242,6 +8243,14 @@ "mkdirp": "bin/cmd.js" } }, + "node_modules/moment": { + "version": "2.29.4", + "resolved": "https://registry.npmjs.org/moment/-/moment-2.29.4.tgz", + "integrity": "sha512-5LC9SOxjSc2HF6vO2CyuTDNivEdoz2IvyJJGj6X8DJ0eFyfszE0QiEd+iXmBvUP3WHxSjFH/vIsA0EN00cgr8w==", + "engines": { + "node": "*" + } + }, "node_modules/mrmime": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/mrmime/-/mrmime-1.0.1.tgz", diff --git a/package.json b/package.json index 5e373fb..38cbec9 100644 --- a/package.json +++ b/package.json @@ -21,6 +21,7 @@ "@types/crypto-js": "^4.1.1", "angular-cli-ghpages": "^1.0.6", "crypto-js": "^4.1.1", + "moment": "^2.29.4", "rxjs": "~7.8.0", "tslib": "^2.3.0", "xp.css": "^0.2.6", diff --git a/src/app/correct-answer-window/correct-answer-window.component.ts b/src/app/correct-answer-window/correct-answer-window.component.ts index 52f4691..e372f56 100644 --- a/src/app/correct-answer-window/correct-answer-window.component.ts +++ b/src/app/correct-answer-window/correct-answer-window.component.ts @@ -3,6 +3,7 @@ import {ActivatedRoute, Router} from "@angular/router"; import {PathsEnum} from "../../model/PathsEnum"; import {StorageService} from "../../service/storage.service"; import {AppStorage} from "../../model/AppStorage"; +import * as moment from "moment"; @Component({ selector: 'app-correct-answer-window', @@ -39,7 +40,7 @@ export class CorrectAnswerWindowComponent implements OnInit { { ...appStorage, currentScore: appStorage.currentScore + this.questionScore, - lastQuizResponseDate: new Date() + lastQuizResponseDate: moment().toISOString() } ) } diff --git a/src/app/main-window/main-window.component.html b/src/app/main-window/main-window.component.html index ba575a8..0dcd1a5 100644 --- a/src/app/main-window/main-window.component.html +++ b/src/app/main-window/main-window.component.html @@ -6,7 +6,7 @@
- +
diff --git a/src/app/main-window/main-window.component.ts b/src/app/main-window/main-window.component.ts index d02f298..3983359 100644 --- a/src/app/main-window/main-window.component.ts +++ b/src/app/main-window/main-window.component.ts @@ -3,6 +3,8 @@ import {StorageService} from "../../service/storage.service"; import {Router} from "@angular/router"; import {PathsEnum} from "../../model/PathsEnum"; import {AppStorage} from "../../model/AppStorage"; +import * as moment from "moment"; +import {Duration, Moment} from "moment"; @Component({ selector: 'app-main-window', @@ -12,7 +14,7 @@ import {AppStorage} from "../../model/AppStorage"; export class MainWindowComponent implements OnInit { public quizCanBeAnswered: boolean = true; - public countdown: string = ''; + public remainingTime: string = ''; protected readonly PathsEnum = PathsEnum; @@ -24,7 +26,7 @@ export class MainWindowComponent implements OnInit { public async ngOnInit(): Promise { const appStorage: AppStorage = this.storageService.get(); - const lastQuizResponseDate: Date | null = appStorage.lastQuizResponseDate; + const lastQuizResponseDate: string | null = appStorage.lastQuizResponseDate; this.quizCanBeAnswered = this.checkIfQuizCanBeAnswered(lastQuizResponseDate); @@ -36,50 +38,34 @@ export class MainWindowComponent implements OnInit { await this.router.navigateByUrl(route); } - private checkIfQuizCanBeAnswered(lastQuizResponseDate: Date | null): boolean { + private checkIfQuizCanBeAnswered(lastQuizResponseDate: string | null): boolean { if (lastQuizResponseDate === null) return true; - const now: Date = new Date(); - const lastAnsweredDate: Date = new Date(); - const threeHoursInMs: number = 1000 * 60 * 60 * 3; + const now: Moment = moment(); + const nextResponseMinimumDate: Moment = moment(lastQuizResponseDate).add(3, "hours"); - lastAnsweredDate.setTime(new Date(lastQuizResponseDate).getTime() + threeHoursInMs); - - return now.getTime() >= lastAnsweredDate.getTime(); + return now.isSame(nextResponseMinimumDate) || now.isAfter(nextResponseMinimumDate); } - private startCountdown(lastQuizResponseDate: Date | null): void { + private startCountdown(lastQuizResponseDate: string | null): void { if (lastQuizResponseDate === null) return; - const nextAnswerDate: Date = new Date(); - const threeHoursInMs: number = 1000 * 60 * 60 * 3; - - nextAnswerDate.setTime(new Date(lastQuizResponseDate).getTime() + threeHoursInMs); + const nextResponseMinimumDate: Moment = moment(lastQuizResponseDate).add(3, "hours"); - new Promise(async (resolve, reject): Promise => { + new Promise(async (resolve): Promise => { while (true) { - const now: Date = new Date(); - - const sameHour: boolean = now.getUTCHours() === nextAnswerDate.getUTCHours(); - const sameMinute: boolean = now.getUTCMinutes() === nextAnswerDate.getUTCMinutes(); - const sameSecond: boolean = now.getUTCSeconds() === nextAnswerDate.getUTCSeconds(); + const now: Moment = moment(); - if (sameHour && sameMinute && sameSecond) { + if (now.isSame(nextResponseMinimumDate) || now.isAfter(nextResponseMinimumDate)) { this.quizCanBeAnswered = true; this.clearLastAnsweredDate(); resolve(); break; } - const newTime: Date = new Date(); - - newTime.setTime(nextAnswerDate.getTime() - now.getTime()); - - const hours: number = newTime.getUTCHours(); - const minutes: number = newTime.getUTCMinutes(); - const seconds: number = newTime.getUTCSeconds(); + const timeLeft: Duration = moment.duration(nextResponseMinimumDate.valueOf() - now.valueOf()); - this.countdown = `${hours} h, ${minutes} min, ${seconds} s` + this.remainingTime = `${timeLeft.hours()} hours, ${timeLeft.minutes()} minutes, ${timeLeft.seconds()} seconds` await new Promise(f => setTimeout(f, 1000)); } diff --git a/src/app/wrong-answer-window/wrong-answer-window.component.ts b/src/app/wrong-answer-window/wrong-answer-window.component.ts index b7445d1..137b236 100644 --- a/src/app/wrong-answer-window/wrong-answer-window.component.ts +++ b/src/app/wrong-answer-window/wrong-answer-window.component.ts @@ -3,6 +3,7 @@ import {ActivatedRoute, Router} from "@angular/router"; import {PathsEnum} from "../../model/PathsEnum"; import {StorageService} from "../../service/storage.service"; import {AppStorage} from "../../model/AppStorage"; +import * as moment from "moment"; @Component({ selector: 'app-wrong-answer-window', @@ -37,7 +38,7 @@ export class WrongAnswerWindowComponent implements OnInit { this.storageService.save({ ...appStorage, currentScore: appStorage.currentScore, - lastQuizResponseDate: new Date() + lastQuizResponseDate: moment().toISOString() }); } } diff --git a/src/model/AppStorage.ts b/src/model/AppStorage.ts index 1e069c3..7ce4614 100644 --- a/src/model/AppStorage.ts +++ b/src/model/AppStorage.ts @@ -1,4 +1,4 @@ export interface AppStorage { currentScore: number, - lastQuizResponseDate: Date | null + lastQuizResponseDate: string | null }