WebP Support (#581)

* Added trackby so when series scan event comes through, cards can update too

* Added chapter boundary toasts on book reader

* Handle closing the reader when in a reading list

* Somehow the trackby save didn't happen

* Fixed an issue where after opening a chapter info modal, then trying to open another in specials tab it would fail due to a pass by reference issue with our factory.

* When a series update occurs, if we loose specials tab, but we were on it, reselect volumes/chapters tab

* Fixed an issue where older releases would show as available, even though they were already installed.

* Converted tabs within modals to use vertical orientation (except on mobile)

* Implemented webp support. Only Safari does not support this format natively. MacOS users can use an alternative browser.

* Refactored ScannerService and MetadataService to be fully async
This commit is contained in:
Joseph Milazzo 2021-09-15 17:25:18 -07:00 committed by GitHub
parent d92cfb0b2b
commit 2725e6042b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
17 changed files with 102 additions and 65 deletions

View file

@ -102,8 +102,8 @@
<a ngbNavLink>Specials</a>
<ng-template ngbNavContent>
<div class="row">
<div *ngFor="let chapter of specials">
<app-card-item class="col-auto" *ngIf="chapter.isSpecial" [entity]="chapter" [title]="chapter.title || chapter.range" (click)="openChapter(chapter)"
<div *ngFor="let chapter of specials; trackBy: trackByChapterIdentity">
<app-card-item class="col-auto" *ngIf="chapter.isSpecial" [entity]="chapter" [title]="chapter.title || chapter.range" (click)="openChapter(chapter)"
[imageUrl]="imageService.getChapterCoverImage(chapter.id)"
[read]="chapter.pagesRead" [total]="chapter.pages" [actions]="chapterActions"></app-card-item>
</div>
@ -114,12 +114,12 @@
<a ngbNavLink>Volumes/Chapters</a>
<ng-template ngbNavContent>
<div class="row">
<div *ngFor="let volume of volumes">
<div *ngFor="let volume of volumes; trackBy: trackByVolumeIdentity">
<app-card-item class="col-auto" *ngIf="volume.number != 0" [entity]="volume" [title]="'Volume ' + volume.name" (click)="openVolume(volume)"
[imageUrl]="imageService.getVolumeCoverImage(volume.id) + '&offset=' + coverImageOffset"
[read]="volume.pagesRead" [total]="volume.pages" [actions]="volumeActions"></app-card-item>
</div>
<div *ngFor="let chapter of chapters">
<div *ngFor="let chapter of chapters; trackBy: trackByChapterIdentity">
<app-card-item class="col-auto" *ngIf="!chapter.isSpecial" [entity]="chapter" [title]="'Chapter ' + chapter.range" (click)="openChapter(chapter)"
[imageUrl]="imageService.getChapterCoverImage(chapter.id) + '&offset=' + coverImageOffset"
[read]="chapter.pagesRead" [total]="chapter.pages" [actions]="chapterActions"></app-card-item>

View file

@ -79,6 +79,15 @@ export class SeriesDetailComponent implements OnInit, OnDestroy {
*/
actionInProgress: boolean = false;
/**
* Track by function for Volume to tell when to refresh card data
*/
trackByVolumeIdentity = (index: number, item: Volume) => `${item.name}_${item.pagesRead}`;
/**
* Track by function for Chapter to tell when to refresh card data
*/
trackByChapterIdentity = (index: number, item: Chapter) => `${item.title}_${item.number}_${item.pagesRead}`;
private onDestroy: Subject<void> = new Subject();
@ -296,6 +305,11 @@ export class SeriesDetailComponent implements OnInit, OnDestroy {
this.hasNonSpecialVolumeChapters = false;
}
// If an update occured and we were on specials, re-activate Volumes/Chapters
if (!this.hasSpecials && this.activeTabId != 2) {
this.activeTabId = 2;
}
this.isLoading = false;
});
}, err => {