speed playback from array

This commit is contained in:
Reinaldo Neto 2023-10-23 18:40:05 -03:00
parent 0154c5a5b2
commit eb33ce3688
2 changed files with 10 additions and 8 deletions

View File

@ -4,21 +4,22 @@ import Touchable from 'react-native-platform-touchable';
import styles from './styles';
import { useTheme } from '../../theme';
import { AVAILABLE_SPEEDS } from './utils';
const PlaybackSpeed = ({
onChange,
loaded = false,
rate = 1
rateIndex = 0
}: {
onChange: (value: number) => void;
loaded: boolean;
rate: number;
rateIndex: number;
}) => {
const { colors } = useTheme();
const onPress = () => {
const nextRate = rate === 2 ? 0.5 : rate + 0.5;
onChange(nextRate);
const nextRateIndex = rateIndex >= AVAILABLE_SPEEDS.length ? 0 : rateIndex + 1;
onChange(AVAILABLE_SPEEDS[nextRateIndex]);
};
return (
@ -27,7 +28,7 @@ const PlaybackSpeed = ({
onPress={onPress}
style={[styles.containerPlaybackSpeed, { backgroundColor: colors.buttonBackgroundSecondaryDefault }]}
>
<Text style={[styles.playbackSpeedText, { color: colors.buttonFontSecondary }]}>{rate}x</Text>
<Text style={[styles.playbackSpeedText, { color: colors.buttonFontSecondary }]}>{AVAILABLE_SPEEDS[rateIndex]}x</Text>
</Touchable>
);
};

View File

@ -11,6 +11,7 @@ import Seek from './Seek';
import PlaybackSpeed from './PlaybackSpeed';
import PlayButton from './PlayButton';
import audioPlayer from '../../lib/methods/audioPlayer';
import { AVAILABLE_SPEEDS } from './utils';
interface IAudioPlayerProps {
fileUri: string;
@ -28,7 +29,7 @@ const AudioPlayer = ({
onPressCallback = () => {}
}: IAudioPlayerProps) => {
const [paused, setPaused] = useState(true);
const [rate, setRate] = useState(1);
const [rateIndex, setRateIndex] = useState(0);
const duration = useSharedValue(0);
const currentTime = useSharedValue(0);
@ -63,7 +64,7 @@ const AudioPlayer = ({
if (currentSecond <= durationSeconds) {
currentTime.value = currentSecond;
}
setRate(data.rate);
setRateIndex(AVAILABLE_SPEEDS.indexOf(data.rate));
}
};
@ -142,7 +143,7 @@ const AudioPlayer = ({
<View style={[styles.audioContainer, { backgroundColor: colors.surfaceTint, borderColor: colors.strokeExtraLight }]}>
<PlayButton disabled={disabled} loading={loading} paused={paused} isReadyToPlay={isReadyToPlay} onPress={onPress} />
<Seek currentTime={currentTime} duration={duration} loaded={!disabled && isReadyToPlay} onChangeTime={setPosition} />
<PlaybackSpeed onChange={onChangeRate} loaded={!disabled && isReadyToPlay} rate={rate} />
<PlaybackSpeed onChange={onChangeRate} loaded={!disabled && isReadyToPlay} rateIndex={rateIndex} />
</View>
</>
);