Convert alerts to modals in DownloadLink component
This commit is contained in:
parent
df0a5ee73e
commit
a6e4751ae3
1 changed files with 48 additions and 9 deletions
|
@ -93,13 +93,22 @@ var DownloadLink = React.createClass({
|
|||
getInitialState: function() {
|
||||
return {
|
||||
downloading: false,
|
||||
filePath: null,
|
||||
modal: null,
|
||||
}
|
||||
},
|
||||
closeModal: function() {
|
||||
this.setState({
|
||||
modal: null,
|
||||
})
|
||||
},
|
||||
handleClick: function() {
|
||||
lbry.getCostEstimate(this.props.streamName, (amount) => {
|
||||
lbry.getBalance((balance) => {
|
||||
if (amount > balance) {
|
||||
alert("You don't have enough LBRY credits to pay for this stream.");
|
||||
this.setState({
|
||||
modal: 'notEnoughCredits',
|
||||
});
|
||||
} else {
|
||||
this.startDownload();
|
||||
}
|
||||
|
@ -113,15 +122,27 @@ var DownloadLink = React.createClass({
|
|||
});
|
||||
|
||||
lbry.getStream(this.props.streamName, (streamInfo) => {
|
||||
alert('Downloading to ' + streamInfo.path);
|
||||
console.log(streamInfo);
|
||||
this.setState({
|
||||
modal: 'downloadStarted',
|
||||
filePath: streamInfo.path,
|
||||
});
|
||||
});
|
||||
}
|
||||
},
|
||||
render: function() {
|
||||
var label = (!this.state.downloading ? this.props.label : this.props.downloadingLabel);
|
||||
return <Link button={this.props.button} hidden={this.props.hidden} style={this.props.style}
|
||||
disabled={this.state.downloading} label={label} icon={this.props.icon} onClick={this.handleClick} />;
|
||||
return (
|
||||
<div>
|
||||
<Link button={this.props.button} hidden={this.props.hidden} style={this.props.style}
|
||||
disabled={this.state.downloading} label={label} icon={this.props.icon} onClick={this.handleClick} />
|
||||
<Modal isOpen={this.state.modal == 'downloadStarted'} onConfirmed={this.closeModal}>
|
||||
Downloading to {this.state.filePath}
|
||||
</Modal>
|
||||
<Modal isOpen={this.state.modal == 'notEnoughCredits'} onConfirmed={this.closeModal}>
|
||||
You don't have enough LBRY credits to pay for this stream.
|
||||
</Modal>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
|
@ -138,22 +159,40 @@ var WatchLink = React.createClass({
|
|||
lbry.getCostEstimate(this.props.streamName, (amount) => {
|
||||
lbry.getBalance((balance) => {
|
||||
if (amount > balance) {
|
||||
alert("You don't have enough LBRY credits to pay for this stream.");
|
||||
this.setState({
|
||||
modal: 'notEnoughCredits',
|
||||
});
|
||||
} else {
|
||||
window.location = '?watch=' + this.props.streamName;
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
getInitialState: function() {
|
||||
return {
|
||||
modal: null,
|
||||
};
|
||||
},
|
||||
closeModal: function() {
|
||||
this.setState({
|
||||
modal: null,
|
||||
});
|
||||
},
|
||||
getDefaultProps: function() {
|
||||
return {
|
||||
icon: 'icon-play',
|
||||
label: 'Watch',
|
||||
}
|
||||
},
|
||||
|
||||
render: function() {
|
||||
return <Link button={this.props.button} hidden={this.props.hidden} style={this.props.style}
|
||||
label={this.props.label} icon={this.props.icon} onClick={this.handleClick} />;
|
||||
return (
|
||||
<div>
|
||||
<Link button={this.props.button} hidden={this.props.hidden} style={this.props.style}
|
||||
label={this.props.label} icon={this.props.icon} onClick={this.handleClick} />
|
||||
<Modal isOpen={this.state.modal == 'notEnoughCredits'} onConfirmed={this.closeModal}>
|
||||
You don't have enough LBRY credits to pay for this stream.
|
||||
</Modal>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
});
|
Loading…
Reference in a new issue