Release Testing Part 2 (#1794)
* Stop showing loading indicator when no next/prev chapter * Fixed a bug where manage collections wasn't named correctly in UI. * Slight tweaks on email flow * Fixed a bug where we were grabbing wrong property for book layout mode * Fixed an issue where pagination area wasn't properly spanning window on different scaling modes. * Fixed a bug where right pagination area wasn't sticking to the right hand side on original scaling * Added a note from reading an epub3 * Reworked some of the readme
This commit is contained in:
parent
2c4b94cfc3
commit
c117d8dc04
5 changed files with 40 additions and 28 deletions
|
@ -19,7 +19,7 @@ import { BookWhiteTheme } from '../../_models/book-white-theme';
|
|||
*/
|
||||
export interface PageStyle {
|
||||
'font-family': string;
|
||||
'font-size': string;
|
||||
'font-size': string;
|
||||
'line-height': string;
|
||||
'margin-left': string;
|
||||
'margin-right': string;
|
||||
|
@ -92,7 +92,7 @@ export class ReaderSettingsComponent implements OnInit, OnDestroy {
|
|||
* Outputs when immersive mode is changed
|
||||
*/
|
||||
@Output() immersiveMode: EventEmitter<boolean> = new EventEmitter();
|
||||
|
||||
|
||||
user!: User;
|
||||
/**
|
||||
* List of all font families user can select from
|
||||
|
@ -131,12 +131,12 @@ export class ReaderSettingsComponent implements OnInit, OnDestroy {
|
|||
|
||||
|
||||
|
||||
constructor(private bookService: BookService, private accountService: AccountService,
|
||||
constructor(private bookService: BookService, private accountService: AccountService,
|
||||
@Inject(DOCUMENT) private document: Document, private themeService: ThemeService,
|
||||
private readonly cdRef: ChangeDetectorRef) {}
|
||||
|
||||
ngOnInit(): void {
|
||||
|
||||
|
||||
this.fontFamilies = this.bookService.getFontFamilies();
|
||||
this.fontOptions = this.fontFamilies.map(f => f.title);
|
||||
this.cdRef.markForCheck();
|
||||
|
@ -144,7 +144,7 @@ export class ReaderSettingsComponent implements OnInit, OnDestroy {
|
|||
this.accountService.currentUser$.pipe(take(1)).subscribe(user => {
|
||||
if (user) {
|
||||
this.user = user;
|
||||
|
||||
|
||||
if (this.user.preferences.bookReaderFontFamily === undefined) {
|
||||
this.user.preferences.bookReaderFontFamily = 'default';
|
||||
}
|
||||
|
@ -161,8 +161,8 @@ export class ReaderSettingsComponent implements OnInit, OnDestroy {
|
|||
this.user.preferences.bookReaderReadingDirection = ReadingDirection.LeftToRight;
|
||||
}
|
||||
this.readingDirectionModel = this.user.preferences.bookReaderReadingDirection;
|
||||
|
||||
|
||||
|
||||
|
||||
this.settingsForm.addControl('bookReaderFontFamily', new FormControl(this.user.preferences.bookReaderFontFamily, []));
|
||||
this.settingsForm.get('bookReaderFontFamily')!.valueChanges.pipe(takeUntil(this.onDestroy)).subscribe(fontName => {
|
||||
const familyName = this.fontFamilies.filter(f => f.title === fontName)[0].family;
|
||||
|
@ -174,7 +174,7 @@ export class ReaderSettingsComponent implements OnInit, OnDestroy {
|
|||
|
||||
this.styleUpdate.emit(this.pageStyles);
|
||||
});
|
||||
|
||||
|
||||
this.settingsForm.addControl('bookReaderFontSize', new FormControl(this.user.preferences.bookReaderFontSize, []));
|
||||
this.settingsForm.get('bookReaderFontSize')?.valueChanges.pipe(takeUntil(this.onDestroy)).subscribe(value => {
|
||||
this.pageStyles['font-size'] = value + '%';
|
||||
|
@ -211,14 +211,14 @@ export class ReaderSettingsComponent implements OnInit, OnDestroy {
|
|||
}
|
||||
this.immersiveMode.emit(immersiveMode);
|
||||
});
|
||||
|
||||
|
||||
|
||||
this.setTheme(this.user.preferences.bookReaderThemeName || this.themeService.defaultBookTheme);
|
||||
this.cdRef.markForCheck();
|
||||
|
||||
// Emit first time so book reader gets the setting
|
||||
this.readingDirection.emit(this.readingDirectionModel);
|
||||
this.clickToPaginateChanged.emit(this.user.preferences.bookReaderTapToPaginate);
|
||||
this.clickToPaginateChanged.emit(this.user.preferences.bookReaderTapToPaginate);
|
||||
this.layoutModeUpdate.emit(this.user.preferences.bookReaderLayoutMode);
|
||||
this.immersiveMode.emit(this.user.preferences.bookReaderImmersiveMode);
|
||||
|
||||
|
@ -227,7 +227,7 @@ export class ReaderSettingsComponent implements OnInit, OnDestroy {
|
|||
this.resetSettings();
|
||||
}
|
||||
|
||||
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
|
@ -243,14 +243,14 @@ export class ReaderSettingsComponent implements OnInit, OnDestroy {
|
|||
} else {
|
||||
this.setPageStyles();
|
||||
}
|
||||
|
||||
|
||||
this.settingsForm.get('bookReaderFontFamily')?.setValue(this.user.preferences.bookReaderFontFamily);
|
||||
this.settingsForm.get('bookReaderFontSize')?.setValue(this.user.preferences.bookReaderFontSize);
|
||||
this.settingsForm.get('bookReaderLineSpacing')?.setValue(this.user.preferences.bookReaderLineSpacing);
|
||||
this.settingsForm.get('bookReaderMargin')?.setValue(this.user.preferences.bookReaderMargin);
|
||||
this.settingsForm.get('bookReaderReadingDirection')?.setValue(this.user.preferences.bookReaderReadingDirection);
|
||||
this.settingsForm.get('bookReaderTapToPaginate')?.setValue(this.user.preferences.bookReaderTapToPaginate);
|
||||
this.settingsForm.get('layoutMode')?.setValue(this.user.preferences.layoutMode);
|
||||
this.settingsForm.get('bookReaderLayoutMode')?.setValue(this.user.preferences.bookReaderLayoutMode);
|
||||
this.settingsForm.get('bookReaderImmersiveMode')?.setValue(this.user.preferences.bookReaderImmersiveMode);
|
||||
this.cdRef.detectChanges();
|
||||
this.styleUpdate.emit(this.pageStyles);
|
||||
|
@ -263,7 +263,7 @@ export class ReaderSettingsComponent implements OnInit, OnDestroy {
|
|||
const windowWidth = window.innerWidth
|
||||
|| this.document.documentElement.clientWidth
|
||||
|| this.document.body.clientWidth;
|
||||
|
||||
|
||||
|
||||
let defaultMargin = '15%';
|
||||
if (windowWidth <= mobileBreakpointMarginOverride) {
|
||||
|
|
|
@ -44,7 +44,7 @@
|
|||
<!-- Pagination controls and screen hints-->
|
||||
<div class="pagination-area">
|
||||
<div class="{{readerMode === ReaderMode.LeftRight ? 'left' : 'top'}} {{clickOverlayClass('left')}}" (click)="handlePageChange($event, KeyDirection.Left)"
|
||||
[ngStyle]="{'height': (readerMode === ReaderMode.LeftRight ? ImageHeight: '25%')}">
|
||||
[ngStyle]="{'height': (readerMode === ReaderMode.LeftRight ? ImageHeight: '25%'), 'max-height': MaxHeight}">
|
||||
<div *ngIf="showClickOverlay">
|
||||
<i class="fa fa-angle-{{readingDirection === ReadingDirection.RightToLeft ? 'double-' : ''}}{{readerMode === ReaderMode.LeftRight ? 'left' : 'up'}}"
|
||||
title="Previous Page" aria-hidden="true"></i>
|
||||
|
@ -53,7 +53,8 @@
|
|||
<div class="{{readerMode === ReaderMode.LeftRight ? 'right' : 'bottom'}} {{clickOverlayClass('right')}}" (click)="handlePageChange($event, KeyDirection.Right)"
|
||||
[ngStyle]="{'height': (readerMode === ReaderMode.LeftRight ? ImageHeight: '25%'),
|
||||
'left': 'inherit',
|
||||
'right': RightPaginationOffset + 'px'}">
|
||||
'right': RightPaginationOffset + 'px',
|
||||
'max-height': MaxHeight}">
|
||||
<div *ngIf="showClickOverlay">
|
||||
<i class="fa fa-angle-{{readingDirection === ReadingDirection.LeftToRight ? 'double-' : ''}}{{readerMode === ReaderMode.LeftRight ? 'right' : 'down'}}"
|
||||
title="Next Page" aria-hidden="true"></i>
|
||||
|
|
|
@ -370,12 +370,22 @@ export class MangaReaderComponent implements OnInit, AfterViewInit, OnDestroy {
|
|||
}
|
||||
|
||||
get ImageHeight() {
|
||||
if (this.FittingOption !== FITTING_OPTION.HEIGHT) return this.mangaReaderService.getPageDimensions(this.pageNum)?.height + 'px';
|
||||
if (this.FittingOption !== FITTING_OPTION.HEIGHT) {
|
||||
return this.mangaReaderService.getPageDimensions(this.pageNum)?.height + 'px';
|
||||
}
|
||||
return this.readingArea?.nativeElement?.clientHeight + 'px';
|
||||
}
|
||||
|
||||
// This is for the pagination area
|
||||
get MaxHeight() {
|
||||
if (this.FittingOption !== FITTING_OPTION.HEIGHT) {
|
||||
return this.mangaReaderService.getPageDimensions(this.pageNum)?.height + 'px';
|
||||
}
|
||||
return 'calc(var(--vh) * 100)';
|
||||
}
|
||||
|
||||
get RightPaginationOffset() {
|
||||
if (this.readerMode === ReaderMode.LeftRight && this.FittingOption === FITTING_OPTION.HEIGHT) {
|
||||
if (this.readerMode === ReaderMode.LeftRight && this.FittingOption !== FITTING_OPTION.WIDTH) {
|
||||
return (this.readingArea?.nativeElement?.scrollLeft || 0) * -1;
|
||||
}
|
||||
return 0;
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue