LBRYCommunity/lbry-desktop
1
0
Fork 0
Code Issues 596 Pull requests 6 Projects Releases 238 Packages Wiki Activity

Improvements to watch and download process #45

Merged
alexliebowitz merged 9 commits from download-fixes into master 2017-04-17 23:29:02 +02:00
Conversation 0 Commits 9 Files changed 11 +16 -10
1 changed files with 16 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files
Showing only changes of commit cf1107050d - Show all commits

26
ui/js/page/watch.js
View file

@ -20,7 +20,7 @@ export let WatchLink = React.createClass({
getInitialState: function() { getInitialState: function() {
affirmedPurchase: false affirmedPurchase: false
}, },
onAffirmPurchase: function() { play: function() {
lbry.get({uri: this.props.uri}).then((streamInfo) => { lbry.get({uri: this.props.uri}).then((streamInfo) => {
if (streamInfo === null || typeof streamInfo !== 'object') { if (streamInfo === null || typeof streamInfo !== 'object') {
this.setState({ this.setState({
@ -51,10 +51,16 @@ export let WatchLink = React.createClass({
attemptingDownload: false, attemptingDownload: false,
}); });
} else if (cost <= 0.01) { } else if (cost <= 0.01) {
this.onAffirmPurchase() this.play()
} else { } else {
this.setState({ lbry.file_list({outpoint: this.props.outpoint}).then((fileInfo) => {
modal: 'affirmPurchase' if (fileInfo) { // Already downloaded
this.play();
} else {
this.setState({
modal: 'affirmPurchase'
});
}
}); });
} }
}); });
@ -84,7 +90,7 @@ export let WatchLink = React.createClass({
You don't have enough LBRY credits to pay for this stream. You don't have enough LBRY credits to pay for this stream.
</Modal> </Modal>
<Modal type="confirm" isOpen={this.state.modal == 'affirmPurchase'} <Modal type="confirm" isOpen={this.state.modal == 'affirmPurchase'}
contentLabel="Confirm Purchase" onConfirmed={this.onAffirmPurchase} onAborted={this.closeModal}> contentLabel="Confirm Purchase" onConfirmed={this.play} onAborted={this.closeModal}>
Are you sure you'd like to buy <strong>{this.props.metadata.title}</strong> for <strong><FilePrice uri={this.props.uri} metadata={this.props.metadata} label={false} look="plain" /></strong> credits? Are you sure you'd like to buy <strong>{this.props.metadata.title}</strong> for <strong><FilePrice uri={this.props.uri} metadata={this.props.metadata} label={false} look="plain" /></strong> credits?
</Modal> </Modal>
</div>); </div>);
@ -96,10 +102,11 @@ export let Video = React.createClass({
_isMounted: false, _isMounted: false,
_controlsHideDelay: 3000, // Note: this needs to be shorter than the built-in delay in Electron, or Electron will hide the controls before us _controlsHideDelay: 3000, // Note: this needs to be shorter than the built-in delay in Electron, or Electron will hide the controls before us
_controlsHideTimeout: null, _controlsHideTimeout: null,
_outpoint: null,
propTypes: { propTypes: {
uri: React.PropTypes.string, uri: React.PropTypes.string.isRequired,
metadata: React.PropTypes.object,
outpoint: React.PropTypes.string,
}, },
getInitialState: function() { getInitialState: function() {
return { return {
@ -114,7 +121,6 @@ export let Video = React.createClass({
}, },
onGet: function() { onGet: function() {
lbry.get({uri: this.props.uri}).then((fileInfo) => { lbry.get({uri: this.props.uri}).then((fileInfo) => {
this._outpoint = fileInfo.outpoint;
this.updateLoadStatus(); this.updateLoadStatus();
}); });
this.setState({ this.setState({
@ -159,7 +165,7 @@ export let Video = React.createClass({
}, },
updateLoadStatus: function() { updateLoadStatus: function() {
lbry.file_list({ lbry.file_list({
outpoint: this._outpoint, outpoint: this.props.outpoint,
full_status: true, full_status: true,
}).then(([status]) => { }).then(([status]) => {
if (!status || status.written_bytes == 0) { if (!status || status.written_bytes == 0) {
@ -201,7 +207,7 @@ export let Video = React.createClass({
<span>this is the world's world loading screen and we shipped our software with it anyway... <br/><br/>{this.state.loadStatusMessage}</span> : <span>this is the world's world loading screen and we shipped our software with it anyway... <br/><br/>{this.state.loadStatusMessage}</span> :
<video controls id="video" ref="video"></video> : <video controls id="video" ref="video"></video> :
<div className="video__cover" style={{backgroundImage: 'url("' + this.props.metadata.thumbnail + '")'}}> <div className="video__cover" style={{backgroundImage: 'url("' + this.props.metadata.thumbnail + '")'}}>
<WatchLink className="video__play-button" uri={this.props.uri} metadata={this.props.metadata} onGet={this.onGet} icon="icon-play"></WatchLink> <WatchLink className="video__play-button" uri={this.props.uri} metadata={this.props.metadata} outpoint={this.props.outpoint} onGet={this.onGet} icon="icon-play"></WatchLink>
</div> </div>
}</div> }</div>
); );