xref: /MusicFree/src/pages/musicDetail/components/content/albumCover/operations.tsx (revision 9677305be11b30a8953a6c14fd24375953a2309d) 
1import React from 'react';
2import {Image, Pressable, StyleSheet, View} from 'react-native';
3import rpx from '@/utils/rpx';
4import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
5import MusicSheet from '@/core/musicSheet';
6
7import Download from '@/core/download';
8import LocalMusicSheet from '@/core/localMusicSheet';
9import {ROUTE_PATH} from '@/entry/router';
10import {ImgAsset} from '@/constants/assetsConst';
11import Toast from '@/utils/toast';
12import useOrientation from '@/hooks/useOrientation';
13import {showPanel} from '@/components/panels/usePanel';
14import TrackPlayer from '@/core/trackPlayer';
15import {iconSizeConst} from '@/constants/uiConst';
16import PersistStatus from '@/core/persistStatus';
17
18export default function Operations() {
19    //briefcase-download-outline  briefcase-check-outline checkbox-marked-circle-outline
20    const musicItem = TrackPlayer.useCurrentMusic();
21    const currentQuality = TrackPlayer.useCurrentQuality();
22    const isDownloaded = LocalMusicSheet.useIsLocal(musicItem);
23
24    const rate = PersistStatus.useValue('music.rate', 100);
25    const orientation = useOrientation();
26
27    const favIndex = MusicSheet.useMusicFavIndex(musicItem);
28
29    console.log(favIndex);
30
31    return (
32        <View
33            style={[
34                style.wrapper,
35                orientation === 'horizonal'
36                    ? {
37                          marginBottom: 0,
38                      }
39                    : null,
40            ]}>
41            {favIndex !== -1 ? (
42                <Icon
43                    name="heart"
44                    size={iconSizeConst.normal}
45                    color="red"
46                    onPress={() => {
47                        MusicSheet.removeMusicByIndex('favorite', favIndex);
48                    }}
49                />
50            ) : (
51                <Icon
52                    name="heart-outline"
53                    size={iconSizeConst.normal}
54                    color="white"
55                    onPress={() => {
56                        if (musicItem) {
57                            MusicSheet.addMusic('favorite', musicItem);
58                        }
59                    }}
60                />
61            )}
62            <Pressable
63                onPress={() => {
64                    if (!musicItem) {
65                        return;
66                    }
67                    showPanel('MusicQuality', {
68                        musicItem,
69                        async onQualityPress(quality) {
70                            const changeResult =
71                                await TrackPlayer.changeQuality(quality);
72                            if (!changeResult) {
73                                Toast.warn('当前暂无此音质音乐');
74                            }
75                        },
76                    });
77                }}>
78                <Image
79                    source={ImgAsset.quality[currentQuality]}
80                    style={style.quality}
81                />
82            </Pressable>
83            <Icon
84                name={isDownloaded ? 'check-circle-outline' : 'download'}
85                size={iconSizeConst.normal}
86                color="white"
87                onPress={() => {
88                    if (musicItem && !isDownloaded) {
89                        showPanel('MusicQuality', {
90                            musicItem,
91                            async onQualityPress(quality) {
92                                Download.downloadMusic(musicItem, quality);
93                            },
94                        });
95                    }
96                }}
97            />
98            <Pressable
99                onPress={() => {
100                    if (!musicItem) {
101                        return;
102                    }
103                    showPanel('PlayRate', {
104                        async onRatePress(newRate) {
105                            if (rate !== newRate) {
106                                try {
107                                    await TrackPlayer.setRate(newRate / 100);
108                                    PersistStatus.set('music.rate', newRate);
109                                } catch {}
110                            }
111                        },
112                    });
113                }}>
114                <Image source={ImgAsset.rate[rate!]} style={style.quality} />
115            </Pressable>
116            <Icon
117                name="dots-vertical"
118                size={iconSizeConst.normal}
119                color="white"
120                onPress={() => {
121                    if (musicItem) {
122                        showPanel('MusicItemOptions', {
123                            musicItem: musicItem,
124                            from: ROUTE_PATH.MUSIC_DETAIL,
125                        });
126                    }
127                }}
128            />
129        </View>
130    );
131}
132
133const style = StyleSheet.create({
134    wrapper: {
135        width: '100%',
136        height: rpx(80),
137        marginBottom: rpx(24),
138        flexDirection: 'row',
139        alignItems: 'center',
140        justifyContent: 'space-around',
141    },
142    quality: {
143        width: rpx(52),
144        height: rpx(52),
145    },
146});
147