Add basic wallet functionality

This commit is contained in:
Jonas Whidden 2016-07-18 17:40:15 -05:00 committed by Alex Liebowitz
parent 9a01b7202f
commit d72e077ad3
5 changed files with 109 additions and 1 deletions

1
dist/index.html vendored
View file

@ -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>

View file

@ -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 />;
}
}
});

View file

@ -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);

View file

@ -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
View 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>
);
}
});