Feature/misc (#1234)

* Fixed a bug where publication status could show as filled in when total number is 0 but there is a max count.

Add ComicInfo support for LocalizedSeries which will populate a Series LocalizedName.

Fixed an issue in tag constraint issues.

* Hooked in LocalizedSeries tag into merge step in scanner.

* Hooked in LocalizedSeries from ComicInfo into Kavita and also use it to help during merge phase to avoid 2 different series, if one file is using the name of the localized series.

* Reduced some extra string creation and updated epub library to ignore bad ToCs.

* Bumped dependencies to latest. When an epub doesn't have a dc:date with publication event type, default back to just a normal dc:date tag.

* Fixed a bug where webtoon reader would error out on first load due to how we passed the function to the reader

* Reverted the centering code

UI/Web/src/app/cards/card-detail-layout/card-detail-layout.component.html

@@ -17,17 +17,20 @@
 
 <ng-container [ngTemplateOutlet]="paginationTemplate" [ngTemplateOutletContext]="{ id: 'top' }"></ng-container>
 
-<ng-container *ngIf="pagination.totalItems > 6 || isMobile; else cardTemplate">
+<!-- <ng-container *ngIf="utilityService.getActiveBreakpoint() <= Breakpoint.Mobile; else cardTemplate">
     <div class="d-flex justify-content-center row g-0 mt-2 mb-2">
         <div class="col-auto ps-1 pe-1 mt-2 mb-2" *ngFor="let item of items; trackBy:trackByIdentity; index as i">
             <ng-container [ngTemplateOutlet]="itemTemplate" [ngTemplateOutletContext]="{ $implicit: item, idx: i }"></ng-container>
         </div>
+        
 
         <p *ngIf="items.length === 0 && !isLoading">
             <ng-container [ngTemplateOutlet]="noDataTemplate"></ng-container>
         </p>
     </div>
-</ng-container>
+</ng-container> -->
+
+<ng-container [ngTemplateOutlet]="cardTemplate"></ng-container>
 
 <ng-container [ngTemplateOutlet]="paginationTemplate" [ngTemplateOutletContext]="{ id: 'bottom' }"></ng-container>
 
@@ -38,7 +41,7 @@
     </div>
 
     <p *ngIf="items.length === 0 && !isLoading">
-        There is no data
+        <ng-container [ngTemplateOutlet]="noDataTemplate"></ng-container>
     </p>
 </div>
 </ng-template>

UI/Web/src/app/cards/card-detail-layout/card-detail-layout.component.ts

@@ -1,6 +1,7 @@
 import { Component, ContentChild, EventEmitter, Input, OnDestroy, OnInit, Output, TemplateRef } from '@angular/core';
 import { Subject } from 'rxjs';
 import { FilterSettings } from 'src/app/metadata-filter/filter-settings';
+import { Breakpoint, UtilityService } from 'src/app/shared/_services/utility.service';
 import { Library } from 'src/app/_models/library';
 import { Pagination } from 'src/app/_models/pagination';
 import { FilterEvent, FilterItem, SeriesFilter, SortField } from 'src/app/_models/series-filter';
@@ -9,9 +10,6 @@ import { SeriesService } from 'src/app/_services/series.service';
 
 const FILTER_PAG_REGEX = /[^0-9]/g;
 
-const ANIMATION_SPEED = 300;
-
-
 @Component({
   selector: 'app-card-detail-layout',
   templateUrl: './card-detail-layout.component.html',
@@ -52,9 +50,12 @@ export class CardDetailLayoutComponent implements OnInit, OnDestroy {
 
 
   private onDestory: Subject<void> = new Subject();
-  isMobile: boolean = false;
 
-  constructor(private seriesService: SeriesService) {
+  get Breakpoint() {
+    return Breakpoint;
+  }
+
+  constructor(private seriesService: SeriesService, public utilityService: UtilityService) {
     this.filter = this.seriesService.createSeriesFilter();
   }
 
@@ -69,9 +70,6 @@ export class CardDetailLayoutComponent implements OnInit, OnDestroy {
     if (this.pagination === undefined) {
       this.pagination = {currentPage: 1, itemsPerPage: this.items.length, totalItems: this.items.length, totalPages: 1}
     }
-
-    this.isMobile = window.innerWidth <= 480;
-    window.onresize = () => this.isMobile = window.innerWidth <= 480;
   }
 
   ngOnDestroy() {

UI/Web/src/app/events-widget/events-widget.component.ts

@@ -83,7 +83,7 @@ export class EventsWidgetComponent implements OnInit, OnDestroy {
   processNotificationProgressEvent(event: Message<NotificationProgressEvent>) {
     const message = event.payload as NotificationProgressEvent;
     let data;
-
+    let index = -1;
     switch (event.payload.eventType) {
       case 'single':
         const values = this.singleUpdateSource.getValue();
@@ -92,20 +92,12 @@ export class EventsWidgetComponent implements OnInit, OnDestroy {
         this.activeEvents += 1;
         break;
       case 'started':
-        data = this.progressEventsSource.getValue();
-        data.push(message);
+        // Sometimes we can receive 2 started on long running scans, so better to just treat as a merge then.
+        data = this.mergeOrUpdate(this.progressEventsSource.getValue(), message);
         this.progressEventsSource.next(data);
-        this.activeEvents += 1;
         break;
       case 'updated':
-        data = this.progressEventsSource.getValue();
-        const index = data.findIndex(m => m.name === message.name);
-        if (index < 0) {
-          data.push(message);
-          this.activeEvents += 1;
-        } else {
-          data[index] = message;
-        }
+        data = this.mergeOrUpdate(this.progressEventsSource.getValue(), message);
         this.progressEventsSource.next(data);
         break;
       case 'ended':
@@ -119,6 +111,18 @@ export class EventsWidgetComponent implements OnInit, OnDestroy {
     }
   }
 
+  private mergeOrUpdate(data: NotificationProgressEvent[], message: NotificationProgressEvent) {
+    const index = data.findIndex(m => m.name === message.name);
+    // Sometimes we can receive 2 started on long running scans, so better to just treat as a merge then.
+    if (index < 0) {
+      data.push(message);
+      this.activeEvents += 1;
+    } else {
+      data[index] = message;
+    }
+    return data;
+  }
+
 
   handleUpdateAvailableClick(message: NotificationProgressEvent) {
     if (this.updateNotificationModalRef != null) { return; }

UI/Web/src/app/manga-reader/manga-reader.component.ts

@@ -258,12 +258,13 @@ export class MangaReaderComponent implements OnInit, AfterViewInit, OnDestroy {
    */
   backgroundColor: string = '#FFFFFF';
 
+  getPageUrl = (pageNum: number) => {
+    if (this.bookmarkMode) return this.readerService.getBookmarkPageUrl(this.seriesId, this.user.apiKey, pageNum);
+    return this.readerService.getPageUrl(this.chapterId, pageNum);
+  }
 
   private readonly onDestroy = new Subject<void>();
 
-
-  //getPageUrl = (pageNum: number) => this.readerService.getPageUrl(this.chapterId, pageNum);
-
   get PageNumber() {
     return Math.max(Math.min(this.pageNum, this.maxPages - 1), 0);
   }
@@ -1096,10 +1097,7 @@ export class MangaReaderComponent implements OnInit, AfterViewInit, OnDestroy {
     //console.log('cachedImages: ', this.cachedImages.arr.map(img => this.readerService.imageUrlToPageNum(img.src) + ': ' + img.complete));
   }
 
-  getPageUrl(pageNum: number) {
-    if (this.bookmarkMode) return this.readerService.getBookmarkPageUrl(this.seriesId, this.user.apiKey, pageNum);
-    return this.readerService.getPageUrl(this.chapterId, pageNum);
-  }
+  
 
   loadPage() {
     if (!this.canvas || !this.ctx) { return; }

UI/Web/src/app/series-metadata-detail/series-metadata-detail.component.html

@@ -9,7 +9,7 @@
         <app-tag-badge *ngIf="seriesMetadata.releaseYear > 0" title="Release date" class="col-auto">{{seriesMetadata.releaseYear}}</app-tag-badge>
         <app-tag-badge *ngIf="seriesMetadata.language !== null && seriesMetadata.language !== ''" title="Language" a11y-click="13,32" class="col-auto" (click)="goTo(FilterQueryParam.Languages, seriesMetadata.language)" [selectionMode]="TagBadgeCursor.Clickable">{{seriesMetadata.language}}</app-tag-badge>
         
-        <app-tag-badge title="Publication Status ({{seriesMetadata.maxCount}} / {{seriesMetadata.totalCount}})" [fillStyle]="seriesMetadata.maxCount != 0 && seriesMetadata.maxCount >= seriesMetadata.totalCount ? 'filled' : 'outline'" a11y-click="13,32" class="col-auto" 
+        <app-tag-badge title="Publication Status ({{seriesMetadata.maxCount}} / {{seriesMetadata.totalCount}})" [fillStyle]="seriesMetadata.maxCount != 0 && seriesMetadata.totalCount != 0 && seriesMetadata.maxCount >= seriesMetadata.totalCount ? 'filled' : 'outline'" a11y-click="13,32" class="col-auto" 
         (click)="goTo(FilterQueryParam.PublicationStatus, seriesMetadata.publicationStatus)" 
         [selectionMode]="TagBadgeCursor.Clickable">{{seriesMetadata.publicationStatus | publicationStatus}}</app-tag-badge>