
* Fixed an issue where cover update events wouldn't refresh an image after the second event came through due to randomization * Fixed an issue where download event wasn't send consistently when downloading files. * Fixed a bug where you couldn't add a new role to a user * Fixed a bug where if you went to edit user library, the roles would get reset to nothing * Adjust the rendering on reading list page to be better on smaller screens (and worse on larger ones) * Tweaked the refresh covers message to use queued and not started * Cleaned up the code for image on when to update based on CoverUpdate event. On dashboard, don't spam reload recently added on every series update or scan complete. Debouce for 1 second between calls. * Fixed an issue where we sent an error on forgot password confirmation, but really, it was successful. * Added Reading Lists and Library to search results * Fixed a bug in the search component where hitting esc to close overlay then typing again wouldn't reopen the overlay * When resending invites, send the correct link for an invite * Tell the admin an email was sent on invite * Fixed the error interceptor to flatten validation error messages more robustly and now confirm email will show validation exceptions * Fixed a bug in webtoon reader where we were reading the wrong dimension for fitting images to screen on render * When generating email links, inform who they are for in the logs. Fixed an issue with an error message on login when password was incorrect, but user hadn't confirmed email yet. Fixed multiple cases where migration wasn't sending error messages back correctly and hence the user never saw them. * Show errors on migration UI form * Changed log rolling to be easier to understand * Added some extra logic to throw unauthorized * Tweaked some wording to inform user how to best find email link * Fixed a code smell
94 lines
3.1 KiB
TypeScript
94 lines
3.1 KiB
TypeScript
import { Component, ElementRef, Input, OnChanges, OnDestroy, OnInit, Renderer2, SimpleChanges, ViewChild } from '@angular/core';
|
|
import { Subject } from 'rxjs';
|
|
import { takeUntil } from 'rxjs/operators';
|
|
import { CoverUpdateEvent } from 'src/app/_models/events/cover-update-event';
|
|
import { ImageService } from 'src/app/_services/image.service';
|
|
import { EVENTS, MessageHubService } from 'src/app/_services/message-hub.service';
|
|
|
|
/**
|
|
* This is used for images with placeholder fallback.
|
|
*/
|
|
@Component({
|
|
selector: 'app-image',
|
|
templateUrl: './image.component.html',
|
|
styleUrls: ['./image.component.scss']
|
|
})
|
|
export class ImageComponent implements OnChanges, OnDestroy {
|
|
|
|
/**
|
|
* Source url to load image
|
|
*/
|
|
@Input() imageUrl!: string;
|
|
/**
|
|
* Width of the image. If not defined, will not be applied
|
|
*/
|
|
@Input() width: string = '';
|
|
/**
|
|
* Height of the image. If not defined, will not be applied
|
|
*/
|
|
@Input() height: string = '';
|
|
/**
|
|
* Max Width of the image. If not defined, will not be applied
|
|
*/
|
|
@Input() maxWidth: string = '';
|
|
/**
|
|
* Max Height of the image. If not defined, will not be applied
|
|
*/
|
|
@Input() maxHeight: string = '';
|
|
/**
|
|
* Border Radius of the image. If not defined, will not be applied
|
|
*/
|
|
@Input() borderRadius: string = '';
|
|
|
|
@ViewChild('img', {static: true}) imgElem!: ElementRef<HTMLImageElement>;
|
|
|
|
private readonly onDestroy = new Subject<void>();
|
|
|
|
constructor(public imageService: ImageService, private renderer: Renderer2, private hubService: MessageHubService) {
|
|
this.hubService.messages$.pipe(takeUntil(this.onDestroy)).subscribe(res => {
|
|
if (res.event === EVENTS.CoverUpdate) {
|
|
const updateEvent = res.payload as CoverUpdateEvent;
|
|
if (this.imageUrl === undefined || this.imageUrl === null || this.imageUrl === '') return;
|
|
const enityType = this.imageService.getEntityTypeFromUrl(this.imageUrl);
|
|
if (enityType === updateEvent.entityType) {
|
|
const tokens = this.imageUrl.split('?')[1].split('&random=');
|
|
|
|
//...seriesId=123&random=
|
|
const id = tokens[0].replace(enityType + 'Id=', '');
|
|
if (id === (updateEvent.id + '')) {
|
|
console.log('Image url: ', this.imageUrl, ' matches update event: ', updateEvent);
|
|
this.imageUrl = this.imageService.randomize(this.imageUrl);
|
|
}
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
ngOnChanges(changes: SimpleChanges): void {
|
|
if (this.width != '') {
|
|
this.renderer.setStyle(this.imgElem.nativeElement, 'width', this.width);
|
|
}
|
|
|
|
if (this.height != '') {
|
|
this.renderer.setStyle(this.imgElem.nativeElement, 'height', this.height);
|
|
}
|
|
|
|
if (this.maxWidth != '') {
|
|
this.renderer.setStyle(this.imgElem.nativeElement, 'max-width', this.maxWidth);
|
|
}
|
|
|
|
if (this.maxHeight != '') {
|
|
this.renderer.setStyle(this.imgElem.nativeElement, 'max-height', this.maxHeight);
|
|
}
|
|
|
|
if (this.borderRadius != '') {
|
|
this.renderer.setStyle(this.imgElem.nativeElement, 'border-radius', this.borderRadius);
|
|
}
|
|
}
|
|
|
|
ngOnDestroy() {
|
|
this.onDestroy.next();
|
|
this.onDestroy.complete();
|
|
}
|
|
|
|
}
|