diff --git a/ios/JellyfinAudioPlayer.xcodeproj/project.pbxproj b/ios/JellyfinAudioPlayer.xcodeproj/project.pbxproj index c487b4e..bfa9e5b 100644 --- a/ios/JellyfinAudioPlayer.xcodeproj/project.pbxproj +++ b/ios/JellyfinAudioPlayer.xcodeproj/project.pbxproj @@ -41,7 +41,7 @@ 13B07FB71A68108700A75B9A /* main.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = main.m; path = JellyfinAudioPlayer/main.m; sourceTree = ""; }; 2710519FCC41B05FDE6738DF /* Pods-JellyfinAudioPlayer.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-JellyfinAudioPlayer.release.xcconfig"; path = "Target Support Files/Pods-JellyfinAudioPlayer/Pods-JellyfinAudioPlayer.release.xcconfig"; sourceTree = ""; }; 39572B38534BBDBB596C8C95 /* Pods-JellyfinAudioPlayer-JellyfinAudioPlayerTests.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-JellyfinAudioPlayer-JellyfinAudioPlayerTests.release.xcconfig"; path = "Target Support Files/Pods-JellyfinAudioPlayer-JellyfinAudioPlayerTests/Pods-JellyfinAudioPlayer-JellyfinAudioPlayerTests.release.xcconfig"; sourceTree = ""; }; - 4B4A0465FF364579B28CF5D7 /* Inter-VariableFont_slnt,wght.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = undefined; includeInIndex = 0; lastKnownFileType = unknown; name = "Inter-VariableFont_slnt,wght.ttf"; path = "../src/assets/fonts/Inter-VariableFont_slnt,wght.ttf"; sourceTree = ""; }; + 4B4A0465FF364579B28CF5D7 /* Inter-VariableFont_slnt,wght.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = unknown; name = "Inter-VariableFont_slnt,wght.ttf"; path = "../src/assets/fonts/Inter-VariableFont_slnt,wght.ttf"; sourceTree = ""; }; 4FA1B23B2550A94B007A035E /* JellyfinAudioPlayer-Bridging-Header.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = "JellyfinAudioPlayer-Bridging-Header.h"; sourceTree = ""; }; 4FA1B23C2550A94C007A035E /* File.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = File.swift; sourceTree = ""; }; 590BEA7DE65819C5B5FDAD06 /* Pods-JellyfinAudioPlayer-tvOSTests.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-JellyfinAudioPlayer-tvOSTests.release.xcconfig"; path = "Target Support Files/Pods-JellyfinAudioPlayer-tvOSTests/Pods-JellyfinAudioPlayer-tvOSTests.release.xcconfig"; sourceTree = ""; }; @@ -176,7 +176,6 @@ 4B4A0465FF364579B28CF5D7 /* Inter-VariableFont_slnt,wght.ttf */, ); name = Resources; - path = ""; sourceTree = ""; }; /* End PBXGroup section */ @@ -214,7 +213,6 @@ 13B07F8E1A680F5B00A75B9A /* Resources */, 00DD1BFF1BD5951E006B06BC /* Bundle React Native code and images */, B9FB8FC65CEFF9AFAC71127E /* [CP] Copy Pods Resources */, - 1DC46C84C90B4D84A18AC142 /* Upload Debug Symbols to Sentry */, 2917566AA57EE087FC9FCCE9 /* [CP] Embed Pods Frameworks */, ); buildRules = ( @@ -302,21 +300,7 @@ ); runOnlyForDeploymentPostprocessing = 0; shellPath = /bin/sh; - shellScript = "export SENTRY_PROPERTIES=sentry.properties\nexport EXTRA_PACKAGER_ARGS=\"--sourcemap-output $DERIVED_FILE_DIR/main.jsbundle.map\"\nexport NODE_BINARY=$(which node)\n../node_modules/@sentry/cli/bin/sentry-cli react-native xcode ../node_modules/react-native/scripts/react-native-xcode.sh\n"; - }; - 1DC46C84C90B4D84A18AC142 /* Upload Debug Symbols to Sentry */ = { - isa = PBXShellScriptBuildPhase; - buildActionMask = 2147483647; - files = ( - ); - inputPaths = ( - ); - name = "Upload Debug Symbols to Sentry"; - outputPaths = ( - ); - runOnlyForDeploymentPostprocessing = 0; - shellPath = /bin/sh; - shellScript = "export SENTRY_PROPERTIES=sentry.properties\n../node_modules/@sentry/cli/bin/sentry-cli upload-dsym"; + shellScript = "set -e\n\nexport NODE_BINARY=node\n../node_modules/react-native/scripts/react-native-xcode.sh\n"; }; 2917566AA57EE087FC9FCCE9 /* [CP] Embed Pods Frameworks */ = { isa = PBXShellScriptBuildPhase; diff --git a/package-lock.json b/package-lock.json index f96afa8..0abc9b8 100644 --- a/package-lock.json +++ b/package-lock.json @@ -45,7 +45,7 @@ "react-native-shadow-2": "^6.0.5", "react-native-svg": "^12.3.0", "react-native-svg-transformer": "^1.0.0", - "react-native-track-player": "^2.2.0-rc3", + "react-native-track-player": "^2.1.3", "react-native-webview": "^11.18.2", "react-redux": "^7.2.6", "redux": "^4.2.0", @@ -14509,9 +14509,9 @@ } }, "node_modules/react-native-track-player": { - "version": "2.2.0-rc3", - "resolved": "https://registry.npmjs.org/react-native-track-player/-/react-native-track-player-2.2.0-rc3.tgz", - "integrity": "sha512-Pvmum3MQ5PE8/yOIIPsk00zZk3EzdocUuVUwuBKSCmdKK/3O9YhnZRC3EuT59XCDm23pZZJZDSR44VeXN6Gamg==", + "version": "2.1.3", + "resolved": "https://registry.npmjs.org/react-native-track-player/-/react-native-track-player-2.1.3.tgz", + "integrity": "sha512-JWKFRu+hr1ECN339RH+c+XDM7HfwvdvS4H1p4cJbhg/9b1CQGPJSrYXEhYkngN0msoxBxAjFyFIhjT2fWDCltA==", "peerDependencies": { "react": ">=16.8.6", "react-native": ">=0.60.0-rc.2", @@ -28865,9 +28865,9 @@ } }, "react-native-track-player": { - "version": "2.2.0-rc3", - "resolved": "https://registry.npmjs.org/react-native-track-player/-/react-native-track-player-2.2.0-rc3.tgz", - "integrity": "sha512-Pvmum3MQ5PE8/yOIIPsk00zZk3EzdocUuVUwuBKSCmdKK/3O9YhnZRC3EuT59XCDm23pZZJZDSR44VeXN6Gamg==", + "version": "2.1.3", + "resolved": "https://registry.npmjs.org/react-native-track-player/-/react-native-track-player-2.1.3.tgz", + "integrity": "sha512-JWKFRu+hr1ECN339RH+c+XDM7HfwvdvS4H1p4cJbhg/9b1CQGPJSrYXEhYkngN0msoxBxAjFyFIhjT2fWDCltA==", "requires": {} }, "react-native-webview": { diff --git a/package.json b/package.json index 2df2cf3..ba794b9 100644 --- a/package.json +++ b/package.json @@ -49,7 +49,7 @@ "react-native-shadow-2": "^6.0.5", "react-native-svg": "^12.3.0", "react-native-svg-transformer": "^1.0.0", - "react-native-track-player": "^2.2.0-rc3", + "react-native-track-player": "^2.1.3", "react-native-webview": "^11.18.2", "react-redux": "^7.2.6", "redux": "^4.2.0", diff --git a/src/components/App.tsx b/src/components/App.tsx index f56b808..af030b0 100644 --- a/src/components/App.tsx +++ b/src/components/App.tsx @@ -12,7 +12,6 @@ import { import { useColorScheme } from 'react-native'; import { ColorSchemeContext, themes } from './Colors'; import DownloadManager from './DownloadManager'; -import { GestureHandlerRootView } from 'react-native-gesture-handler'; // import ErrorReportingAlert from 'utility/ErrorReportingAlert'; export default function App(): JSX.Element { @@ -43,10 +42,8 @@ export default function App(): JSX.Element { - - - - + + diff --git a/src/screens/Music/index.tsx b/src/screens/Music/index.tsx index 6f0a957..3b7daf9 100644 --- a/src/screens/Music/index.tsx +++ b/src/screens/Music/index.tsx @@ -1,5 +1,6 @@ import React from 'react'; import { createStackNavigator } from '@react-navigation/stack'; +import { GestureHandlerRootView } from 'react-native-gesture-handler'; import { MusicStackParams } from './types'; import Albums from './stacks/Albums'; import Album from './stacks/Album'; @@ -17,7 +18,7 @@ function MusicStack() { const defaultStyles = useDefaultStyles(); return ( - <> + - + ); } diff --git a/src/screens/modals/Player/components/ProgressBar.tsx b/src/screens/modals/Player/components/ProgressBar.tsx index d925a5d..0405843 100644 --- a/src/screens/modals/Player/components/ProgressBar.tsx +++ b/src/screens/modals/Player/components/ProgressBar.tsx @@ -20,9 +20,11 @@ import Reanimated, { import ReText from 'components/ReText'; const DRAG_HANDLE_SIZE = 20; +const PADDING_TOP = 14; const Container = styled.View` - margin-top: 28px; + padding-top: ${PADDING_TOP}px; + margin-top: ${PADDING_TOP}px; `; const NumberBar = styled.View` @@ -43,7 +45,7 @@ const DragHandle = styled(Reanimated.View)` background-color: ${THEME_COLOR}; position: absolute; left: -${DRAG_HANDLE_SIZE / 2}px; - top: -${DRAG_HANDLE_SIZE / 2 - 2.5}px; + top: ${PADDING_TOP - DRAG_HANDLE_SIZE / 2 + 2.5}px; z-index: 14; `; @@ -90,9 +92,13 @@ function ProgressBar() { } }, [pos, dur]); - const gesture = Gesture.Pan() - .onBegin(() => { + const pan = Gesture.Pan() + .minDistance(1) + .activeOffsetX(1) + .activeOffsetY(1) + .onBegin((e) => { isDragging.value = true; + offset.value = Math.min(Math.max(DRAG_HANDLE_SIZE / 2, e.x), width.value - DRAG_HANDLE_SIZE / 2); }).onUpdate((e) => { offset.value = Math.min(Math.max(DRAG_HANDLE_SIZE / 2, e.x), width.value - DRAG_HANDLE_SIZE / 2); }).onFinalize(() => { @@ -100,11 +106,22 @@ function ProgressBar() { isDragging.value = false; runOnJS(TrackPlayer.seekTo)(pos.value); }); + const tap = Gesture.Tap() + .onBegin((e) => { + isDragging.value = true; + offset.value = Math.min(Math.max(DRAG_HANDLE_SIZE / 2, e.x), width.value - DRAG_HANDLE_SIZE / 2); + }).onFinalize(() => { + pos.value = (offset.value - DRAG_HANDLE_SIZE / 2) / (width.value - DRAG_HANDLE_SIZE) * dur.value; + isDragging.value = false; + runOnJS(TrackPlayer.seekTo)(pos.value); + }); + const gesture = Gesture.Exclusive(tap, pan); useEffect(() => { pos.value = position; buf.value = buffered; dur.value = duration; + // eslint-disable-next-line react-hooks/exhaustive-deps }, [position, buffered, duration]); const dragHandleStyles = useAnimatedStyle(() => { @@ -112,7 +129,7 @@ function ProgressBar() { transform: [ { translateX: offset.value }, { - scale: withTiming(isDragging.value ? 1 : 0.05, { + scale: withTiming(isDragging.value ? 1 : 0, { duration: 100, easing: Easing.out(Easing.ease), }) @@ -158,29 +175,27 @@ function ProgressBar() { }); return ( - { width.value = e.nativeEvent.layout.width; }}> - - <> - - - - - - - - - - - - - + + { width.value = e.nativeEvent.layout.width; }}> + + + + + + + + + + + + ); } diff --git a/src/screens/modals/Player/index.tsx b/src/screens/modals/Player/index.tsx index e545e3f..43c6ae9 100644 --- a/src/screens/modals/Player/index.tsx +++ b/src/screens/modals/Player/index.tsx @@ -7,6 +7,7 @@ import Queue from './components/Queue'; import useDefaultStyles from 'components/Colors'; import ConnectionNotice from './components/ConnectionNotice'; import { ScrollView } from 'react-native-gesture-handler'; +import { GestureHandlerRootView } from 'react-native-gesture-handler'; const styles = StyleSheet.create({ inner: { @@ -18,12 +19,14 @@ export default function Player() { const defaultStyles = useDefaultStyles(); return ( - - - - - - - + + + + + + + + + ); } \ No newline at end of file