diff --git a/apps/expo/src/components/player/BottomControls.tsx b/apps/expo/src/components/player/BottomControls.tsx index de33acb..be6c49c 100644 --- a/apps/expo/src/components/player/BottomControls.tsx +++ b/apps/expo/src/components/player/BottomControls.tsx @@ -6,6 +6,7 @@ import { Text } from "../ui/Text"; import { AudioTrackSelector } from "./AudioTrackSelector"; import { CaptionsSelector } from "./CaptionsSelector"; import { Controls } from "./Controls"; +import { PlaybackSpeedSelector } from "./PlaybackSpeedSelector"; import { ProgressBar } from "./ProgressBar"; import { SeasonSelector } from "./SeasonEpisodeSelector"; import { SourceSelector } from "./SourceSelector"; @@ -62,6 +63,7 @@ export const BottomControls = () => { + ); diff --git a/apps/expo/src/components/player/PlaybackSpeedSelector.tsx b/apps/expo/src/components/player/PlaybackSpeedSelector.tsx new file mode 100644 index 0000000..9cc8ca1 --- /dev/null +++ b/apps/expo/src/components/player/PlaybackSpeedSelector.tsx @@ -0,0 +1,71 @@ +import { Pressable, ScrollView, View } from "react-native"; +import Modal from "react-native-modal"; +import { MaterialCommunityIcons } from "@expo/vector-icons"; + +import colors from "@movie-web/tailwind-config/colors"; + +import { usePlaybackSpeed } from "~/hooks/player/usePlaybackSpeed"; +import { useBoolean } from "~/hooks/useBoolean"; +import { Button } from "../ui/Button"; +import { Text } from "../ui/Text"; +import { Controls } from "./Controls"; + +export const PlaybackSpeedSelector = () => { + const { currentSpeed, changePlaybackSpeed } = usePlaybackSpeed(); + const { isTrue, on, off } = useBoolean(); + + const speeds = [0.5, 0.75, 1, 1.25, 1.5, 1.75, 2]; + + return ( + + +