Add basic wallet functionality
This commit is contained in:
parent
9a01b7202f
commit
d72e077ad3
5 changed files with 109 additions and 1 deletions
1
dist/index.html
vendored
1
dist/index.html
vendored
|
@ -36,6 +36,7 @@
|
|||
<script src="./js/page/start.js"></script>
|
||||
<script src="./js/page/claim_code.js"></script>
|
||||
<script src="./js/page/show.js"></script>
|
||||
<script src="./js/page/wallet.js"></script>
|
||||
<script src="./js/app.js"></script>
|
||||
<script src="./js/main.js"></script>
|
||||
</body>
|
||||
|
|
|
@ -4,7 +4,7 @@ var App = React.createClass({
|
|||
var match, param, val;
|
||||
[match, param, val] = window.location.search.match(/\??([^=]*)(?:=(.*))?/);
|
||||
|
||||
if (['settings', 'help', 'start', 'watch', 'report', 'files', 'claim', 'show'].indexOf(param) != -1) {
|
||||
if (['settings', 'help', 'start', 'watch', 'report', 'files', 'claim', 'show', 'wallet'].indexOf(param) != -1) {
|
||||
var viewingPage = param;
|
||||
} else {
|
||||
var viewingPage = 'home';
|
||||
|
@ -60,6 +60,8 @@ var App = React.createClass({
|
|||
return <ClaimCodePage />;
|
||||
} else if (this.state.viewingPage == 'show') {
|
||||
return <DetailPage name={this.state.pageArgs}/>;
|
||||
} else if (this.state.viewingPage == 'wallet') {
|
||||
return <WalletPage />;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
|
@ -98,6 +98,11 @@ lbry.getBalance = function(callback)
|
|||
lbry.call("get_balance", {}, callback);
|
||||
}
|
||||
|
||||
lbry.sendToAddress = function(amount, address, callback)
|
||||
{
|
||||
lbry.call("send_to_address", { "amount" : amount, "address": address }, callback);
|
||||
}
|
||||
|
||||
lbry.search = function(query, callback)
|
||||
{
|
||||
lbry.call("search_nametrie", { "search": query }, callback);
|
||||
|
|
|
@ -376,10 +376,12 @@ var mainMenuStyle = {
|
|||
var MainMenu = React.createClass({
|
||||
render: function() {
|
||||
var isLinux = /linux/i.test(navigator.userAgent); // @TODO: find a way to use getVersionInfo() here without messy state management
|
||||
// @TODO: Need a wallet icon
|
||||
return (
|
||||
<div style={mainMenuStyle}>
|
||||
<Menu {...this.props}>
|
||||
<MenuItem href='/?files' label="My Files" icon='icon-cloud-download' />
|
||||
<MenuItem href='/?wallet' label="My Wallet" icon='icon-gear' />
|
||||
<MenuItem href='/?settings' label="Settings" icon='icon-gear' />
|
||||
<MenuItem href='/?help' label="Help" icon='icon-question-circle' />
|
||||
{isLinux ? <MenuItem href="/?start" label="Exit LBRY" icon="icon-close" />
|
||||
|
|
98
js/page/wallet.js
Normal file
98
js/page/wallet.js
Normal file
|
@ -0,0 +1,98 @@
|
|||
var NewAddressSection = React.createClass({
|
||||
generateAddress: function() {
|
||||
lbry.getNewAddress((results) => {
|
||||
this.setState({
|
||||
address: results,
|
||||
})
|
||||
});
|
||||
},
|
||||
getInitialState: function() {
|
||||
return {
|
||||
address: "",
|
||||
}
|
||||
},
|
||||
render: function() {
|
||||
return (
|
||||
<div>
|
||||
<h1>Create New Address:</h1>
|
||||
<button type="button" onClick={this.generateAddress}>Generate New Address</button> <input type="text" size="60" value={this.state.address}></input>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
var SendToAddressSection = React.createClass({
|
||||
sendToAddress: function() {
|
||||
this.setState({
|
||||
results: "",
|
||||
});
|
||||
|
||||
lbry.sendToAddress((results) => {
|
||||
if(results === true)
|
||||
{
|
||||
this.setState({
|
||||
results: "Your transaction was completed successfully.",
|
||||
});
|
||||
}
|
||||
else
|
||||
{
|
||||
this.setState({
|
||||
results: "Something went wrong: " + results
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
getInitialState: function() {
|
||||
return {
|
||||
address: "",
|
||||
amount: 0.0,
|
||||
balance: "Checking balance...",
|
||||
results: "",
|
||||
}
|
||||
},
|
||||
componentWillMount: function() {
|
||||
lbry.getBalance((results) => {
|
||||
this.setState({
|
||||
balance: results,
|
||||
});
|
||||
});
|
||||
},
|
||||
setAmount: function(event) {
|
||||
this.setState({
|
||||
amount: event.target.value,
|
||||
})
|
||||
},
|
||||
setAddress: function(event) {
|
||||
this.setState({
|
||||
address: event.target.value,
|
||||
})
|
||||
},
|
||||
render: function() {
|
||||
return (
|
||||
<div>
|
||||
<h1>Send To Address:</h1>
|
||||
<label for="balance">Balance: {this.state.balance}</label><br />
|
||||
<label for="amount">Amount:</label> <input id="amount" type="number" size="10" onChange={this.setAmount}></input><br />
|
||||
<label for="address">Address:</label> <input id="address" type="text" size="60" onChange={this.setAddress}></input><br />
|
||||
<button type="button" onClick={this.sendToAddress}>Send Amount to Address</button><br /><br />
|
||||
<h4>Results:</h4>
|
||||
<span>{this.state.results}</span>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
var WalletPage = React.createClass({
|
||||
render: function() {
|
||||
return (
|
||||
<main className="page">
|
||||
<SubPageLogo />
|
||||
<NewAddressSection /><br />
|
||||
<SendToAddressSection /><br />
|
||||
<section>
|
||||
<Link href="/" label="<< Return" />
|
||||
</section>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
});
|
Loading…
Reference in a new issue