|
@@ -1,52 +1,41 @@
|
|
|
-import { useEffect, useState } from "react"
|
|
|
-import { connect } from "react-redux"
|
|
|
-import { actionTrackPlay, actionTrackPause } from "../actions"
|
|
|
+// import { useEffect, useState } from "react"
|
|
|
+// import { connect } from "react-redux"
|
|
|
+// import { actionTrackPlay, actionTrackPause } from "../actions"
|
|
|
|
|
|
|
|
|
-const Playerbar = ({player}) => {
|
|
|
- let [_player, setPlayer] = useState()
|
|
|
+// const Playerbar = ({player}) => {
|
|
|
+// let [_player, setPlayer] = useState()
|
|
|
|
|
|
- useEffect(()=> {
|
|
|
- console.log(Boolean(_player) , _player)
|
|
|
- //console.log('PLAYERBAR', player, _player)
|
|
|
- setPlayer(player)
|
|
|
- },[player])
|
|
|
+// useEffect(()=> {
|
|
|
+// console.log(Boolean(_player) , _player)
|
|
|
+// //console.log('PLAYERBAR', player, _player)
|
|
|
+// setPlayer(player)
|
|
|
+// },[player, _player])
|
|
|
|
|
|
- return (
|
|
|
- <footer style={{display: `${_player?.track? 'block':'none'}`}}>
|
|
|
- <div>
|
|
|
- <button>{`<<`}</button>
|
|
|
- <button onClick={() => {
|
|
|
- if(_player) {
|
|
|
- console.log('PLAYE', _player.track, _player.trackInfo)
|
|
|
- if(!_player.isPaused) {
|
|
|
- console.log('player play')
|
|
|
- actionTrackPause(_player.track, _player.trackInfo)
|
|
|
- }
|
|
|
- if(_player.isPaused) {
|
|
|
- console.log('player pause')
|
|
|
- actionTrackPlay(_player.track, _player.trackInfo)
|
|
|
- }
|
|
|
- }
|
|
|
- }}>
|
|
|
- {_player?.isPaused? `>` : `||`}
|
|
|
- </button>
|
|
|
- <button>{`>>`}</button>
|
|
|
- <input type="range" />
|
|
|
- </div>
|
|
|
+// return (
|
|
|
+// <footer style={{display: `${_player?.track? 'block':'none'}`}}>
|
|
|
+// <div>
|
|
|
+// <button>{`<<`}</button>
|
|
|
+// {_player?.isPaused?
|
|
|
+// <button onClick={() => actionTrackPlay(_player.track, _player.trackInfo)}>{`>`}</button> :
|
|
|
+// <button onClick={() => actionTrackPause(_player.track, _player.trackInfo)}>{`| |`}</button>
|
|
|
+// }
|
|
|
+// <button>{`>>`}</button>
|
|
|
+// <input type="range" />
|
|
|
+// </div>
|
|
|
|
|
|
- {_player? (_player.trackInfo?.id3?.artist && _player.trackInfo?.id3?.title ?
|
|
|
- <small>`${_player.trackInfo?.id3?.artist} - ${_player.trackInfo?.id3?.title}`</small>:
|
|
|
- <small>{_player.trackInfo?.originalFileName}</small>): ''}
|
|
|
+// {_player? (_player.trackInfo?.id3?.artist && _player.trackInfo?.id3?.title ?
|
|
|
+// <small>`${_player.trackInfo?.id3?.artist} - ${_player.trackInfo?.id3?.title}`</small> :
|
|
|
+// <small>{_player.trackInfo?.originalFileName}</small>) : ''}
|
|
|
|
|
|
- </footer>
|
|
|
- )
|
|
|
-}
|
|
|
+// </footer>
|
|
|
+// )
|
|
|
+// }
|
|
|
|
|
|
-export const PlayerbarConnect = connect(
|
|
|
- state => ({player: state.player || {}}),
|
|
|
- {
|
|
|
- playTrack: actionTrackPlay,
|
|
|
- pauseTrack: actionTrackPause
|
|
|
- }
|
|
|
-)(Playerbar)
|
|
|
+// export const PlayerbarConnect = connect(
|
|
|
+// state => ({player: state.player || {}}),
|
|
|
+// {
|
|
|
+// playTrack: actionTrackPlay,
|
|
|
+// pauseTrack: actionTrackPause
|
|
|
+// }
|
|
|
+// )(Playerbar)
|