AZEN-SGG/Kavita
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Implemented Publication Status in SeriesMetadata and the ability to filter it. (#915)

Browse source
This commit is contained in:
Joseph Milazzo 2022-01-08 13:10:03 -08:00 • committed by GitHub
parent f8e0fb8a27
commit 2fbcf203aa
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
28 changed files with 3015 additions and 19 deletions
Download patch file Download diff file Expand all files Collapse all files

6
UI/Web/src/app/_models/metadata/publication-status-dto.ts Normal file
View file

@ -0,0 +1,6 @@
import { PublicationStatus } from "./publication-status";
export interface PublicationStatusDto {
value: PublicationStatus;
title: string;
}

5
UI/Web/src/app/_models/metadata/publication-status.ts Normal file
View file

@ -0,0 +1,5 @@
export enum PublicationStatus {
OnGoing = 0,
Hiatus = 1,
Completed = 2
}

1
UI/Web/src/app/_models/series-filter.ts
View file

@ -27,6 +27,7 @@ export interface SeriesFilter {
sortOptions: SortOptions | null;
tags: Array<number>;
languages: Array<string>;
publicationStatus: Array<number>;
}
export interface SortOptions {

2
UI/Web/src/app/_models/series-metadata.ts
View file

@ -1,6 +1,7 @@
import { CollectionTag } from "./collection-tag";
import { Genre } from "./genre";
import { AgeRating } from "./metadata/age-rating";
import { PublicationStatus } from "./metadata/publication-status";
import { Person } from "./person";
import { Tag } from "./tag";
@ -24,4 +25,5 @@ export interface SeriesMetadata {
releaseYear: number;
language: string;
seriesId: number;
publicationStatus: PublicationStatus;
}

9
UI/Web/src/app/_services/metadata.service.ts
View file

@ -8,6 +8,7 @@ import { Genre } from '../_models/genre';
import { AgeRating } from '../_models/metadata/age-rating';
import { AgeRatingDto } from '../_models/metadata/age-rating-dto';
import { Language } from '../_models/metadata/language';
import { PublicationStatusDto } from '../_models/metadata/publication-status-dto';
import { Person } from '../_models/person';
import { Tag } from '../_models/tag';
@ -44,6 +45,14 @@ export class MetadataService {
return this.httpClient.get<Array<AgeRatingDto>>(this.baseUrl + method);;
}
getAllPublicationStatus(libraries?: Array<number>) {
let method = 'metadata/publication-status'
if (libraries != undefined && libraries.length > 0) {
method += '?libraryIds=' + libraries.join(',');
}
return this.httpClient.get<Array<PublicationStatusDto>>(this.baseUrl + method);;
}
getAllTags(libraries?: Array<number>) {
let method = 'metadata/tags'
if (libraries != undefined && libraries.length > 0) {

3
UI/Web/src/app/_services/series.service.ts
View file

@ -212,7 +212,8 @@ export class SeriesService {
sortOptions: null,
ageRating: [],
tags: [],
languages: []
languages: [],
publicationStatus: [],
};
if (filter === undefined) return data;

2
UI/Web/src/app/app.module.ts
View file

@ -35,6 +35,7 @@ import { NavEventsToggleComponent } from './nav-events-toggle/nav-events-toggle.
import { PersonRolePipe } from './person-role.pipe';
import { SeriesMetadataDetailComponent } from './series-metadata-detail/series-metadata-detail.component';
import { AllSeriesComponent } from './all-series/all-series.component';
import { PublicationStatusPipe } from './publication-status.pipe';
@NgModule({
@ -52,6 +53,7 @@ import { AllSeriesComponent } from './all-series/all-series.component';
DashboardComponent,
NavEventsToggleComponent,
PersonRolePipe,
PublicationStatusPipe,
SeriesMetadataDetailComponent,
AllSeriesComponent,
],

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

@ -309,6 +309,19 @@
</app-typeahead>
</div>
<div class="col-md-2 mr-3" *ngIf="!filterSettings.publicationStatusDisabled">
<label for="publication-status">Publication Status</label>
<app-typeahead (selectedData)="updatePublicationStatus($event)" [settings]="publicationStatusSettings" [reset]="resetTypeaheads">
<ng-template #badgeItem let-item let-position="idx">
{{item.title}}
</ng-template>
<ng-template #optionItem let-item let-position="idx">
{{item.title}}
</ng-template>
</app-typeahead>
</div>
</div>
<div class="row justify-content-center no-gutters">
<div class="col-md-2 mr-3" *ngIf="!filterSettings.sortDisabled">
<form [formGroup]="sortGroup">
<div class="form-group">
@ -326,16 +339,13 @@
</select>
</div>
</form>
</div>
</div>
<div class="row justify-content-center no-gutters">
<div class="col-md-3 mr-3">
</div>
<div class="col-md-2 mr-3"></div>
<div class="col-md-2 mr-3"></div>
<div class="col-md-2 mr-3 mt-4">
<button class="btn btn-secondary btn-block" (click)="clear()">Clear</button>
</div>
<div class="col-md-3">
<div class="col-md-2 mr-3 mt-4">
<button class="btn btn-primary btn-block" (click)="apply()">Apply</button>
</div>
</div>

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

@ -11,6 +11,7 @@ import { MangaFormat } from 'src/app/_models/manga-format';
import { AgeRating } from 'src/app/_models/metadata/age-rating';
import { AgeRatingDto } from 'src/app/_models/metadata/age-rating-dto';
import { Language } from 'src/app/_models/metadata/language';
import { PublicationStatusDto } from 'src/app/_models/metadata/publication-status-dto';
import { Pagination } from 'src/app/_models/pagination';
import { Person, PersonRole } from 'src/app/_models/person';
import { FilterItem, mangaFormatFilters, SeriesFilter, SortField } from 'src/app/_models/series-filter';
@ -39,6 +40,7 @@ export class FilterSettings {
ageRatingDisabled = false;
tagsDisabled = false;
languageDisabled = false;
publicationStatusDisabled = false;
}
@Component({
@ -70,6 +72,7 @@ export class CardDetailLayoutComponent implements OnInit, OnDestroy {
genreSettings: TypeaheadSettings<FilterItem<Genre>> = new TypeaheadSettings();
collectionSettings: TypeaheadSettings<FilterItem<CollectionTag>> = new TypeaheadSettings();
ageRatingSettings: TypeaheadSettings<FilterItem<AgeRatingDto>> = new TypeaheadSettings();
publicationStatusSettings: TypeaheadSettings<FilterItem<PublicationStatusDto>> = new TypeaheadSettings();
tagsSettings: TypeaheadSettings<FilterItem<Tag>> = new TypeaheadSettings();
languageSettings: TypeaheadSettings<FilterItem<Language>> = new TypeaheadSettings();
peopleSettings: {[PersonRole: string]: TypeaheadSettings<FilterItem<Person>>} = {};
@ -84,7 +87,7 @@ export class CardDetailLayoutComponent implements OnInit, OnDestroy {
libraries: Array<FilterItem<Library>> = [];
genres: Array<FilterItem<Genre>> = [];
persons: Array<FilterItem<Person>> = [];
//collectionTags: Array<FilterItem<CollectionTag>> = [];
readProgressGroup!: FormGroup;
sortGroup!: FormGroup;
@ -171,6 +174,7 @@ export class CardDetailLayoutComponent implements OnInit, OnDestroy {
this.setupCollectionTagTypeahead();
this.setupPersonTypeahead();
this.setupAgeRatingSettings();
this.setupPublicationStatusSettings();
this.setupTagSettings();
this.setupLanguageSettings();
}
@ -261,6 +265,29 @@ export class CardDetailLayoutComponent implements OnInit, OnDestroy {
}
}
setupPublicationStatusSettings() {
this.publicationStatusSettings.minCharacters = 0;
this.publicationStatusSettings.multiple = true;
this.publicationStatusSettings.id = 'publication-status';
this.publicationStatusSettings.unique = true;
this.publicationStatusSettings.addIfNonExisting = false;
this.publicationStatusSettings.fetchFn = (filter: string) => {
return this.metadataService.getAllPublicationStatus(this.filter.libraries).pipe(map(statuses => {
return statuses.map(status => {
return {
title: status.title,
value: status,
selected: false,
}
})
}));
};
this.publicationStatusSettings.compareFn = (options: FilterItem<PublicationStatusDto>[], filter: string) => {
const f = filter.toLowerCase();
return options.filter(m => m.title.toLowerCase() === f && this.utilityService.filter(m.title, filter));
}
}
setupTagSettings() {
this.tagsSettings.minCharacters = 0;
this.tagsSettings.multiple = true;
@ -475,9 +502,6 @@ export class CardDetailLayoutComponent implements OnInit, OnDestroy {
case PersonRole.Colorist:
this.filter.colorist = persons.map(p => p.value.id);
break;
// case PersonRole.Artist:
// this.filter.artist = persons.map(p => p.value.id);
// break;
case PersonRole.Editor:
this.filter.editor = persons.map(p => p.value.id);
break;
@ -514,12 +538,15 @@ export class CardDetailLayoutComponent implements OnInit, OnDestroy {
this.filter.ageRating = ratingDtos.map(item => item.value.value) || [];
}
updatePublicationStatus(dtos: FilterItem<PublicationStatusDto>[]) {
this.filter.publicationStatus = dtos.map(item => item.value.value) || [];
}
updateLanguageRating(languages: FilterItem<Language>[]) {
this.filter.languages = languages.map(item => item.value.isoCode) || [];
}
updateReadStatus(status: string) {
console.log('readstatus: ', this.filter.readStatus);
if (status === 'read') {
this.filter.readStatus.read = !this.filter.readStatus.read;
} else if (status === 'inProgress') {

19
UI/Web/src/app/publication-status.pipe.ts Normal file
View file

@ -0,0 +1,19 @@
import { Pipe, PipeTransform } from '@angular/core';
import { PublicationStatus } from './_models/metadata/publication-status';
@Pipe({
name: 'publicationStatus'
})
export class PublicationStatusPipe implements PipeTransform {
transform(value: PublicationStatus): string {
switch (value) {
case PublicationStatus.OnGoing: return 'Ongoing';
case PublicationStatus.Hiatus: return 'Hiatus';
case PublicationStatus.Completed: return 'Completed';
default: return '';
}
}
}

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

@ -10,6 +10,7 @@
<!-- tooltip here explaining how this is year of first issue -->
<app-tag-badge *ngIf="seriesMetadata.releaseYear > 0" title="Release date">{{seriesMetadata.releaseYear}}</app-tag-badge>
<app-tag-badge *ngIf="seriesMetadata.language !== null && seriesMetadata.language !== ''" title="Language">{{seriesMetadata.language}}</app-tag-badge>
<app-tag-badge title="Publication Status">{{seriesMetadata.publicationStatus | publicationStatus}}</app-tag-badge>
<app-tag-badge [selectionMode]="TagBadgeCursor.NotAllowed">
<app-series-format [format]="series.format">{{utilityService.mangaFormat(series.format)}}</app-series-format>
</app-tag-badge>