+
diff --git a/frontend/src/app/components/game-detail-view/game-detail-view.component.ts b/frontend/src/app/components/game-detail-view/game-detail-view.component.ts
index c7a92c8..444f1b0 100644
--- a/frontend/src/app/components/game-detail-view/game-detail-view.component.ts
+++ b/frontend/src/app/components/game-detail-view/game-detail-view.component.ts
@@ -1,35 +1,47 @@
-import {Component, OnInit} from '@angular/core';
+import {Component, HostListener} from '@angular/core';
import {ActivatedRoute, Params, Router} from "@angular/router";
import {DetectedGameDto} from "../../models/dtos/DetectedGameDto";
import {GamesService} from "../../services/games.service";
+import {CompanyDto} from "../../models/dtos/CompanyDto";
@Component({
selector: 'app-game-detail-view',
templateUrl: './game-detail-view.component.html',
styleUrls: ['./game-detail-view.component.scss']
})
-export class GameDetailViewComponent implements OnInit {
+export class GameDetailViewComponent {
game!: DetectedGameDto;
+ companiesWithLogo: CompanyDto[]= [];
+
+ gridColumnCount: number;
+
constructor(private route: ActivatedRoute,
private router: Router,
private gamesService: GamesService) {
- this.route.params.subscribe( params => {
- this.gamesService.getGame(params['slug']).subscribe({
- next: game => this.game = game,
- error: error => {
- if(error.status === 404) {
- this.router.navigate(['/library']);
- } else {
- console.error(error);
- }
- }
- });
+ this.gamesService.getGame(this.route.snapshot.params['slug']).subscribe({
+ next: game => {
+ this.game = game;
+ if(game.companies !== undefined) {
+ this.companiesWithLogo = game.companies.filter(c => c.logoId !== undefined && c.logoId.length > 0);
+ }
+ },
+ error: error => {
+ if (error.status === 404) {
+ this.router.navigate(['/library']);
+ } else {
+ console.error(error);
+ }
+ }
});
+
+ this.gridColumnCount = this.calculateColumnCount();
}
- ngOnInit(): void {
+ @HostListener('window:resize', ['$event'])
+ onResize() {
+ this.gridColumnCount = this.calculateColumnCount();
}
public downloadGame(): void {
@@ -46,7 +58,7 @@ export class GameDetailViewComponent implements OnInit {
const units = ['kB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
const dp = 1;
let u = -1;
- const r = 10**dp;
+ const r = 10 ** dp;
do {
bytes /= thresh;
@@ -62,4 +74,22 @@ export class GameDetailViewComponent implements OnInit {
this.router.navigate(['/library'], {queryParams: params});
}
+ mapRatingToColor(rating: number): string {
+ if (rating >= 75) return '#388e3c';
+ if (rating >= 50) return '#fbc02d';
+ if (rating >= 25) return '#f57c00';
+ return '#d32f2f';
+ }
+
+ private calculateColumnCount(): number {
+ const elementWidth: number = 555;
+ const containerWidth: number | undefined = document.getElementById('game-media')?.offsetWidth;
+ const defaultColumnCount = 3;
+
+ if (containerWidth === undefined) return defaultColumnCount
+ if (containerWidth < elementWidth) return 1;
+
+ return Math.floor(containerWidth / elementWidth);
+ }
+
}
diff --git a/frontend/src/app/components/header/header.component.ts b/frontend/src/app/components/header/header.component.ts
index 71b017a..eb3e802 100644
--- a/frontend/src/app/components/header/header.component.ts
+++ b/frontend/src/app/components/header/header.component.ts
@@ -1,7 +1,6 @@
import {Component} from '@angular/core';
import {LibraryService} from "../../services/library.service";
import {MatSnackBar} from '@angular/material/snack-bar';
-import {timeInterval} from "rxjs";
import {Router} from "@angular/router";
import {GamesService} from "../../services/games.service";
import {ThemingService} from "../../services/theming.service";
@@ -26,11 +25,27 @@ export class HeaderComponent {
}
scanLibrary(): void {
- this.libraryService.scanLibrary().pipe(timeInterval()).subscribe({
- next: value => {
+ this.libraryService.scanLibrary().subscribe({
+ next: result => {
// Refresh the current page "angular style"
- this.router.navigate([this.router.url]).then(() =>
- this.snackBar.open(`Library scan completed in ${Math.trunc(value.interval / 1000)} seconds.`, undefined, {duration: 5000})
+ this.router.navigate([this.router.url]).then(() => {
+ const snackBarDuration: number = 10000;
+
+ let snackbarContent: string = 'Library scan completed in ' + result.scanDuration + ' seconds:\n' +
+ '- ' + result.newGames + ' new games\n' +
+ '- ' + result.deletedGames + ' games removed\n' +
+ '- ' + result.newUnmappableFiles + ' files/folders could not be mapped\n' +
+ '- ' + result.totalGames + ' games currently in your library';
+
+ if (result.companyLogoDownloads !== undefined && result.coverDownloads !== undefined && result.screenshotDownloads !== undefined) {
+ snackbarContent = snackbarContent.concat('\n' +
+ '- ' + result.coverDownloads + ' covers downloaded\n' +
+ '- ' + result.screenshotDownloads + ' screenshots downloaded\n' +
+ '- ' + result.companyLogoDownloads + ' company logos downloaded');
+ }
+
+ this.snackBar.open(snackbarContent, undefined, {duration: snackBarDuration});
+ }
)
},
error: error => this.snackBar.open(`Error while scanning library: ${error.error.message}`, undefined, {duration: 5000})
diff --git a/frontend/src/app/components/library-overview/library-overview.component.html b/frontend/src/app/components/library-overview/library-overview.component.html
index 7501b07..e4bbf04 100644
--- a/frontend/src/app/components/library-overview/library-overview.component.html
+++ b/frontend/src/app/components/library-overview/library-overview.component.html
@@ -11,14 +11,16 @@