diff --git a/src/redux/settings/settings.reducer.js b/src/redux/settings/settings.reducer.js
index 05e45339..0edc9349 100644
--- a/src/redux/settings/settings.reducer.js
+++ b/src/redux/settings/settings.reducer.js
@@ -75,6 +75,8 @@ const initialState = {
showLabelsInNav: false,
useWebViewForChapter: false,
showBatteryAndTime: false,
+ autoScroll: false,
+ autoScrollInterval: 10,
};
const settingsReducer = (state = initialState, action) => {
diff --git a/src/screens/Chapter/Chapter.js b/src/screens/Chapter/Chapter.js
index d366e269..91d1b796 100644
--- a/src/screens/Chapter/Chapter.js
+++ b/src/screens/Chapter/Chapter.js
@@ -6,6 +6,7 @@ import {
StatusBar,
ScrollView,
TouchableWithoutFeedback,
+ Dimensions,
} from "react-native";
import { useDispatch } from "react-redux";
@@ -83,6 +84,8 @@ const Chapter = ({ route, navigation }) => {
textSelectable = false,
useWebViewForChapter = false,
showBatteryAndTime = false,
+ autoScroll = false,
+ autoScrollInterval = 10,
} = useSettings();
const batteryLevel = useBatteryLevel();
@@ -170,6 +173,26 @@ const Chapter = ({ route, navigation }) => {
}, 60000);
}, []);
+ const [currentOffset, setCurrentOffset] = useState(position?.position || 0);
+
+ useEffect(
+ () =>
+ setTimeout(() => {
+ if (scrollPercentage !== 100 && autoScroll) {
+ console.log("Called");
+ scrollViewRef.current.scrollTo({
+ x: 0,
+ y: currentOffset + Dimensions.get("window").height,
+ animated: true,
+ });
+ setCurrentOffset(
+ (prevState) =>
+ prevState + Dimensions.get("window").height
+ );
+ }
+ }, autoScrollInterval * 1000)[(autoScroll, currentOffset)]
+ );
+
const isCloseToBottom = useCallback(
({ layoutMeasurement, contentOffset, contentSize }) => {
const paddingToBottom = 40;
@@ -299,6 +322,10 @@ const Chapter = ({ route, navigation }) => {
);
};
+ const enableAutoScroll = () => {
+ dispatch(setAppSettings("autoScroll", !autoScroll));
+ };
+
const enableWebView = () =>
dispatch(setAppSettings("useWebViewForChapter", !useWebViewForChapter));
@@ -490,6 +517,7 @@ const Chapter = ({ route, navigation }) => {
navigation={navigation}
bottomSheetRef={readerSheetRef}
selectText={textSelectable}
+ autoScroll={autoScroll}
useWebViewForChapter={useWebViewForChapter}
showScrollPercentage={showScrollPercentage}
showBatteryAndTime={showBatteryAndTime}
@@ -515,11 +543,13 @@ const Chapter = ({ route, navigation }) => {
nextChapter={nextChapter}
prevChapter={prevChapter}
hide={hidden}
+ autoScroll={autoScroll}
useWebViewForChapter={useWebViewForChapter}
navigateToNextChapter={navigateToNextChapter}
navigateToPrevChapter={navigateToPrevChapter}
readerSheetRef={readerSheetRef}
scrollViewRef={scrollViewRef}
+ enableAutoScroll={enableAutoScroll}
/>
{(showScrollPercentage || showBatteryAndTime) && (
{
const rippleConfig = {
color: theme.rippleColor,
@@ -23,6 +26,8 @@ const ChapterFooter = ({
radius: 50,
};
+ const insets = useSafeAreaInsets();
+
return (
{!useWebViewForChapter && (
- scrollViewRef.current.scrollTo({})}
- >
-
-
+ <>
+
+
+
+ scrollViewRef.current.scrollTo({})}
+ >
+
+
+ >
)}
{/* {
@@ -401,6 +402,30 @@ const ReaderSheet = ({
color={theme.colorAccent}
/>
+
+ dispatch(setAppSettings("autoScroll", !autoScroll))
+ }
+ >
+
+ AutoScroll
+
+
+ dispatch(
+ setAppSettings("autoScroll", !autoScroll)
+ )
+ }
+ color={theme.colorAccent}
+ />
+
{
{ value: "right", icon: "format-align-right" },
];
+ const { autoScrollInterval = 10 } = useSettings();
+
/**
* Reader Background Color Modal
*/
@@ -230,6 +239,26 @@ const FirstRoute = React.memo(({ theme, dispatch, reader }) => {
+
+ Auto scroll interval (in seconds)
+
+
+
+ dispatch(
+ setAppSettings(
+ "autoScrollInterval",
+ parseInt(text)
+ )
+ )
+ }
+ />
+