Hide video until it's playable and show loading message
This commit is contained in:
parent
31bf22cbf1
commit
5b0f2e638a
1 changed files with 36 additions and 6 deletions
|
@ -8,12 +8,42 @@ var WatchPage = React.createClass({
|
|||
propTypes: {
|
||||
name: React.PropTypes.string,
|
||||
},
|
||||
|
||||
getInitialState: function() {
|
||||
return {
|
||||
readyToPlay: false,
|
||||
loadStatusMessage: "Requesting stream",
|
||||
};
|
||||
},
|
||||
componentDidMount: function() {
|
||||
lbry.getStream(this.props.name);
|
||||
this.updateLoadStatus();
|
||||
},
|
||||
updateLoadStatus: function() {
|
||||
lbry.getFileStatus(this.props.name, (status) => {
|
||||
if (status.code != 'running') {
|
||||
this.loadStatusMessage = status.message;
|
||||
setTimeout(() => { this.updateLoadStatus() }, 250);
|
||||
} else {
|
||||
this.setState({
|
||||
readyToPlay: true
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
render: function() {
|
||||
return (
|
||||
<main>
|
||||
<video style={videoStyle} src={"/view?name=" + this.props.name} controls />
|
||||
</main>
|
||||
);
|
||||
if (!this.state.readyToPlay) {
|
||||
return (
|
||||
<main>
|
||||
<h3>Loading lbry://{this.props.name}</h3>
|
||||
{this.state.loadStatusMessage}
|
||||
</main>
|
||||
);
|
||||
} else {
|
||||
return (
|
||||
<main>
|
||||
<video style={videoStyle} src={"/view?name=" + this.props.name} controls />;
|
||||
</main>
|
||||
);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
Loading…
Reference in a new issue