From 701d0dc3fc79d2107bab55b29dd98324df60c18b Mon Sep 17 00:00:00 2001 From: ellenyuX Date: Wed, 25 Sep 2024 11:16:43 +0200 Subject: [PATCH] refactor and change simple design --- .../dialog-template.component.html | 15 ---- .../dialog-template.component.scss | 23 ----- src/app/admin/dialog/dialog.component.html | 11 +++ src/app/admin/dialog/dialog.component.scss | 29 +++++++ .../dialog.component.ts} | 6 +- .../info-dialog/info-dialog.component.ts | 16 ++-- .../admin/info-page/info-page.component.html | 16 ++++ .../info-page.component.scss} | 2 +- .../info-page.component.ts} | 83 ++----------------- src/app/admin/info/info.component.html | 29 ------- src/app/routes.ts | 4 +- 11 files changed, 76 insertions(+), 158 deletions(-) delete mode 100644 src/app/admin/dialog-template/dialog-template.component.html delete mode 100644 src/app/admin/dialog-template/dialog-template.component.scss create mode 100644 src/app/admin/dialog/dialog.component.html create mode 100644 src/app/admin/dialog/dialog.component.scss rename src/app/admin/{dialog-template/dialog-template.component.ts => dialog/dialog.component.ts} (74%) create mode 100644 src/app/admin/info-page/info-page.component.html rename src/app/admin/{info/info.component.scss => info-page/info-page.component.scss} (92%) rename src/app/admin/{info/info.component.ts => info-page/info-page.component.ts} (62%) delete mode 100644 src/app/admin/info/info.component.html diff --git a/src/app/admin/dialog-template/dialog-template.component.html b/src/app/admin/dialog-template/dialog-template.component.html deleted file mode 100644 index 0b050c59..00000000 --- a/src/app/admin/dialog-template/dialog-template.component.html +++ /dev/null @@ -1,15 +0,0 @@ -
-

Informasjon:

-
-
-

Navn på iterasjon: {{ data.iterationName }}

-
-
-

Tidspunktet iterasjonen ble lagd: {{ data.timeCreated }}

-
-
-

Antall (nye) bilder i treningssettet: {{ data.imageCount }}

-
-
-

(Trykk utenfor boksen for å lukke)

-
diff --git a/src/app/admin/dialog-template/dialog-template.component.scss b/src/app/admin/dialog-template/dialog-template.component.scss deleted file mode 100644 index 7bba162e..00000000 --- a/src/app/admin/dialog-template/dialog-template.component.scss +++ /dev/null @@ -1,23 +0,0 @@ -.dialog-title { - font-weight: bold; - font-size: 35px; - text-align: center; -} - -.content { - display: flex; - justify-content: center; - width: 625px; - height: 50px; - font-size: 20px; -} - -.mat-dialog-container { - border-radius: 56px; - width: 698px; - height: 246px; - - display: flex; - align-items: center; - justify-content: center; -} diff --git a/src/app/admin/dialog/dialog.component.html b/src/app/admin/dialog/dialog.component.html new file mode 100644 index 00000000..0e63ba59 --- /dev/null +++ b/src/app/admin/dialog/dialog.component.html @@ -0,0 +1,11 @@ +
+

Informasjon

+ +
+

Navn på iterasjon: {{ data.iterationName }}

+

Tidspunktet iterasjonen ble lagd: {{ data.timeCreated }}

+

Antall (nye) bilder i treningssettet: {{ data.imageCount }}

+
+ +

(Trykk utenfor boksen for å lukke)

