From 3c969c2972b3d224ae3023f5a423a6a51b094cf0 Mon Sep 17 00:00:00 2001 From: austinried <4966622+austinried@users.noreply.github.com> Date: Sun, 4 Jul 2021 14:27:25 +0900 Subject: [PATCH] started player controls --- res/next-fill.png | Bin 0 -> 8375 bytes res/pause_circle-fill.png | Bin 0 -> 12106 bytes res/play_circle-fill.png | Bin 0 -> 12163 bytes res/previous-fill.png | Bin 0 -> 8827 bytes src/components/NowPlayingLayout.tsx | 93 +++++++++++++++++++++++++--- src/components/TrackPlayerState.tsx | 41 +++++++++++- src/state/trackplayer.ts | 12 +++- 7 files changed, 133 insertions(+), 13 deletions(-) create mode 100644 res/next-fill.png create mode 100644 res/pause_circle-fill.png create mode 100644 res/play_circle-fill.png create mode 100644 res/previous-fill.png diff --git a/res/next-fill.png b/res/next-fill.png new file mode 100644 index 0000000000000000000000000000000000000000..46bc7130607d851c18c03e3794a7003c5bc5aa37 GIT binary patch literal 8375 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 literal 0 HcmV?d00001 diff --git a/res/play_circle-fill.png b/res/play_circle-fill.png new file mode 100644 index 0000000000000000000000000000000000000000..db9d664d31cc437638c48c3301bcaf92906b7881 GIT binary patch literal 12163 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 literal 0 HcmV?d00001 diff --git a/res/previous-fill.png b/res/previous-fill.png new file mode 100644 index 0000000000000000000000000000000000000000..328112b55bdf0533b922fa5eb946783b0b9f6597 GIT binary patch literal 8827 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 s$o*=Lbuln7 { - {queueName} + {queueName || 'Nothing playing...'} @@ -48,16 +49,12 @@ const SongCoverArt = () => { const track = useAtomValue(currentTrackAtom); const layout = useWindowDimensions(); - const size = layout.width - layout.width / 6; + const size = layout.width - layout.width / 7; return ( ( - - Failed - - )} + PlaceholderComponent={() => } height={size} width={size} coverArtUri={track?.artwork as string} @@ -70,7 +67,7 @@ const coverArtStyles = StyleSheet.create({ container: { width: '100%', alignItems: 'center', - marginTop: 20, + marginTop: 10, }, }); @@ -104,6 +101,81 @@ const infoStyles = StyleSheet.create({ }, }); +const PlayerControls = () => { + const state = useAtomValue(playerStateAtom); + + let playPauseIcon: number; + let playPauseStyle: any; + let playPauseAction: () => void; + + switch (state) { + case State.Playing: + playPauseIcon = require('../../res/pause_circle-fill.png'); + playPauseStyle = controlsStyles.enabled; + playPauseAction = () => TrackPlayer.pause(); + break; + case State.Paused: + playPauseIcon = require('../../res/play_circle-fill.png'); + playPauseStyle = controlsStyles.enabled; + playPauseAction = () => TrackPlayer.play(); + break; + case State.Buffering: + case State.Connecting: + playPauseIcon = require('../../res/pause_circle-fill.png'); + playPauseStyle = controlsStyles.disabled; + playPauseAction = () => {}; + break; + default: + playPauseIcon = require('../../res/play_circle-fill.png'); + playPauseStyle = controlsStyles.disabled; + playPauseAction = () => {}; + break; + } + + return ( + + + + + + + + ); +}; + +const controlsStyles = StyleSheet.create({ + container: { + width: '100%', + flexDirection: 'row', + alignItems: 'center', + justifyContent: 'center', + marginTop: 40, + }, + skip: { + height: 40, + width: 40, + marginHorizontal: 18, + }, + play: { + height: 90, + width: 90, + }, + enabled: { + opacity: 1, + }, + disabled: { + opacity: 0.35, + }, +}); + const NowPlayingLayout = () => { const track = useAtomValue(currentTrackAtom); @@ -117,6 +189,7 @@ const NowPlayingLayout = () => { + ); }; diff --git a/src/components/TrackPlayerState.tsx b/src/components/TrackPlayerState.tsx index cce06af..cfc0999 100644 --- a/src/components/TrackPlayerState.tsx +++ b/src/components/TrackPlayerState.tsx @@ -1,8 +1,8 @@ import React, { useCallback, useEffect } from 'react'; -import TrackPlayer, { Event, useTrackPlayerEvents } from 'react-native-track-player'; +import TrackPlayer, { Event, State, useTrackPlayerEvents } from 'react-native-track-player'; import { useAppState } from '@react-native-community/hooks'; import { useUpdateAtom, useAtomValue } from 'jotai/utils'; -import { currentQueueNameAtom, currentTrackAtom } from '../state/trackplayer'; +import { currentQueueNameAtom, currentTrackAtom, playerStateAtom } from '../state/trackplayer'; import { View } from 'react-native'; const CurrentTrackState = () => { @@ -67,6 +67,42 @@ const CurrentQueueName = () => { setCurrentQueueName(undefined); }, [setCurrentQueueName]); + useTrackPlayerEvents( + [Event.PlaybackState, Event.PlaybackQueueEnded, Event.PlaybackMetadataReceived, Event.RemoteDuck, Event.RemoteStop], + event => { + if (event.type === Event.PlaybackState) { + if (event.state === State.Stopped || event.state === State.None) { + return; + } + } + update(); + }, + ); + + useEffect(() => { + if (appState === 'active') { + update(); + } + }, [appState, update]); + + return <>; +}; + +const PlayerState = () => { + const setPlayerState = useUpdateAtom(playerStateAtom); + const appState = useAppState(); + + const update = useCallback( + async (state?: State) => { + setPlayerState(state || (await TrackPlayer.getState())); + }, + [setPlayerState], + ); + + useTrackPlayerEvents([Event.PlaybackState], event => { + update(event.state); + }); + useEffect(() => { if (appState === 'active') { update(); @@ -90,6 +126,7 @@ const TrackPlayerState = () => ( + ); diff --git a/src/state/trackplayer.ts b/src/state/trackplayer.ts index 46256d8..236c4cd 100644 --- a/src/state/trackplayer.ts +++ b/src/state/trackplayer.ts @@ -1,5 +1,5 @@ import { atom } from 'jotai'; -import { Track } from 'react-native-track-player'; +import { State, Track } from 'react-native-track-player'; import equal from 'fast-deep-equal'; type OptionalTrack = Track | undefined; @@ -25,3 +25,13 @@ export const currentQueueNameAtom = atom( } }, ); + +const playerState = atom(State.None); +export const playerStateAtom = atom( + get => get(playerState), + (get, set, value) => { + if (get(playerState) !== value) { + set(playerState, value); + } + }, +);