ChoChoX/suwayomi-material-you-webui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Extract "apply reader width" check into function

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files

17
src/modules/reader/utils/ReaderPager.utils.tsx
View File

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

5
src/modules/reader/utils/ReaderSettings.utils.tsx
View File

@@ -29,6 +29,11 @@ export const isOffsetDoubleSpreadPagesEditable = (readingMode: IReaderSettings['
export const isReaderWidthEditable = (pageScaleMode: IReaderSettings['pageScaleMode']): boolean => export const isReaderWidthEditable = (pageScaleMode: IReaderSettings['pageScaleMode']): boolean =>
[ReaderPageScaleMode.WIDTH, ReaderPageScaleMode.SCREEN].includes(pageScaleMode); [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 => export const isContinuousReadingMode = (readingMode: IReaderSettings['readingMode']): boolean =>
[ReadingMode.CONTINUOUS_VERTICAL, ReadingMode.CONTINUOUS_HORIZONTAL, ReadingMode.WEBTOON].includes(readingMode); [ReadingMode.CONTINUOUS_VERTICAL, ReadingMode.CONTINUOUS_HORIZONTAL, ReadingMode.WEBTOON].includes(readingMode);