+
diff --git a/src/app/admin/dialog/dialog.component.scss b/src/app/admin/dialog/dialog.component.scss new file mode 100644 index 00000000..80010334 --- /dev/null +++ b/src/app/admin/dialog/dialog.component.scss @@ -0,0 +1,29 @@ +.dialog-content { + text-align: center; + padding: 20px; + max-width: 400px; + margin: auto; +} + +.dialog-title { + font-size: 24px; + font-weight: bold; + margin-bottom: 20px; +} + +.dialog-body p { + font-size: 16px; + margin: 10px 0; + font-weight: 500; +} + +.dialog-body b { + font-weight: 900; +} + +.dialog-footer { + font-size: 14px; + color: grey; + margin-top: 20px; + font-style: italic; +} diff --git a/src/app/admin/dialog-template/dialog-template.component.ts b/src/app/admin/dialog/dialog.component.ts similarity index 74% rename from src/app/admin/dialog-template/dialog-template.component.ts rename to src/app/admin/dialog/dialog.component.ts index ba36c64c..f124f130 100644 --- a/src/app/admin/dialog-template/dialog-template.component.ts +++ b/src/app/admin/dialog/dialog.component.ts @@ -5,11 +5,11 @@ import { DialogData } from '@/app/shared/models/interfaces'; @Component({ selector: 'app-dialog-template', - templateUrl: './dialog-template.component.html', - styleUrls: ['./dialog-template.component.scss'], + templateUrl: './dialog.component.html', + styleUrls: ['./dialog.component.scss'], standalone: true, imports: [CdkScrollable, MatDialogContent, MatDialogTitle], }) -export class DialogTemplateComponent { +export class DialogComponent { constructor(@Inject(MAT_DIALOG_DATA) public data: DialogData) {} } diff --git a/src/app/admin/info-dialog/info-dialog.component.ts b/src/app/admin/info-dialog/info-dialog.component.ts index fd320b67..fb67ffc2 100644 --- a/src/app/admin/info-dialog/info-dialog.component.ts +++ b/src/app/admin/info-dialog/info-dialog.component.ts @@ -1,6 +1,6 @@ import { Component } from '@angular/core'; import { MatDialog } from '@angular/material/dialog'; -import { DialogTemplateComponent } from './../dialog-template/dialog-template.component'; +import { DialogComponent } from '../dialog/dialog.component'; import { ErrorLogDialogComponent } from '../error-dialog/error-dialog.component'; import { LogData } from '@/app/shared/models/backend-interfaces'; @@ -14,7 +14,7 @@ export class InfoDialogComponent { constructor(public dialog: MatDialog) {} openDialog(iterName: string, time: string, imgCount: string) { - this.dialog.open(DialogTemplateComponent, { + this.dialog.open(DialogComponent, { data: { iterationName: iterName, timeCreated: time, @@ -23,10 +23,12 @@ export class InfoDialogComponent { }); } - openErrorLog(logDataArray: LogData[]) { +openErrorLog(logDataArray: LogData[]) { - this.dialog.open(ErrorLogDialogComponent, { - data: logDataArray, - }); - } + this.dialog.open(ErrorLogDialogComponent, { + data: logDataArray, + }); } + +} + diff --git a/src/app/admin/info-page/info-page.component.html b/src/app/admin/info-page/info-page.component.html new file mode 100644 index 00000000..c293ba8d --- /dev/null +++ b/src/app/admin/info-page/info-page.component.html @@ -0,0 +1,16 @@ +

Administrative handlinger

+
+
+ +

+ +

+ +

+ +
+
+ +
+ +
diff --git a/src/app/admin/info/info.component.scss b/src/app/admin/info-page/info-page.component.scss similarity index 92% rename from src/app/admin/info/info.component.scss rename to src/app/admin/info-page/info-page.component.scss index 053fd3f9..c928b4db 100644 --- a/src/app/admin/info/info.component.scss +++ b/src/app/admin/info-page/info-page.component.scss @@ -39,7 +39,7 @@ p { } .btn-group button:first-child { - background-color: #c78bde; + background-color: #734f81; margin-top: 2vh; border: 1px solid #96a7b1; } diff --git a/src/app/admin/info/info.component.ts b/src/app/admin/info-page/info-page.component.ts similarity index 62% rename from src/app/admin/info/info.component.ts rename to src/app/admin/info-page/info-page.component.ts index 6fcb496c..4ddbdca8 100644 --- a/src/app/admin/info/info.component.ts +++ b/src/app/admin/info-page/info-page.component.ts @@ -2,7 +2,7 @@ import { Component } from '@angular/core'; import { Router } from '@angular/router'; import { LoginService } from '../login.service'; import { MatSnackBar } from '@angular/material/snack-bar'; -import { InfoDialogComponent } from './../info-dialog/info-dialog.component'; +import { InfoDialogComponent } from '../info-dialog/info-dialog.component'; import { PairingService } from '../../game/services/pairing.service'; import { MatButton } from '@angular/material/button'; import { LogData, StatusData } from '@/app/shared/models/backend-interfaces'; @@ -10,12 +10,12 @@ import { LoggingService } from '../../game/services/logging.service'; @Component({ selector: 'app-info', - templateUrl: './info.component.html', - styleUrls: ['./info.component.scss'], + templateUrl: './info-page.component.html', + styleUrls: ['./info-page.component.scss'], standalone: true, imports: [MatButton], }) -export class InfoComponent { +export class InfoPageComponent { datasetString = 'Nullstill treningssett til originalen'; datasetBool = false; retrainString = 'Tren maskinlæringsmodellen'; @@ -34,49 +34,7 @@ export class InfoComponent { private pairing: PairingService, private loggingService: LoggingService ) {} - - revertDataset() { - let msg = ''; - if (this.datasetBool) { - this.resetDatasetValues(); - this.loginService.revertDataset().subscribe( - () => { - this.openSnackBar('Suksess! Treningssett tilbakestilles (dette kan ta noen minutter)'); - }, - () => { - msg = this.errorMsg; - this.openSnackBar(msg); - } - ); - this.resetDatasetValues(); - } else { - this.resetHighScoreValues(); - this.resetRetrainValues(); - this.setDatasetValues(); - } - } - - retrain() { - let msg = ''; - if (this.retrainBool) { - this.resetDatasetValues(); - this.loginService.retrain().subscribe( - () => { - this.openSnackBar('Suksess! Modellen blir trent (dette kan ta noen minutter)'); - }, - () => { - msg = this.errorMsg; - this.openSnackBar(msg); - } - ); - this.resetRetrainValues(); - } else { - this.resetDatasetValues(); - this.resetHighScoreValues(); - this.setRetrainValues(); - } - } - + clearHighScore() { let msg = ''; if (this.highScoreBool) { @@ -93,7 +51,6 @@ export class InfoComponent { this.resetHighScoreValues(); } else { this.resetDatasetValues(); - this.resetRetrainValues(); this.setHighScoreValues(); } } @@ -103,37 +60,16 @@ export class InfoComponent { this.highScoreBool = false; } - resetRetrainValues() { - this.retrainString = 'Tren maskinlæringsmodellen'; - this.retrainBool = false; - } - resetDatasetValues() { this.datasetString = 'Nullstill treningssett til originalen'; this.datasetBool = false; } - resetAll() { - this.resetHighScoreValues(); - this.resetRetrainValues(); - this.resetDatasetValues(); - } - setHighScoreValues() { this.highScoreString = this.secondMsg; this.highScoreBool = true; } - setRetrainValues() { - this.retrainString = this.secondMsg; - this.retrainBool = true; - } - - setDatasetValues() { - this.datasetString = this.secondMsg; - this.datasetBool = true; - } - signOut() { this.loginService.signOut().subscribe( () => { @@ -148,7 +84,6 @@ export class InfoComponent { } getInformation() { - this.resetAll(); this.loginService.getStatus().subscribe( (res: StatusData) => { const name = res.CV_iteration_name; @@ -192,12 +127,4 @@ export class InfoComponent { duration: 6000, }); } - - pair(id: string) { - this.pairing.setPairID(id); - } - - getPairID() { - return this.pairing.getPairID(); - } } diff --git a/src/app/admin/info/info.component.html b/src/app/admin/info/info.component.html deleted file mode 100644 index 9efd216f..00000000 --- a/src/app/admin/info/info.component.html +++ /dev/null @@ -1,29 +0,0 @@ -

Administrative handlinger

-

Advarsel!

-

Før du utfører en administrativ handling, vær helt sikker på at du vil gjøre den.

-

Hvis en handling først gjennomføres, vil du IKKE være i stand til å gjøre om på den.

-
- -

- -

- -

- -
-
-
-
- - -

- -

-
-
-

-
- -
diff --git a/src/app/routes.ts b/src/app/routes.ts index eb8285d2..c61030da 100644 --- a/src/app/routes.ts +++ b/src/app/routes.ts @@ -6,7 +6,7 @@ import { routes as r } from './shared/models/routes'; import { GameResultComponent } from './game/game-result/game-result.component'; import { GameDrawComponent } from './game/game-draw/game-draw.component'; import { AdminComponent } from './admin/admin.component'; -import { InfoComponent } from './admin/info/info.component'; +import { InfoPageComponent } from './admin/info-page/info-page.component'; import { authGuard } from './admin/auth-guard'; import { MultiplayerComponent } from './game/game-multiplayer/multiplayer.component'; @@ -48,7 +48,7 @@ export const routes: Routes = [ }, { path: 'admin/info', - component: InfoComponent, + component: InfoPageComponent, canActivate: [authGuard], }, ];