Release Polish 3 (#3359)
This commit is contained in:
parent
dd3dec269f
commit
f812f61001
34 changed files with 211 additions and 134 deletions
1
UI/Web/src/app/_models/default-modal-options.ts
Normal file
1
UI/Web/src/app/_models/default-modal-options.ts
Normal file
|
@ -0,0 +1 @@
|
|||
export const DefaultModalOptions = {scrollable: true, size: 'xl', fullscreen: 'xl'};
|
|
@ -1,6 +1,6 @@
|
|||
import {inject, Pipe, PipeTransform} from '@angular/core';
|
||||
import { PersonRole } from '../_models/metadata/person';
|
||||
import {TranslocoService} from "@jsverse/transloco";
|
||||
import {translate, TranslocoService} from "@jsverse/transloco";
|
||||
|
||||
@Pipe({
|
||||
name: 'personRole',
|
||||
|
@ -8,39 +8,38 @@ import {TranslocoService} from "@jsverse/transloco";
|
|||
})
|
||||
export class PersonRolePipe implements PipeTransform {
|
||||
|
||||
translocoService = inject(TranslocoService);
|
||||
transform(value: PersonRole): string {
|
||||
switch (value) {
|
||||
case PersonRole.Artist:
|
||||
return this.translocoService.translate('person-role-pipe.artist');
|
||||
return translate('person-role-pipe.artist');
|
||||
case PersonRole.Character:
|
||||
return this.translocoService.translate('person-role-pipe.character');
|
||||
return translate('person-role-pipe.character');
|
||||
case PersonRole.Colorist:
|
||||
return this.translocoService.translate('person-role-pipe.colorist');
|
||||
return translate('person-role-pipe.colorist');
|
||||
case PersonRole.CoverArtist:
|
||||
return this.translocoService.translate('person-role-pipe.artist');
|
||||
return translate('person-role-pipe.artist');
|
||||
case PersonRole.Editor:
|
||||
return this.translocoService.translate('person-role-pipe.editor');
|
||||
return translate('person-role-pipe.editor');
|
||||
case PersonRole.Inker:
|
||||
return this.translocoService.translate('person-role-pipe.inker');
|
||||
return translate('person-role-pipe.inker');
|
||||
case PersonRole.Letterer:
|
||||
return this.translocoService.translate('person-role-pipe.letterer');
|
||||
return translate('person-role-pipe.letterer');
|
||||
case PersonRole.Penciller:
|
||||
return this.translocoService.translate('person-role-pipe.penciller');
|
||||
return translate('person-role-pipe.penciller');
|
||||
case PersonRole.Publisher:
|
||||
return this.translocoService.translate('person-role-pipe.publisher');
|
||||
return translate('person-role-pipe.publisher');
|
||||
case PersonRole.Imprint:
|
||||
return this.translocoService.translate('person-role-pipe.imprint');
|
||||
return translate('person-role-pipe.imprint');
|
||||
case PersonRole.Writer:
|
||||
return this.translocoService.translate('person-role-pipe.writer');
|
||||
return translate('person-role-pipe.writer');
|
||||
case PersonRole.Team:
|
||||
return this.translocoService.translate('person-role-pipe.team');
|
||||
return translate('person-role-pipe.team');
|
||||
case PersonRole.Location:
|
||||
return this.translocoService.translate('person-role-pipe.location');
|
||||
return translate('person-role-pipe.location');
|
||||
case PersonRole.Translator:
|
||||
return this.translocoService.translate('person-role-pipe.translator');
|
||||
return translate('person-role-pipe.translator');
|
||||
case PersonRole.Other:
|
||||
return this.translocoService.translate('person-role-pipe.other');
|
||||
return translate('person-role-pipe.other');
|
||||
default:
|
||||
return '';
|
||||
}
|
||||
|
|
|
@ -27,6 +27,7 @@ import {FilterService} from "./filter.service";
|
|||
import {ReadingListService} from "./reading-list.service";
|
||||
import {ChapterService} from "./chapter.service";
|
||||
import {VolumeService} from "./volume.service";
|
||||
import {DefaultModalOptions} from "../_models/default-modal-options";
|
||||
|
||||
export type LibraryActionCallback = (library: Partial<Library>) => void;
|
||||
export type SeriesActionCallback = (series: Series) => void;
|
||||
|
@ -121,7 +122,7 @@ export class ActionService {
|
|||
}
|
||||
|
||||
editLibrary(library: Partial<Library>, callback?: LibraryActionCallback) {
|
||||
const modalRef = this.modalService.open(LibrarySettingsModalComponent, {size: 'xl', fullscreen: 'md'});
|
||||
const modalRef = this.modalService.open(LibrarySettingsModalComponent, DefaultModalOptions);
|
||||
modalRef.componentInstance.library = library;
|
||||
modalRef.closed.subscribe((closeResult: {success: boolean, library: Library, coverImageUpdate: boolean}) => {
|
||||
if (callback) callback(library)
|
||||
|
|
|
@ -16,7 +16,8 @@ export class JumpbarService {
|
|||
|
||||
|
||||
getResumeKey(key: string) {
|
||||
if (this.resumeKeys.hasOwnProperty(key)) return this.resumeKeys[key];
|
||||
const k = key.toUpperCase();
|
||||
if (this.resumeKeys.hasOwnProperty(k)) return this.resumeKeys[k];
|
||||
return '';
|
||||
}
|
||||
|
||||
|
@ -26,7 +27,8 @@ export class JumpbarService {
|
|||
}
|
||||
|
||||
saveResumeKey(key: string, value: string) {
|
||||
this.resumeKeys[key] = value;
|
||||
const k = key.toUpperCase();
|
||||
this.resumeKeys[k] = value;
|
||||
}
|
||||
|
||||
saveResumePosition(url: string, value: number) {
|
||||
|
@ -75,9 +77,11 @@ export class JumpbarService {
|
|||
|
||||
_removeFirstPartOfJumpBar(midPoint: number, numberOfRemovals: number = 1, jumpBarKeys: Array<JumpKey>, jumpBarKeysToRender: Array<JumpKey>) {
|
||||
const removedIndexes: Array<number> = [];
|
||||
|
||||
for(let removal = 0; removal < numberOfRemovals; removal++) {
|
||||
let min = 100000000;
|
||||
let minIndex = -1;
|
||||
|
||||
for(let i = 1; i < midPoint; i++) {
|
||||
if (jumpBarKeys[i].size < min && !removedIndexes.includes(i)) {
|
||||
min = jumpBarKeys[i].size;
|
||||
|
@ -101,7 +105,7 @@ export class JumpbarService {
|
|||
getJumpKeys(data :Array<any>, keySelector: (data: any) => string) {
|
||||
const keys: {[key: string]: number} = {};
|
||||
data.forEach(obj => {
|
||||
let ch = keySelector(obj).charAt(0);
|
||||
let ch = keySelector(obj).charAt(0).toUpperCase();
|
||||
if (/\d|\#|!|%|@|\(|\)|\^|\.|_|\*/g.test(ch)) {
|
||||
ch = '#';
|
||||
}
|
||||
|
@ -111,10 +115,11 @@ export class JumpbarService {
|
|||
keys[ch] += 1;
|
||||
});
|
||||
return Object.keys(keys).map(k => {
|
||||
k = k.toUpperCase();
|
||||
return {
|
||||
key: k,
|
||||
size: keys[k],
|
||||
title: k.toUpperCase()
|
||||
title: k
|
||||
}
|
||||
}).sort((a, b) => {
|
||||
if (a.key < b.key) return -1;
|
||||
|
|
|
@ -29,8 +29,8 @@ export class PersonService {
|
|||
return this.httpClient.get<Person>(this.baseUrl + `person?name=${name}`);
|
||||
}
|
||||
|
||||
getRolesForPerson(name: string) {
|
||||
return this.httpClient.get<Array<PersonRole>>(this.baseUrl + `person/roles?name=${name}`);
|
||||
getRolesForPerson(personId: number) {
|
||||
return this.httpClient.get<Array<PersonRole>>(this.baseUrl + `person/roles?personId=${personId}`);
|
||||
}
|
||||
|
||||
getSeriesMostKnownFor(personId: number) {
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||
<div class="publisher-side publisher-front">
|
||||
<div class="publisher-img-container d-inline-flex align-items-center me-2 position-relative">
|
||||
<app-image
|
||||
[imageUrl]="imageService.getPersonImage(currentPublisher!.id)"
|
||||
[imageUrl]="imageService.getPublisherImage(currentPublisher!.name)"
|
||||
[classes]="'me-2'"
|
||||
[hideOnError]="true"
|
||||
width="32px"
|
||||
|
@ -20,7 +20,7 @@
|
|||
<div class="publisher-side publisher-back">
|
||||
<div class="publisher-img-container d-inline-flex align-items-center me-2 position-relative">
|
||||
<app-image
|
||||
[imageUrl]="imageService.getPersonImage(nextPublisher!.id)"
|
||||
[imageUrl]="imageService.getPublisherImage(nextPublisher!.name)"
|
||||
[classes]="'me-2'"
|
||||
[hideOnError]="true"
|
||||
width="32px"
|
||||
|
|
|
@ -1,18 +1,33 @@
|
|||
//.publisher-flipper-container {
|
||||
// perspective: 1000px;
|
||||
//}
|
||||
//
|
||||
//.publisher-img-container {
|
||||
// transform-style: preserve-3d;
|
||||
// transition: transform 0.5s;
|
||||
// background-color: var(--card-bg-color);
|
||||
// border-radius: 3px;
|
||||
// padding: 2px 5px;
|
||||
// font-size: 0.8rem;
|
||||
// vertical-align: middle;
|
||||
//
|
||||
// div {
|
||||
// min-height: 32px;
|
||||
// line-height: 32px;
|
||||
// }
|
||||
//}
|
||||
|
||||
|
||||
// jumpbar example
|
||||
// Animation code
|
||||
|
||||
.publisher-wrapper {
|
||||
perspective: 1000px;
|
||||
height: 32px;
|
||||
|
||||
background-color: var(--card-bg-color);
|
||||
border-radius: 3px;
|
||||
padding: 2px 5px;
|
||||
font-size: 0.8rem;
|
||||
vertical-align: middle;
|
||||
|
||||
div {
|
||||
min-height: 32px;
|
||||
line-height: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
.publisher-flipper {
|
||||
|
@ -20,7 +35,7 @@
|
|||
width: 100%;
|
||||
height: 100%;
|
||||
text-align: left;
|
||||
transition: transform 0.6s;
|
||||
transition: transform 0.6s ease;
|
||||
transform-style: preserve-3d;
|
||||
}
|
||||
|
||||
|
@ -33,7 +48,6 @@
|
|||
width: 100%;
|
||||
height: 100%;
|
||||
backface-visibility: hidden;
|
||||
transform-style: preserve-3d;
|
||||
}
|
||||
|
||||
.publisher-front {
|
||||
|
|
|
@ -1,4 +1,14 @@
|
|||
import {ChangeDetectionStrategy, ChangeDetectorRef, Component, inject, Input, OnDestroy, OnInit} from '@angular/core';
|
||||
import {
|
||||
AfterViewChecked,
|
||||
AfterViewInit,
|
||||
ChangeDetectionStrategy,
|
||||
ChangeDetectorRef,
|
||||
Component,
|
||||
inject,
|
||||
Input,
|
||||
OnDestroy,
|
||||
OnInit
|
||||
} from '@angular/core';
|
||||
import {ImageComponent} from "../../shared/image/image.component";
|
||||
import {FilterField} from "../../_models/metadata/v2/filter-field";
|
||||
import {Person} from "../../_models/metadata/person";
|
||||
|
@ -19,7 +29,7 @@ const ANIMATION_TIME = 3000;
|
|||
styleUrl: './publisher-flipper.component.scss',
|
||||
changeDetection: ChangeDetectionStrategy.OnPush
|
||||
})
|
||||
export class PublisherFlipperComponent implements OnInit, OnDestroy {
|
||||
export class PublisherFlipperComponent implements OnInit, OnDestroy, AfterViewInit, AfterViewChecked {
|
||||
|
||||
protected readonly imageService = inject(ImageService);
|
||||
private readonly filterUtilityService = inject(FilterUtilitiesService);
|
||||
|
@ -36,14 +46,26 @@ export class PublisherFlipperComponent implements OnInit, OnDestroy {
|
|||
isFlipped = false;
|
||||
private intervalId: any;
|
||||
|
||||
|
||||
ngOnInit() {
|
||||
if (this.publishers.length > 0) {
|
||||
this.currentPublisher = this.publishers[0];
|
||||
this.nextPublisher = this.publishers[1] || this.publishers[0];
|
||||
if (this.publishers.length > 1) {
|
||||
this.startFlipping();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ngAfterViewInit() {
|
||||
if (this.publishers.length > 1) {
|
||||
this.startFlipping(); // Start flipping cycle once the view is initialized
|
||||
}
|
||||
}
|
||||
|
||||
ngAfterViewChecked() {
|
||||
// This lifecycle hook will be called after Angular performs change detection in each cycle
|
||||
if (this.isFlipped) {
|
||||
// Only update publishers after the flip is complete
|
||||
this.currentIndex = (this.currentIndex + 1) % this.publishers.length;
|
||||
this.currentPublisher = this.publishers[this.currentIndex];
|
||||
this.nextPublisher = this.publishers[(this.currentIndex + 1) % this.publishers.length];
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -55,22 +77,9 @@ export class PublisherFlipperComponent implements OnInit, OnDestroy {
|
|||
|
||||
private startFlipping() {
|
||||
this.intervalId = setInterval(() => {
|
||||
// First flip
|
||||
this.isFlipped = true;
|
||||
this.cdRef.markForCheck();
|
||||
|
||||
// Update content after flip animation completes
|
||||
setTimeout(() => {
|
||||
// Update indices and content
|
||||
this.currentIndex = (this.currentIndex + 1) % this.publishers.length;
|
||||
this.currentPublisher = this.publishers[this.currentIndex];
|
||||
this.nextPublisher = this.publishers[(this.currentIndex + 1) % this.publishers.length];
|
||||
|
||||
// Reset flip
|
||||
this.isFlipped = false;
|
||||
|
||||
this.cdRef.markForCheck();
|
||||
}, ANIMATION_TIME); // Full transition time to ensure flip completes
|
||||
// Toggle flip state, initiating the flip animation
|
||||
this.isFlipped = !this.isFlipped;
|
||||
this.cdRef.detectChanges(); // Explicitly detect changes to trigger re-render
|
||||
}, ANIMATION_TIME);
|
||||
}
|
||||
|
||||
|
|
|
@ -29,6 +29,7 @@ import {DefaultDatePipe} from "../../_pipes/default-date.pipe";
|
|||
import {DefaultValuePipe} from "../../_pipes/default-value.pipe";
|
||||
import {TranslocoLocaleModule} from "@jsverse/transloco-locale";
|
||||
import {UtcToLocalTimePipe} from "../../_pipes/utc-to-local-time.pipe";
|
||||
import {DefaultModalOptions} from "../../_models/default-modal-options";
|
||||
|
||||
@Component({
|
||||
selector: 'app-manage-scrobble-errors',
|
||||
|
@ -111,7 +112,7 @@ export class ManageScrobbleErrorsComponent implements OnInit {
|
|||
|
||||
editSeries(seriesId: number) {
|
||||
this.seriesService.getSeries(seriesId).subscribe(series => {
|
||||
const modalRef = this.modalService.open(EditSeriesModalComponent, { size: 'xl' });
|
||||
const modalRef = this.modalService.open(EditSeriesModalComponent, DefaultModalOptions);
|
||||
modalRef.componentInstance.series = series;
|
||||
});
|
||||
}
|
||||
|
|
|
@ -20,6 +20,7 @@ import {takeUntilDestroyed} from "@angular/core/rxjs-interop";
|
|||
import {SettingItemComponent} from "../../settings/_components/setting-item/setting-item.component";
|
||||
import {ConfirmService} from "../../shared/confirm.service";
|
||||
import {SettingButtonComponent} from "../../settings/_components/setting-button/setting-button.component";
|
||||
import {DefaultModalOptions} from "../../_models/default-modal-options";
|
||||
|
||||
interface AdhocTask {
|
||||
name: string;
|
||||
|
@ -128,7 +129,7 @@ export class ManageTasksSettingsComponent implements OnInit {
|
|||
this.toastr.info(translate('toasts.no-updates'));
|
||||
return;
|
||||
}
|
||||
const modalRef = this.modalService.open(UpdateNotificationModalComponent, { scrollable: true, size: 'lg' });
|
||||
const modalRef = this.modalService.open(UpdateNotificationModalComponent, DefaultModalOptions);
|
||||
modalRef.componentInstance.updateData = update;
|
||||
}
|
||||
},
|
||||
|
|
|
@ -22,6 +22,7 @@ import {makeBindingParser} from "@angular/compiler";
|
|||
import {LoadingComponent} from "../../shared/loading/loading.component";
|
||||
import {TimeAgoPipe} from "../../_pipes/time-ago.pipe";
|
||||
import {SentenceCasePipe} from "../../_pipes/sentence-case.pipe";
|
||||
import {DefaultModalOptions} from "../../_models/default-modal-options";
|
||||
|
||||
@Component({
|
||||
selector: 'app-manage-users',
|
||||
|
@ -87,7 +88,7 @@ export class ManageUsersComponent implements OnInit {
|
|||
}
|
||||
|
||||
openEditUser(member: Member) {
|
||||
const modalRef = this.modalService.open(EditUserComponent, { scrollable: true, size: 'xl', fullscreen: 'md' });
|
||||
const modalRef = this.modalService.open(EditUserComponent, DefaultModalOptions);
|
||||
modalRef.componentInstance.member = member;
|
||||
modalRef.closed.subscribe(() => {
|
||||
this.loadMembers();
|
||||
|
@ -107,7 +108,7 @@ export class ManageUsersComponent implements OnInit {
|
|||
}
|
||||
|
||||
inviteUser() {
|
||||
const modalRef = this.modalService.open(InviteUserComponent, {size: 'xl'});
|
||||
const modalRef = this.modalService.open(InviteUserComponent, DefaultModalOptions);
|
||||
modalRef.closed.subscribe((successful: boolean) => {
|
||||
this.loadMembers();
|
||||
});
|
||||
|
@ -133,7 +134,7 @@ export class ManageUsersComponent implements OnInit {
|
|||
}
|
||||
|
||||
updatePassword(member: Member) {
|
||||
const modalRef = this.modalService.open(ResetPasswordModalComponent);
|
||||
const modalRef = this.modalService.open(ResetPasswordModalComponent, DefaultModalOptions);
|
||||
modalRef.componentInstance.member = member;
|
||||
}
|
||||
|
||||
|
|
|
@ -43,6 +43,7 @@ import {User} from "../../_models/user";
|
|||
import {ScrollService} from "../../_services/scroll.service";
|
||||
import {ReaderService} from "../../_services/reader.service";
|
||||
import {SeriesFormatComponent} from "../../shared/series-format/series-format.component";
|
||||
import {DefaultModalOptions} from "../../_models/default-modal-options";
|
||||
|
||||
function deepClone(obj: any): any {
|
||||
if (obj === null || typeof obj !== 'object') {
|
||||
|
@ -278,7 +279,7 @@ export class SeriesCardComponent implements OnInit, OnChanges {
|
|||
}
|
||||
|
||||
openEditModal(data: Series) {
|
||||
const modalRef = this.modalService.open(EditSeriesModalComponent, { size: 'lg' });
|
||||
const modalRef = this.modalService.open(EditSeriesModalComponent, DefaultModalOptions);
|
||||
modalRef.componentInstance.series = data;
|
||||
modalRef.closed.subscribe((closeResult: {success: boolean, series: Series, coverImageUpdate: boolean}) => {
|
||||
if (closeResult.success) {
|
||||
|
|
|
@ -83,6 +83,7 @@ import {PublicationStatusPipe} from "../_pipes/publication-status.pipe";
|
|||
import {DefaultDatePipe} from "../_pipes/default-date.pipe";
|
||||
import {MangaFormatPipe} from "../_pipes/manga-format.pipe";
|
||||
import {CoverImageComponent} from "../_single-module/cover-image/cover-image.component";
|
||||
import {DefaultModalOptions} from "../_models/default-modal-options";
|
||||
|
||||
enum TabID {
|
||||
Related = 'related-tab',
|
||||
|
@ -317,7 +318,7 @@ export class ChapterDetailComponent implements OnInit {
|
|||
}
|
||||
|
||||
openEditModal() {
|
||||
const ref = this.modalService.open(EditChapterModalComponent, { size: 'xl' });
|
||||
const ref = this.modalService.open(EditChapterModalComponent, DefaultModalOptions);
|
||||
ref.componentInstance.chapter = this.chapter;
|
||||
ref.componentInstance.libraryType = this.libraryType;
|
||||
ref.componentInstance.libraryId = this.libraryId;
|
||||
|
|
|
@ -42,6 +42,7 @@ import {SeriesCardComponent} from "../../../cards/series-card/series-card.compon
|
|||
import {ActionService} from "../../../_services/action.service";
|
||||
import {KEY_CODES} from "../../../shared/_services/utility.service";
|
||||
import {WikiLink} from "../../../_models/wiki";
|
||||
import {DefaultModalOptions} from "../../../_models/default-modal-options";
|
||||
|
||||
|
||||
@Component({
|
||||
|
@ -153,7 +154,7 @@ export class AllCollectionsComponent implements OnInit {
|
|||
});
|
||||
break;
|
||||
case(Action.Edit):
|
||||
const modalRef = this.modalService.open(EditCollectionTagsComponent, { size: 'lg', scrollable: true });
|
||||
const modalRef = this.modalService.open(EditCollectionTagsComponent, DefaultModalOptions);
|
||||
modalRef.componentInstance.tag = collectionTag;
|
||||
modalRef.closed.subscribe((results: {success: boolean, coverImageUpdated: boolean}) => {
|
||||
if (results.success) {
|
||||
|
|
|
@ -64,6 +64,7 @@ import {PromotedIconComponent} from "../../../shared/_components/promoted-icon/p
|
|||
import {
|
||||
SmartCollectionDrawerComponent
|
||||
} from "../../../_single-module/smart-collection-drawer/smart-collection-drawer.component";
|
||||
import {DefaultModalOptions} from "../../../_models/default-modal-options";
|
||||
|
||||
@Component({
|
||||
selector: 'app-collection-detail',
|
||||
|
@ -330,7 +331,7 @@ export class CollectionDetailComponent implements OnInit, AfterContentChecked {
|
|||
}
|
||||
|
||||
openEditCollectionTagModal(collectionTag: UserCollection) {
|
||||
const modalRef = this.modalService.open(EditCollectionTagsComponent, { size: 'lg', scrollable: true });
|
||||
const modalRef = this.modalService.open(EditCollectionTagsComponent, DefaultModalOptions);
|
||||
modalRef.componentInstance.tag = this.collectionTag;
|
||||
modalRef.closed.subscribe((results: {success: boolean, coverImageUpdated: boolean}) => {
|
||||
this.updateTag(this.collectionTag.id);
|
||||
|
|
|
@ -26,6 +26,7 @@ import { SentenceCasePipe } from '../../../_pipes/sentence-case.pipe';
|
|||
import { CircularLoaderComponent } from '../../../shared/circular-loader/circular-loader.component';
|
||||
import { NgClass, NgStyle, AsyncPipe } from '@angular/common';
|
||||
import {TranslocoDirective} from "@jsverse/transloco";
|
||||
import {DefaultModalOptions} from "../../../_models/default-modal-options";
|
||||
|
||||
@Component({
|
||||
selector: 'app-nav-events-toggle',
|
||||
|
@ -159,7 +160,7 @@ export class EventsWidgetComponent implements OnInit, OnDestroy {
|
|||
|
||||
handleUpdateAvailableClick(message: NotificationProgressEvent | UpdateVersionEvent) {
|
||||
if (this.updateNotificationModalRef != null) { return; }
|
||||
this.updateNotificationModalRef = this.modalService.open(UpdateNotificationModalComponent, { scrollable: true, size: 'lg' });
|
||||
this.updateNotificationModalRef = this.modalService.open(UpdateNotificationModalComponent, DefaultModalOptions);
|
||||
if (message.hasOwnProperty('body')) {
|
||||
this.updateNotificationModalRef.componentInstance.updateData = (message as NotificationProgressEvent).body as UpdateVersionEvent;
|
||||
} else {
|
||||
|
|
|
@ -38,6 +38,7 @@ import {EditPersonModalComponent} from "./_modal/edit-person-modal/edit-person-m
|
|||
import {translate, TranslocoDirective} from "@jsverse/transloco";
|
||||
import {ChapterCardComponent} from "../cards/chapter-card/chapter-card.component";
|
||||
import {ThemeService} from "../_services/theme.service";
|
||||
import {DefaultModalOptions} from "../_models/default-modal-options";
|
||||
|
||||
@Component({
|
||||
selector: 'app-person-detail',
|
||||
|
@ -109,7 +110,7 @@ export class PersonDetailComponent {
|
|||
this.themeService.setColorScape(person.primaryColor || '', person.secondaryColor);
|
||||
|
||||
// Fetch roles and process them
|
||||
this.roles$ = this.personService.getRolesForPerson(this.personName).pipe(
|
||||
this.roles$ = this.personService.getRolesForPerson(this.person.id).pipe(
|
||||
tap(roles => {
|
||||
this.roles = roles;
|
||||
this.filter = this.createFilter(roles);
|
||||
|
@ -187,7 +188,7 @@ export class PersonDetailComponent {
|
|||
handleAction(action: ActionItem<Person>, person: Person) {
|
||||
switch (action.action) {
|
||||
case(Action.Edit):
|
||||
const ref = this.modalService.open(EditPersonModalComponent, {scrollable: true, size: 'lg', fullscreen: 'md'});
|
||||
const ref = this.modalService.open(EditPersonModalComponent, DefaultModalOptions);
|
||||
ref.componentInstance.person = this.person;
|
||||
|
||||
ref.closed.subscribe(r => {
|
||||
|
|
|
@ -5,10 +5,9 @@
|
|||
<app-image [imageUrl]="imageService.getPublisherImage(entity.publishers[0].name)" [classes]="'me-2'" [hideOnError]="true" width="32px" height="32px"
|
||||
aria-hidden="true"></app-image>
|
||||
<div class="position-relative d-inline-block" (click)="openGeneric(FilterField.Publisher, entity.publishers[0].id)">{{entity.publishers[0].name}}</div>
|
||||
<!-- <app-publisher-flipper [publishers]="entity.publishers"></app-publisher-flipper>-->
|
||||
</div>
|
||||
}
|
||||
<!-- TODO: Figure out if I can implement this animation (ROBBIE)-->
|
||||
<!-- <app-publisher-flipper [publishers]="entity.publishers"></app-publisher-flipper>-->
|
||||
<span class="me-2">
|
||||
<app-age-rating-image [rating]="ageRating"></app-age-rating-image>
|
||||
</span>
|
||||
|
@ -17,7 +16,7 @@
|
|||
<app-series-format [format]="mangaFormat" [useTitle]="false"></app-series-format>
|
||||
</span>
|
||||
|
||||
@if (libraryType === LibraryType.Book || libraryType === LibraryType.LightNovel) {
|
||||
@if ((libraryType === LibraryType.Book || libraryType === LibraryType.LightNovel) && mangaFormat !== MangaFormat.PDF) {
|
||||
<span class="word-count me-3">{{t('words-count', {num: readingTimeEntity.wordCount | compactNumber})}}</span>
|
||||
} @else {
|
||||
<span class="word-count me-3">{{t('pages-count', {num: readingTimeEntity.pages | compactNumber})}}</span>
|
||||
|
|
|
@ -46,6 +46,8 @@ export class MetadataDetailRowComponent {
|
|||
private readonly filterUtilityService = inject(FilterUtilitiesService);
|
||||
|
||||
protected readonly LibraryType = LibraryType;
|
||||
protected readonly FilterField = FilterField;
|
||||
protected readonly MangaFormat = MangaFormat;
|
||||
|
||||
@Input({required: true}) entity!: IHasCast;
|
||||
@Input({required: true}) readingTimeEntity!: IHasReadingTime;
|
||||
|
@ -59,7 +61,4 @@ export class MetadataDetailRowComponent {
|
|||
if (queryParamName === FilterField.None) return;
|
||||
this.filterUtilityService.applyFilter(['all-series'], queryParamName, FilterComparison.Equal, `${filter}`).subscribe();
|
||||
}
|
||||
|
||||
|
||||
protected readonly FilterField = FilterField;
|
||||
}
|
||||
|
|
|
@ -145,6 +145,7 @@ import {UserCollection} from "../../../_models/collection-tag";
|
|||
import {SeriesFormatComponent} from "../../../shared/series-format/series-format.component";
|
||||
import {MangaFormatPipe} from "../../../_pipes/manga-format.pipe";
|
||||
import {CoverImageComponent} from "../../../_single-module/cover-image/cover-image.component";
|
||||
import {DefaultModalOptions} from "../../../_models/default-modal-options";
|
||||
|
||||
|
||||
enum TabID {
|
||||
|
@ -1041,7 +1042,7 @@ export class SeriesDetailComponent implements OnInit, AfterContentChecked {
|
|||
}
|
||||
|
||||
openEditChapter(chapter: Chapter) {
|
||||
const ref = this.modalService.open(EditChapterModalComponent, { size: 'xl' });
|
||||
const ref = this.modalService.open(EditChapterModalComponent, DefaultModalOptions);
|
||||
ref.componentInstance.chapter = chapter;
|
||||
ref.componentInstance.libraryType = this.libraryType;
|
||||
ref.componentInstance.seriesId = this.series?.id;
|
||||
|
@ -1055,7 +1056,7 @@ export class SeriesDetailComponent implements OnInit, AfterContentChecked {
|
|||
}
|
||||
|
||||
openEditVolume(volume: Volume) {
|
||||
const ref = this.modalService.open(EditVolumeModalComponent, { size: 'xl' });
|
||||
const ref = this.modalService.open(EditVolumeModalComponent, DefaultModalOptions);
|
||||
ref.componentInstance.volume = volume;
|
||||
ref.componentInstance.libraryType = this.libraryType;
|
||||
ref.componentInstance.seriesId = this.series?.id;
|
||||
|
@ -1069,7 +1070,7 @@ export class SeriesDetailComponent implements OnInit, AfterContentChecked {
|
|||
}
|
||||
|
||||
openEditSeriesModal() {
|
||||
const modalRef = this.modalService.open(EditSeriesModalComponent, { size: 'xl' });
|
||||
const modalRef = this.modalService.open(EditSeriesModalComponent, DefaultModalOptions);
|
||||
modalRef.componentInstance.series = this.series;
|
||||
modalRef.closed.subscribe((closeResult: EditSeriesModalCloseResult) => {
|
||||
if (closeResult.success) {
|
||||
|
@ -1088,7 +1089,7 @@ export class SeriesDetailComponent implements OnInit, AfterContentChecked {
|
|||
openReviewModal() {
|
||||
const userReview = this.getUserReview();
|
||||
|
||||
const modalRef = this.modalService.open(ReviewSeriesModalComponent, { scrollable: true, size: 'lg' });
|
||||
const modalRef = this.modalService.open(ReviewSeriesModalComponent, DefaultModalOptions);
|
||||
modalRef.componentInstance.series = this.series;
|
||||
if (userReview.length > 0) {
|
||||
modalRef.componentInstance.review = userReview[0];
|
||||
|
|
|
@ -2,13 +2,16 @@
|
|||
<div class="tagbadge cursor clickable">
|
||||
<div class="d-flex flex-column">
|
||||
@if (HasCoverImage) {
|
||||
<app-image height="24px" width="24px" [styles]="{'object-fit': 'contain'}"
|
||||
classes="align-self-center text-center mb-2"
|
||||
[imageUrl]="ImageUrl"
|
||||
[errorImage]="imageService.noPersonImage">
|
||||
</app-image>
|
||||
<div class="mx-auto">
|
||||
<app-image height="24px" width="24px" [styles]="{'background': 'none', 'max-height': '48px', 'height': '48px', 'width': '48px', 'border-radius': '50%'}"
|
||||
[imageUrl]="ImageUrl"
|
||||
[errorImage]="imageService.noPersonImage">
|
||||
</app-image>
|
||||
</div>
|
||||
} @else {
|
||||
<i class="fas fa-user mx-auto" aria-hidden="true"></i>
|
||||
<div style="background: none; max-height: 48px; height: 48px; width: 48px; border-radius: 50%" class="mx-auto">
|
||||
<i class="fas fa-user" aria-hidden="true"></i>
|
||||
</div>
|
||||
}
|
||||
|
||||
|
||||
|
|
|
@ -7,11 +7,11 @@
|
|||
font-size: .8rem;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
width: 100px;
|
||||
width: 120px;
|
||||
word-break: break-word;
|
||||
|
||||
i {
|
||||
font-size: 2rem;
|
||||
font-size: 2.96rem;
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
|
|
@ -19,6 +19,7 @@ import {ScrobbleEventTypePipe} from "../../_pipes/scrobble-event-type.pipe";
|
|||
import {SortableHeader} from "../../_single-module/table/_directives/sortable-header.directive";
|
||||
import {UtcToLocalTimePipe} from "../../_pipes/utc-to-local-time.pipe";
|
||||
import {EditDeviceModalComponent} from "../_modals/edit-device-modal/edit-device-modal.component";
|
||||
import {DefaultModalOptions} from "../../_models/default-modal-options";
|
||||
|
||||
@Component({
|
||||
selector: 'app-manage-devices',
|
||||
|
@ -71,7 +72,7 @@ export class ManageDevicesComponent implements OnInit {
|
|||
}
|
||||
|
||||
addDevice() {
|
||||
const ref = this.modalService.open(EditDeviceModalComponent, { scrollable: true, size: 'xl', fullscreen: 'md' });
|
||||
const ref = this.modalService.open(EditDeviceModalComponent, DefaultModalOptions);
|
||||
ref.componentInstance.device = null;
|
||||
|
||||
ref.closed.subscribe((result: Device | null) => {
|
||||
|
@ -82,7 +83,7 @@ export class ManageDevicesComponent implements OnInit {
|
|||
}
|
||||
|
||||
editDevice(device: Device) {
|
||||
const ref = this.modalService.open(EditDeviceModalComponent, { scrollable: true, size: 'xl', fullscreen: 'md' });
|
||||
const ref = this.modalService.open(EditDeviceModalComponent, DefaultModalOptions);
|
||||
ref.componentInstance.device = device;
|
||||
|
||||
ref.closed.subscribe((result: Device | null) => {
|
||||
|
|
|
@ -31,6 +31,7 @@ import {Select2Module} from "ng-select2-component";
|
|||
import {LoadingComponent} from "../../shared/loading/loading.component";
|
||||
import {NgbModal} from "@ng-bootstrap/ng-bootstrap";
|
||||
import {PreviewImageModalComponent} from "../../shared/_components/carousel-modal/preview-image-modal.component";
|
||||
import {DefaultModalOptions} from "../../_models/default-modal-options";
|
||||
|
||||
interface ThemeContainer {
|
||||
downloadable?: DownloadableSiteTheme;
|
||||
|
@ -191,7 +192,7 @@ export class ThemeManagerComponent {
|
|||
previewImage(imgUrl: string) {
|
||||
if (imgUrl === '') return;
|
||||
|
||||
const ref = this.modalService.open(PreviewImageModalComponent, {size: 'xl', fullscreen: 'lg'});
|
||||
const ref = this.modalService.open(PreviewImageModalComponent, DefaultModalOptions);
|
||||
ref.componentInstance.title = this.selectedTheme!.name;
|
||||
ref.componentInstance.image = imgUrl;
|
||||
}
|
||||
|
|
|
@ -88,6 +88,7 @@ import {BulkOperationsComponent} from "../cards/bulk-operations/bulk-operations.
|
|||
import {DefaultDatePipe} from "../_pipes/default-date.pipe";
|
||||
import {MangaFormatPipe} from "../_pipes/manga-format.pipe";
|
||||
import {CoverImageComponent} from "../_single-module/cover-image/cover-image.component";
|
||||
import {DefaultModalOptions} from "../_models/default-modal-options";
|
||||
|
||||
enum TabID {
|
||||
|
||||
|
@ -527,7 +528,7 @@ export class VolumeDetailComponent implements OnInit {
|
|||
}
|
||||
|
||||
openEditModal() {
|
||||
const ref = this.modalService.open(EditVolumeModalComponent, { size: 'xl' });
|
||||
const ref = this.modalService.open(EditVolumeModalComponent, DefaultModalOptions);
|
||||
ref.componentInstance.volume = this.volume;
|
||||
ref.componentInstance.libraryType = this.libraryType;
|
||||
ref.componentInstance.libraryId = this.libraryId;
|
||||
|
@ -537,7 +538,7 @@ export class VolumeDetailComponent implements OnInit {
|
|||
}
|
||||
|
||||
openEditChapterModal(chapter: Chapter) {
|
||||
const ref = this.modalService.open(EditChapterModalComponent, { size: 'xl' });
|
||||
const ref = this.modalService.open(EditChapterModalComponent, DefaultModalOptions);
|
||||
ref.componentInstance.chapter = chapter;
|
||||
ref.componentInstance.libraryType = this.libraryType;
|
||||
ref.componentInstance.libraryId = this.libraryId;
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue