fix audio promise error

This commit is contained in:
Zijin Xiao 2017-02-13 20:38:40 +08:00
parent 63a704e49c
commit 6e1c6a5dd1

View File

@ -40,7 +40,6 @@ class Player extends React.Component {
loop: false, loop: false,
order: false, order: false,
playIcon: 'caret-right', playIcon: 'caret-right',
percent: 0,
curTime: 0, curTime: 0,
totTime: 0, totTime: 0,
data: [], data: [],
@ -57,7 +56,7 @@ class Player extends React.Component {
this.audio = document.getElementsByTagName('audio')[0]; this.audio = document.getElementsByTagName('audio')[0];
this.fetchPlaylist(); this.fetchPlaylist();
this.audio.ontimeupdate = () => { this.audio.ontimeupdate = () => {
this.setState({curTime: this.audio.currentTime, totTime: this.audio.duration, percent: this.audio.currentTime * 1.0 / this.audio.duration * 100.0}); this.setState({curTime: this.audio.currentTime, totTime: this.audio.duration});
}; };
this.audio.onpause = () => { this.audio.onpause = () => {
this.setState({playIcon: 'caret-right'}); this.setState({playIcon: 'caret-right'});
@ -102,8 +101,10 @@ class Player extends React.Component {
this.audio.pause(); this.audio.pause();
this.audio.src = this.state.source + this.currentFolder + '/' + filename; this.audio.src = this.state.source + this.currentFolder + '/' + filename;
this.audio.load(); this.audio.load();
this.audio.oncanplay = () => {
this.audio.play(); this.audio.play();
this.setState({playing: filename}); this.setState({playing: filename});
}
}; };
onRowClick = (record,index) => { onRowClick = (record,index) => {
this.audio.pause(); this.audio.pause();
@ -169,11 +170,11 @@ class Player extends React.Component {
}; };
onProgressChange = (value) => { onProgressChange = (value) => {
this.audio.currentTime = value; this.audio.currentTime = value;
this.setState({percent: value * 1.0 / this.state.totTime,curTime: value}); this.setState({curTime: value});
}; };
onAfterChange = (value) => { onAfterChange = (value) => {
this.audio.currentTime = value; this.audio.currentTime = value;
this.setState({percent: value * 1.0 / this.state.totTime,curTime: value}); this.setState({curTime: value});
}; };
render() { render() {
return ( return (