Cutlery/Kavita
1
0
Fork 0
mirror of https://github.com/Kareadita/Kavita.git synced 2025-06-23 15:30:34 -04:00
Code Issues Packages Projects Releases Wiki Activity

Reader Changes (#600)

Browse Source 
* After first page load, attempt to switch the fit based on Automatic scaling and image ratio compared to the screen size.

* Inform user that pressing save on mobile will reset margin and they don't have to press save.
This commit is contained in:
Joseph Milazzo 2021-09-27 06:06:35 -07:00 committed by GitHub
parent 6399e255e6
commit 403083d88a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 33 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
UI/Web/src/app/book-reader/book-reader/book-reader.component.ts
View File

@ -541,13 +541,16 @@ export class BookReaderComponent implements OnInit, AfterViewInit, OnDestroy {
}
}
resetSettings() {
resetSettings(afterSave: boolean = false) {
const windowWidth = window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;
let margin = '15%';
if (windowWidth <= 700) {
if (afterSave && this.user.preferences.bookReaderMargin !== 0) {
this.toastr.info('Margin will be reset to 0% on mobile. You do not have to save for settings to take effect.');
}
margin = '0%';
}
if (this.user) {
@ -913,7 +916,7 @@ export class BookReaderComponent implements OnInit, AfterViewInit, OnDestroy {
if (this.user) {
this.user.preferences = updatedPrefs;
}
this.resetSettings();
this.resetSettings(true);
});
}

28
UI/Web/src/app/manga-reader/manga-reader.component.ts
View File

@ -201,6 +201,10 @@ export class MangaReaderComponent implements OnInit, AfterViewInit, OnDestroy {
* A map of bookmarked pages to anything. Used for O(1) lookup time if a page is bookmarked or not.
*/
bookmarks: {[key: string]: number} = {};
/**
* Tracks if the first page is rendered or not. This is used to keep track of Automatic Scaling and adjusting decision after first page dimensions load up.
*/
firstPageRendered: boolean = false;
private readonly onDestroy = new Subject<void>();
@ -822,6 +826,30 @@ export class MangaReaderComponent implements OnInit, AfterViewInit, OnDestroy {
this.canvas.nativeElement.width = this.canvasImage.width / 2;
this.ctx.drawImage(this.canvasImage, 0, 0, this.canvasImage.width, this.canvasImage.height, -this.canvasImage.width / 2, 0, this.canvasImage.width, this.canvasImage.height);
} else {
if (!this.firstPageRendered && this.scalingOption === ScalingOption.Automatic) {
let newScale = this.generalSettingsForm.get('fittingOption')?.value;
const windowWidth = window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;
const windowHeight = window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight;
const widthRatio = windowWidth / this.canvasImage.width;
const heightRatio = windowHeight / this.canvasImage.height;
// Given that we now have image dimensions, assuming this isn't a split image,
// Try to reset one time based on who's dimension (width/height) is smaller
if (widthRatio < heightRatio) {
newScale = FITTING_OPTION.WIDTH;
} else if (widthRatio > heightRatio) {
newScale = FITTING_OPTION.HEIGHT;
}
this.generalSettingsForm.get('fittingOption')?.setValue(newScale);
this.firstPageRendered = true;
}
this.ctx.drawImage(this.canvasImage, 0, 0);
}
// Reset scroll on non HEIGHT Fits