Release Polish 3 (#3359)

This commit is contained in:
Joe Milazzo 2024-11-12 13:04:43 -06:00 committed by GitHub
parent dd3dec269f
commit f812f61001
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
34 changed files with 211 additions and 134 deletions

View file

@ -0,0 +1 @@
export const DefaultModalOptions = {scrollable: true, size: 'xl', fullscreen: 'xl'};

View file

@ -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 '';
}

View file

@ -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)

View file

@ -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;

View file

@ -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) {

View file

@ -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"

View file

@ -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 {

View file

@ -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);
}

View file

@ -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;
});
}

View file

@ -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;
}
},

View file

@ -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;
}

View file

@ -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) {

View file

@ -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;

View file

@ -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) {

View file

@ -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);

View file

@ -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 {

View file

@ -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 => {

View file

@ -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>

View file

@ -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;
}

View file

@ -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];

View file

@ -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>
}

View file

@ -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;
}

View file

@ -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) => {

View file

@ -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;
}

View file

@ -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;