Add submit input to Claim Code, Referral and Wallet pages
This commit is contained in:
parent
7cfbb60033
commit
0e21b88281
3 changed files with 77 additions and 55 deletions
|
@ -16,7 +16,11 @@ var ClaimCodePage = React.createClass({
|
|||
submitting: false,
|
||||
}
|
||||
},
|
||||
handleSubmit: function() {
|
||||
handleSubmit: function(event) {
|
||||
if (typeof event !== 'undefined') {
|
||||
event.preventDefault();
|
||||
}
|
||||
|
||||
if (!this.refs.code.value) {
|
||||
alert('Please enter an invitation code or choose "Skip."');
|
||||
return;
|
||||
|
@ -81,25 +85,26 @@ var ClaimCodePage = React.createClass({
|
|||
render: function() {
|
||||
return (
|
||||
<main>
|
||||
<div className="card">
|
||||
<h2>Claim your beta invitation code</h2>
|
||||
<section style={claimCodeContentStyle}>
|
||||
<p>Thanks for beta testing LBRY! Enter your invitation code and email address below to receive your initial
|
||||
LBRY credits.</p>
|
||||
<p>You will be added to our mailing list (if you're not already on it) and will be eligible for future rewards for beta testers.</p>
|
||||
</section>
|
||||
<section>
|
||||
<form onSubmit={this.handleSubmit}>
|
||||
<form onSubmit={this.handleSubmit}>
|
||||
<div className="card">
|
||||
<h2>Claim your beta invitation code</h2>
|
||||
<section style={claimCodeContentStyle}>
|
||||
<p>Thanks for beta testing LBRY! Enter your invitation code and email address below to receive your initial
|
||||
LBRY credits.</p>
|
||||
<p>You will be added to our mailing list (if you're not already on it) and will be eligible for future rewards for beta testers.</p>
|
||||
</section>
|
||||
<section>
|
||||
<section><label style={claimCodeLabelStyle} htmlFor="code">Invitation code</label><input name="code" ref="code" /></section>
|
||||
<section><label style={claimCodeLabelStyle} htmlFor="email">Email</label><input name="email" ref="email" /></section>
|
||||
</form>
|
||||
</section>
|
||||
<section>
|
||||
<Link button="primary" label={this.state.submitting ? "Submitting..." : "Submit"}
|
||||
disabled={this.state.submitting} onClick={this.handleSubmit} />
|
||||
<Link button="alt" label="Skip" disabled={this.state.submitting} onClick={this.handleSkip} />
|
||||
</section>
|
||||
</div>
|
||||
</section>
|
||||
<section>
|
||||
<Link button="primary" label={this.state.submitting ? "Submitting..." : "Submit"}
|
||||
disabled={this.state.submitting} onClick={this.handleSubmit} />
|
||||
<Link button="alt" label="Skip" disabled={this.state.submitting} onClick={this.handleSkip} />
|
||||
<input type='submit' className='hidden' />
|
||||
</section>
|
||||
</div>
|
||||
</form>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -16,7 +16,11 @@ var ReferralPage = React.createClass({
|
|||
submitting: false,
|
||||
}
|
||||
},
|
||||
handleSubmit: function() {
|
||||
handleSubmit: function(event) {
|
||||
if (typeof event !== 'undefined') {
|
||||
event.preventDefault();
|
||||
}
|
||||
|
||||
if (!this.refs.code.value) {
|
||||
alert('Please enter a referral code.');
|
||||
return;
|
||||
|
@ -72,23 +76,24 @@ var ReferralPage = React.createClass({
|
|||
render: function() {
|
||||
return (
|
||||
<main>
|
||||
<div className="card">
|
||||
<h2>Check your referral credits</h2>
|
||||
<section style={referralCodeContentStyle}>
|
||||
<p>Have you referred others to LBRY? Enter your referral code and email address below to check how many credits you've earned!</p>
|
||||
<p>As a reminder, your referral code is the same as your LBRY invitation code.</p>
|
||||
</section>
|
||||
<section>
|
||||
<form onSubmit={this.handleSubmit}>
|
||||
<form onSubmit={this.handleSubmit}>
|
||||
<div className="card">
|
||||
<h2>Check your referral credits</h2>
|
||||
<section style={referralCodeContentStyle}>
|
||||
<p>Have you referred others to LBRY? Enter your referral code and email address below to check how many credits you've earned!</p>
|
||||
<p>As a reminder, your referral code is the same as your LBRY invitation code.</p>
|
||||
</section>
|
||||
<section>
|
||||
<section><label style={referralCodeLabelStyle} htmlFor="code">Referral code</label><input name="code" ref="code" /></section>
|
||||
<section><label style={referralCodeLabelStyle} htmlFor="email">Email</label><input name="email" ref="email" /></section>
|
||||
</form>
|
||||
</section>
|
||||
<section>
|
||||
<Link button="primary" label={this.state.submitting ? "Submitting..." : "Submit"}
|
||||
disabled={this.state.submitting} onClick={this.handleSubmit} />
|
||||
</section>
|
||||
</div>
|
||||
</section>
|
||||
<section>
|
||||
<Link button="primary" label={this.state.submitting ? "Submitting..." : "Submit"}
|
||||
disabled={this.state.submitting} onClick={this.handleSubmit} />
|
||||
<input type='submit' className='hidden' />
|
||||
</section>
|
||||
</div>
|
||||
</form>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -2,7 +2,11 @@ var addressRefreshButtonStyle = {
|
|||
fontSize: '11pt',
|
||||
};
|
||||
var AddressSection = React.createClass({
|
||||
_refreshAddress: function() {
|
||||
_refreshAddress: function(event) {
|
||||
if (typeof event !== 'undefined') {
|
||||
event.preventDefault();
|
||||
}
|
||||
|
||||
lbry.getNewAddress((address) => {
|
||||
localStorage.setItem('wallet_address', address);
|
||||
this.setState({
|
||||
|
@ -35,7 +39,8 @@ var AddressSection = React.createClass({
|
|||
return (
|
||||
<section className="card">
|
||||
<h3>Wallet Address</h3>
|
||||
<p><Address address={this.state.address} /> <Link text="Get new address" icon='icon-refresh' onClick={this._refreshAddress} style={addressRefreshButtonStyle} /></p>
|
||||
<Address address={this.state.address} /> <Link text="Get new address" icon='icon-refresh' onClick={this._refreshAddress} style={addressRefreshButtonStyle} />
|
||||
<input type='submit' className='hidden' />
|
||||
<div className="help">
|
||||
<p>Other LBRY users may send credits to you by entering this address on the "Send" page.</p>
|
||||
You can generate a new address at any time, and any previous addresses will continue to work. Using multiple addresses can be helpful for keeping track of incoming payments from multiple sources.
|
||||
|
@ -46,7 +51,11 @@ var AddressSection = React.createClass({
|
|||
});
|
||||
|
||||
var SendToAddressSection = React.createClass({
|
||||
sendToAddress: function() {
|
||||
handleSubmit: function(event) {
|
||||
if (typeof event !== 'undefined') {
|
||||
event.preventDefault();
|
||||
}
|
||||
|
||||
if ((this.state.balance - this.state.amount) < 1)
|
||||
{
|
||||
alert("Insufficient balance: after this transaction you would have less than 1 LBC in your wallet.")
|
||||
|
@ -104,26 +113,29 @@ var SendToAddressSection = React.createClass({
|
|||
render: function() {
|
||||
return (
|
||||
<section className="card">
|
||||
<h3>Send Credits</h3>
|
||||
<div className="form-row">
|
||||
<label htmlFor="amount">Amount</label>
|
||||
<input id="amount" type="text" size="10" onChange={this.setAmount}></input>
|
||||
</div>
|
||||
<div className="form-row">
|
||||
<label htmlFor="address">Recipient address</label>
|
||||
<input id="address" type="text" size="60" onChange={this.setAddress}></input>
|
||||
</div>
|
||||
<div className="form-row form-row-submit">
|
||||
<Link button="primary" label="Send" onClick={this.sendToAddress} disabled={!(parseFloat(this.state.amount) > 0.0) || this.state.address == ""} />
|
||||
</div>
|
||||
{
|
||||
this.state.results ?
|
||||
<form onSubmit={this.handleSubmit}>
|
||||
<h3>Send Credits</h3>
|
||||
<div className="form-row">
|
||||
<h4>Results</h4>
|
||||
{this.state.results}
|
||||
<label htmlFor="amount">Amount</label>
|
||||
<input id="amount" type="text" size="10" onChange={this.setAmount}></input>
|
||||
</div>
|
||||
: ''
|
||||
}
|
||||
<div className="form-row">
|
||||
<label htmlFor="address">Recipient address</label>
|
||||
<input id="address" type="text" size="60" onChange={this.setAddress}></input>
|
||||
</div>
|
||||
<div className="form-row form-row-submit">
|
||||
<Link button="primary" label="Send" onClick={this.handleSubmit} disabled={!(parseFloat(this.state.amount) > 0.0) || this.state.address == ""} />
|
||||
<input type='submit' className='hidden' />
|
||||
</div>
|
||||
{
|
||||
this.state.results ?
|
||||
<div className="form-row">
|
||||
<h4>Results</h4>
|
||||
{this.state.results}
|
||||
</div>
|
||||
: ''
|
||||
}
|
||||
</form>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
|
|
Loading…
Add table
Reference in a new issue