better/shared list player controls w/shuffle

also faked download list/song (by star for now, also faked)
This commit is contained in:
austinried
2021-07-23 17:46:29 +09:00
parent 4f69b36c7b
commit 1ed9ac0870
5 changed files with 128 additions and 27 deletions

View File

@@ -1,7 +1,7 @@
import Button from '@app/components/Button'
import CoverArt from '@app/components/CoverArt'
import GradientBackground from '@app/components/GradientBackground'
import ImageGradientScrollView from '@app/components/ImageGradientScrollView'
import ListPlayerControls from '@app/components/ListPlayerControls'
import NothingHere from '@app/components/NothingHere'
import SongItem from '@app/components/SongItem'
import { albumAtomFamily } from '@app/state/music'
@@ -25,10 +25,7 @@ const AlbumDetails: React.FC<{
const Songs = () => (
<>
<View style={styles.controls}>
<Button title="Play Album" onPress={() => setQueue(album.songs, album.name, undefined, false)} />
<Button title="Shuffle" onPress={() => setQueue(album.songs, album.name, undefined, true)} />
</View>
<ListPlayerControls songs={album.songs} typeName="Album" queueName={album.name} />
<View style={styles.songs}>
{album.songs
.sort((a, b) => {
@@ -114,9 +111,6 @@ const styles = StyleSheet.create({
height: 220,
width: 220,
},
controls: {
flexDirection: 'row',
},
songs: {
marginTop: 26,
marginBottom: 30,

View File

@@ -1,7 +1,7 @@
import Button from '@app/components/Button'
import CoverArt from '@app/components/CoverArt'
import GradientBackground from '@app/components/GradientBackground'
import ImageGradientScrollView from '@app/components/ImageGradientScrollView'
import ListPlayerControls from '@app/components/ListPlayerControls'
import NothingHere from '@app/components/NothingHere'
import SongItem from '@app/components/SongItem'
import { playlistAtomFamily } from '@app/state/music'
@@ -25,9 +25,12 @@ const PlaylistDetails: React.FC<{
const Songs = () => (
<>
<View style={styles.controls}>
<Button title="Play Playlist" onPress={() => setQueue(playlist.songs, playlist.name)} />
</View>
<ListPlayerControls
songs={playlist.songs}
typeName="Playlist"
queueName={playlist.name}
style={styles.controls}
/>
<View style={styles.songs}>
{playlist.songs.map((s, i) => (
<SongItem key={i} song={s} showArt={true} onPress={() => setQueue(playlist.songs, playlist.name, i)} />
@@ -107,7 +110,6 @@ const styles = StyleSheet.create({
alignItems: 'center',
},
controls: {
flexDirection: 'row',
marginTop: 20,
},
songs: {