|
@@ -6,9 +6,10 @@ import {connect} from "react-redux";
|
|
|
import {actionTrackPlay, actionTrackStop,actionTrackVolume,actionTrackCurrentTime,actionNextTrack,actionPreviousTrack} from "../reducers";
|
|
|
|
|
|
|
|
|
-export const Player = ({player:{volume,duration,currentTime,isPlaying,track:{originalFileName}},
|
|
|
+export const Player = ({player:{volume,duration,currentTime,isPlaying,track={}},
|
|
|
trackPlay, trackStop,trackVolume,trackCurrentTime,trackNext,trackPrevious}) => {
|
|
|
|
|
|
+ let {originalFileName} = track
|
|
|
let minutes = Math.floor(duration / 60);
|
|
|
let seconds = Math.floor(parseInt((duration % 60) * 100) / 100);
|
|
|
|
|
@@ -18,7 +19,7 @@ export const Player = ({player:{volume,duration,currentTime,isPlaying,track:{ori
|
|
|
return (
|
|
|
<div className='Player'>
|
|
|
|
|
|
- <span>{minutesLeft}:{secondsLeft < 10?"0"+secondsLeft : secondsLeft}</span>
|
|
|
+ <span>{minutesLeft || 0}:{(secondsLeft < 10?"0"+secondsLeft : secondsLeft) || "00"}</span>
|
|
|
|
|
|
<input className='currentTime'
|
|
|
type="range"
|
|
@@ -29,7 +30,7 @@ export const Player = ({player:{volume,duration,currentTime,isPlaying,track:{ori
|
|
|
value={currentTime}/>
|
|
|
|
|
|
|
|
|
- <span>{minutes}:{seconds < 10?"0"+seconds : seconds}</span>
|
|
|
+ <span>{minutes || 0}:{(seconds < 10?"0"+seconds : seconds) || "00"}</span>
|
|
|
<button onClick={() => trackPrevious()}><img src={prev} alt='prev'/></button>
|
|
|
{!isPlaying ? ( <button onClick={() => trackPlay()}>
|
|
|
<img src={play} alt='play'/></button>) : ( <button onClick={() => trackStop()}>
|