diff --git a/angular.json b/angular.json index fbcae5a..9afefbb 100644 --- a/angular.json +++ b/angular.json @@ -23,6 +23,9 @@ "polyfills": [ "zone.js" ], + "allowedCommonJsDependencies": [ + "crypto-js" + ], "tsConfig": "tsconfig.app.json", "inlineStyleLanguage": "sass", "assets": [ diff --git a/package-lock.json b/package-lock.json index b1ba46a..5378f9a 100644 --- a/package-lock.json +++ b/package-lock.json @@ -16,7 +16,9 @@ "@angular/platform-browser": "^16.1.0", "@angular/platform-browser-dynamic": "^16.1.0", "@angular/router": "^16.1.0", + "@types/crypto-js": "^4.1.1", "angular-cli-ghpages": "^1.0.6", + "crypto-js": "^4.1.1", "rxjs": "~7.8.0", "tslib": "^2.3.0", "xp.css": "^0.2.6", @@ -3242,6 +3244,11 @@ "@types/node": "*" } }, + "node_modules/@types/crypto-js": { + "version": "4.1.1", + "resolved": "https://registry.npmjs.org/@types/crypto-js/-/crypto-js-4.1.1.tgz", + "integrity": "sha512-BG7fQKZ689HIoc5h+6D2Dgq1fABRa0RbBWKBd9SP/MVRVXROflpm5fhwyATX5duFmbStzyzyycPB8qUYKDH3NA==" + }, "node_modules/@types/eslint": { "version": "8.44.1", "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-8.44.1.tgz", @@ -3326,9 +3333,9 @@ "dev": true }, "node_modules/@types/node": { - "version": "20.4.6", - "resolved": "https://registry.npmjs.org/@types/node/-/node-20.4.6.tgz", - "integrity": "sha512-q0RkvNgMweWWIvSMDiXhflGUKMdIxBo2M2tYM/0kEGDueQByFzK4KZAgu5YHGFNxziTlppNpTIBcqHQAxlfHdA==", + "version": "20.4.8", + "resolved": "https://registry.npmjs.org/@types/node/-/node-20.4.8.tgz", + "integrity": "sha512-0mHckf6D2DiIAzh8fM8f3HQCvMKDpK94YQ0DSVkfWTG9BZleYIWudw9cJxX8oCk9bM+vAkDyujDV6dmKHbvQpg==", "dev": true }, "node_modules/@types/qs": { @@ -4892,6 +4899,11 @@ "node": ">= 8" } }, + "node_modules/crypto-js": { + "version": "4.1.1", + "resolved": "https://registry.npmjs.org/crypto-js/-/crypto-js-4.1.1.tgz", + "integrity": "sha512-o2JlM7ydqd3Qk9CA0L4NL6mTzU2sdx96a+oOfPu8Mkl/PK51vSyoi8/rQ8NknZtk44vq15lmhAj9CIAGwgeWKw==" + }, "node_modules/css-loader": { "version": "6.8.1", "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-6.8.1.tgz", diff --git a/package.json b/package.json index c8cc89d..5e373fb 100644 --- a/package.json +++ b/package.json @@ -18,7 +18,9 @@ "@angular/platform-browser": "^16.1.0", "@angular/platform-browser-dynamic": "^16.1.0", "@angular/router": "^16.1.0", + "@types/crypto-js": "^4.1.1", "angular-cli-ghpages": "^1.0.6", + "crypto-js": "^4.1.1", "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 5dea2b6..6bf2bd6 100644 --- a/src/app/correct-answer-window/correct-answer-window.component.ts +++ b/src/app/correct-answer-window/correct-answer-window.component.ts @@ -32,7 +32,7 @@ export class CorrectAnswerWindowComponent implements OnInit { private saveCurrentScore(): void { const currentScore: string | null = this.storageService.get(StorageKeyEnum.CURRENT_SCORE); - let currentScoreNumber: number = currentScore === null ? 0 : parseInt(currentScore); + let currentScoreNumber: number = (currentScore === null || currentScore === '') ? 0 : parseInt(currentScore); currentScoreNumber += this.questionScore; diff --git a/src/app/main-window/main-window.component.ts b/src/app/main-window/main-window.component.ts index 350d63d..b0aff4f 100644 --- a/src/app/main-window/main-window.component.ts +++ b/src/app/main-window/main-window.component.ts @@ -61,7 +61,7 @@ export class MainWindowComponent implements OnInit { if (sameHour && sameMinute && sameSecond) { this.quizCanBeAnswered = true; - this.storageService.save(StorageKeyEnum.LAST_QUIZ_RESPONSE_DATE, ''); + this.storageService.clear(StorageKeyEnum.LAST_QUIZ_RESPONSE_DATE); resolve(); break; } diff --git a/src/app/score-window/score-window.component.ts b/src/app/score-window/score-window.component.ts index 4dd3ffd..e7dbc7e 100644 --- a/src/app/score-window/score-window.component.ts +++ b/src/app/score-window/score-window.component.ts @@ -21,7 +21,7 @@ export class ScoreWindowComponent implements OnInit { public ngOnInit(): void { const currentScore: string | null = this.storageService.get(StorageKeyEnum.CURRENT_SCORE); - this.score = currentScore === null ? 0 : parseInt(currentScore); + this.score = (currentScore === null || currentScore === '') ? 0 : parseInt(currentScore); } public async returnHome(): Promise { diff --git a/src/service/storage.service.ts b/src/service/storage.service.ts index 31a9d6d..5d17ea1 100644 --- a/src/service/storage.service.ts +++ b/src/service/storage.service.ts @@ -1,5 +1,6 @@ import {Injectable} from '@angular/core'; import {StorageKeyEnum} from "../model/StorageKeyEnum"; +import { AES, enc } from 'crypto-js'; @Injectable({ providedIn: 'root' @@ -7,16 +8,33 @@ import {StorageKeyEnum} from "../model/StorageKeyEnum"; export class StorageService { private readonly localStorage: Storage; + private readonly KEY: string = 'ENCRYPTION_KEY'; constructor() { this.localStorage = window.localStorage; } public save(key: StorageKeyEnum, value: string): void { - this.localStorage.setItem(key, value); + this.localStorage.setItem(key, this.encrypt(value)); } public get(key: StorageKeyEnum): string | null { - return this.localStorage.getItem(key); + const encryptedItem: string | null = this.localStorage.getItem(key); + + return encryptedItem === null ? '' : this.decrypt(encryptedItem); + } + + public clear(key: StorageKeyEnum) { + this.localStorage.removeItem(key); + } + + private encrypt(value: string): string { + const encrypted = AES.encrypt(value, this.KEY); + return encrypted.toString(); + } + + private decrypt(value: string): string { + const decrypted = AES.decrypt(value, this.KEY); + return decrypted.toString(enc.Utf8); } }