From e11611bbe635d1027bde3eadca298928aed89a1c Mon Sep 17 00:00:00 2001 From: grimsi <9295182+grimsi@users.noreply.github.com> Date: Fri, 22 Jul 2022 15:16:19 +0200 Subject: [PATCH] WIP: Implement frontend --- .../gameyfin/rest/LibraryController.java | 2 +- .../src/main/resources/application-dev.yml | 4 +-- frontend/src/app/api/LibraryApi.ts | 10 ++++++ frontend/src/app/app.module.ts | 6 +++- .../game-cover/game-cover.component.scss | 2 +- .../components/header/header.component.html | 6 ++++ .../app/components/header/header.component.ts | 31 ++++++------------- .../library-overview.component.css | 13 ++++++++ .../library-overview.component.html | 16 ++++++---- .../services/gameserver-api.service.spec.ts | 16 ---------- frontend/src/app/services/library.service.ts | 30 ++++++++++++++++++ 11 files changed, 88 insertions(+), 48 deletions(-) create mode 100644 frontend/src/app/api/LibraryApi.ts delete mode 100644 frontend/src/app/services/gameserver-api.service.spec.ts create mode 100644 frontend/src/app/services/library.service.ts diff --git a/backend/src/main/java/de/grimsi/gameyfin/rest/LibraryController.java b/backend/src/main/java/de/grimsi/gameyfin/rest/LibraryController.java index 16ab95c..5a83cfa 100644 --- a/backend/src/main/java/de/grimsi/gameyfin/rest/LibraryController.java +++ b/backend/src/main/java/de/grimsi/gameyfin/rest/LibraryController.java @@ -28,7 +28,7 @@ public class LibraryController { if(downloadImages) downloadImages(); } - @GetMapping(value = "/download_images") + @GetMapping(value = "/download-images") public void downloadImages() { filesystemService.downloadGameCovers(); filesystemService.downloadGameScreenshots(); diff --git a/backend/src/main/resources/application-dev.yml b/backend/src/main/resources/application-dev.yml index 9b38089..f70af08 100644 --- a/backend/src/main/resources/application-dev.yml +++ b/backend/src/main/resources/application-dev.yml @@ -1,6 +1,6 @@ gameyfin: - root: C:\Projects\privat\gameyfin-library - #root: \\NAS-Simon\Öffentlich\Spiele + #root: C:\Projects\privat\gameyfin-library + root: \\NAS-Simon\Öffentlich\Spiele cache: ${gameyfin.root}\.gameyfin\cache db: ${gameyfin.root}\.gameyfin\db # Currently unused igdb: diff --git a/frontend/src/app/api/LibraryApi.ts b/frontend/src/app/api/LibraryApi.ts new file mode 100644 index 0000000..d31a42b --- /dev/null +++ b/frontend/src/app/api/LibraryApi.ts @@ -0,0 +1,10 @@ +import {Observable} from "rxjs"; +import {DetectedGameDto} from "../models/dtos/DetectedGameDto"; +import {GameOverviewDto} from "../models/dtos/GameOverviewDto"; +import {HttpResponse} from "@angular/common/http"; + +export interface LibraryApi { + scanLibrary(): Observable>; + downloadImages(): Observable>; + getFiles(): Observable; +} diff --git a/frontend/src/app/app.module.ts b/frontend/src/app/app.module.ts index 30e7cfd..4e68689 100644 --- a/frontend/src/app/app.module.ts +++ b/frontend/src/app/app.module.ts @@ -31,6 +31,8 @@ import {MatPaginatorModule} from "@angular/material/paginator"; import {MatSortModule} from "@angular/material/sort"; import { GameCoverComponent } from './components/game-cover/game-cover.component'; import { GameDetailViewComponent } from './components/game-detail-view/game-detail-view.component'; +import {MatSnackBarModule} from '@angular/material/snack-bar'; +import {MatGridListModule} from "@angular/material/grid-list"; @NgModule({ declarations: [ @@ -66,7 +68,9 @@ import { GameDetailViewComponent } from './components/game-detail-view/game-deta MatProgressSpinnerModule, MatTableModule, MatPaginatorModule, - MatSortModule + MatSortModule, + MatSnackBarModule, + MatGridListModule ], providers: [ { diff --git a/frontend/src/app/components/game-cover/game-cover.component.scss b/frontend/src/app/components/game-cover/game-cover.component.scss index d86b38e..05f113f 100644 --- a/frontend/src/app/components/game-cover/game-cover.component.scss +++ b/frontend/src/app/components/game-cover/game-cover.component.scss @@ -6,6 +6,6 @@ @include mat.elevation(4); &:hover { - @include mat.elevation(12); + @include mat.elevation(24); } } diff --git a/frontend/src/app/components/header/header.component.html b/frontend/src/app/components/header/header.component.html index 67bc2be..baa5975 100644 --- a/frontend/src/app/components/header/header.component.html +++ b/frontend/src/app/components/header/header.component.html @@ -1,2 +1,8 @@ + + + + diff --git a/frontend/src/app/components/header/header.component.ts b/frontend/src/app/components/header/header.component.ts index 0fb2387..b5a214f 100644 --- a/frontend/src/app/components/header/header.component.ts +++ b/frontend/src/app/components/header/header.component.ts @@ -1,9 +1,8 @@ import {Component, OnInit} from '@angular/core'; import {NavMenuItem} from '../../models/objects/NavMenuItem'; -import {Title} from '@angular/platform-browser'; -import {Config} from '../../config/Config'; -import {Icon} from '../../models/enums/Icon'; -import {DropDownMenuItem} from "../../models/objects/DropDownMenuItem"; +import {LibraryService} from "../../services/library.service"; +import {MatSnackBar} from '@angular/material/snack-bar'; +import {timeInterval} from "rxjs"; @Component({ selector: 'app-header', @@ -12,29 +11,19 @@ import {DropDownMenuItem} from "../../models/objects/DropDownMenuItem"; }) export class HeaderComponent implements OnInit { - tabNavItems: NavMenuItem[] = [ - new NavMenuItem('Servers', Icon.dns, '/servers', true), - new NavMenuItem('Games', Icon.controller, '/games', true), - new NavMenuItem('Info', Icon.info, '/info', true), - new NavMenuItem('Config', Icon.settings, '/config', true), - ]; - - dropDownItems: DropDownMenuItem[] = [ - new DropDownMenuItem('Log out', Icon.lock_open, () => { - alert("Logout not implemented"); - }, true) - ]; - activeItem: NavMenuItem | undefined; - constructor(private titleService: Title) { + constructor(private libraryService: LibraryService, + private snackBar: MatSnackBar) { } ngOnInit() { } - setActiveItem(item: NavMenuItem) { - this.activeItem = item; - this.titleService.setTitle(`${Config.baseTitle} - ${item.title}`); + reloadLibrary() { + this.libraryService.scanLibrary().pipe(timeInterval()).subscribe({ + next: value => this.snackBar.open(`Library scan completed in ${Math.trunc(value.interval/1000)} seconds.`), + error: error => this.snackBar.open(`Error while scanning library: ${error}`) + }) } } diff --git a/frontend/src/app/components/library-overview/library-overview.component.css b/frontend/src/app/components/library-overview/library-overview.component.css index 775932b..128a8c2 100644 --- a/frontend/src/app/components/library-overview/library-overview.component.css +++ b/frontend/src/app/components/library-overview/library-overview.component.css @@ -10,3 +10,16 @@ align-items: center; justify-content: center; } + +.content { + padding: 16px; +} + +.content > mat-card { + margin-bottom: 16px; +} + +.column-label { + margin-right: 8px; + font-size: 1rem; +} 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 f2cbd26..e9a235b 100644 --- a/frontend/src/app/components/library-overview/library-overview.component.html +++ b/frontend/src/app/components/library-overview/library-overview.component.html @@ -3,12 +3,16 @@

Loading library...

-
-
-

Your game library is empty!

-
-
- + +
+

Your game library is empty!

+
+ +
+
+
+ +
diff --git a/frontend/src/app/services/gameserver-api.service.spec.ts b/frontend/src/app/services/gameserver-api.service.spec.ts deleted file mode 100644 index 9217e1c..0000000 --- a/frontend/src/app/services/gameserver-api.service.spec.ts +++ /dev/null @@ -1,16 +0,0 @@ -import { TestBed } from '@angular/core/testing'; - -import { GamesService } from './games.service'; - -describe('GameserverApiService', () => { - let service: GamesService; - - beforeEach(() => { - TestBed.configureTestingModule({}); - service = TestBed.inject(GamesService); - }); - - it('should be created', () => { - expect(service).toBeTruthy(); - }); -}); diff --git a/frontend/src/app/services/library.service.ts b/frontend/src/app/services/library.service.ts new file mode 100644 index 0000000..4e70956 --- /dev/null +++ b/frontend/src/app/services/library.service.ts @@ -0,0 +1,30 @@ +import {Injectable} from '@angular/core'; +import {GamesApi} from "../api/GamesApi"; +import {HttpClient, HttpResponse} from "@angular/common/http"; +import {Observable} from "rxjs"; +import {DetectedGameDto} from "../models/dtos/DetectedGameDto"; +import {GameOverviewDto} from "../models/dtos/GameOverviewDto"; +import {LibraryApi} from "../api/LibraryApi"; + +@Injectable({ + providedIn: 'root' +}) +export class LibraryService implements LibraryApi { + + private readonly apiPath = '/library'; + + constructor(private http: HttpClient) { + } + + scanLibrary(): Observable> { + return this.http.get>(`${this.apiPath}/scan`); + } + + downloadImages(): Observable> { + return this.http.get>(`${this.apiPath}/download-images`); + } + + getFiles(): Observable { + return this.http.get(`${this.apiPath}/files`); + } +}