Extract "apply reader width" check into function

This commit is contained in:
schroda
2025-01-09 02:11:44 +01:00
parent 28eb18f88c
commit 288fee590d
2 changed files with 13 additions and 9 deletions

View File

@@ -21,7 +21,7 @@ import { applyStyles } from '@/modules/core/utils/ApplyStyles.ts';
import {
isContinuousReadingMode,
isContinuousVerticalReadingMode,
isReaderWidthEditable,
shouldApplyReaderWidth,
} from '@/modules/reader/utils/ReaderSettings.utils.tsx';
import { ReaderStatePages } from '@/modules/reader/types/ReaderProgressBar.types.ts';
import { requestManager } from '@/lib/requests/RequestManager.ts';
@@ -47,8 +47,8 @@ const getPageWidth = (
}
// the image wrapper gets applied the reader width limit and therefore the images can take up 100%
if (!isImage && readerWidth?.enabled && isReaderWidthEditable(pageScaleMode)) {
return `${readerWidth.value}%`;
if (!isImage && shouldApplyReaderWidth(readerWidth, pageScaleMode)) {
return `${readerWidth?.value}%`;
}
return '100%';
@@ -90,7 +90,7 @@ export const getImagePlaceholderStyling = (
case ReaderPageScaleMode.WIDTH:
return {
...defaultStyling,
...applyStyles(readerWidth.enabled && isReaderWidthEditable(pageScaleMode), {
...applyStyles(shouldApplyReaderWidth(readerWidth, pageScaleMode), {
minWidth: minWidthForStretch,
}),
...applyStyles(shouldStretchPage, {
@@ -114,7 +114,7 @@ export const getImagePlaceholderStyling = (
case ReaderPageScaleMode.SCREEN:
return {
...defaultStyling,
...applyStyles(readerWidth.enabled && isReaderWidthEditable(pageScaleMode), {
...applyStyles(shouldApplyReaderWidth(readerWidth, pageScaleMode), {
minWidth: minWidthForStretch,
}),
...applyStyles(shouldStretchPage, {
@@ -148,10 +148,9 @@ export const getImageWidthStyling = (
const width = getPageWidth(pageScaleMode, isDoublePage, readerWidth, shouldStretchPage, isImage);
// setting the "width" of the wrapper is required for being able to properly size the image placeholders
const staticReaderWidthForWrapper = applyStyles(
!isImage && !!readerWidth?.enabled && isReaderWidthEditable(pageScaleMode),
{ width },
);
const staticReaderWidthForWrapper = applyStyles(!isImage && shouldApplyReaderWidth(readerWidth, pageScaleMode), {
width,
});
const readerWidthStretchForWrapper = applyStyles(!isImage && shouldStretchPage, { width: '100%' });
switch (pageScaleMode) {

View File

@@ -29,6 +29,11 @@ export const isOffsetDoubleSpreadPagesEditable = (readingMode: IReaderSettings['
export const isReaderWidthEditable = (pageScaleMode: IReaderSettings['pageScaleMode']): boolean =>
[ReaderPageScaleMode.WIDTH, ReaderPageScaleMode.SCREEN].includes(pageScaleMode);
export const shouldApplyReaderWidth = (
readerWidth: IReaderSettings['readerWidth'] | undefined,
pageScaleMode: IReaderSettings['pageScaleMode'],
): boolean => !!readerWidth?.enabled && isReaderWidthEditable(pageScaleMode);
export const isContinuousReadingMode = (readingMode: IReaderSettings['readingMode']): boolean =>
[ReadingMode.CONTINUOUS_VERTICAL, ReadingMode.CONTINUOUS_HORIZONTAL, ReadingMode.WEBTOON].includes(readingMode);