embarklabs
/
embark
mirror of https://github.com/embarklabs/embark.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

Allows copying commands to clipboard

This commit is contained in:
Richard Ramos 2018-04-19 14:42:11 -04:00 committed by Pascal Precht
parent 92f1ac7576
commit 42db8258e0
No known key found for this signature in database
GPG Key ID: 0EE28D8D6FD85D7D
3 changed files with 59 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
lib/modules/webserver/backend/contracts/components/account-list.js
View File

@ -6,6 +6,9 @@ class AccountList extends React.Component {
errorMessage: "",
accounts: []
};
this.handleClick = this.handleClick.bind(this);
this.handleCopyClick = this.handleCopyClick.bind(this);
}
@ -23,7 +26,16 @@ class AccountList extends React.Component {
}
handleCopyClick(e){
e.preventDefault();
var dummy = document.createElement("input");
document.body.appendChild(dummy);
dummy.setAttribute('value', "await web3.eth.getAccounts();");
dummy.select();
document.execCommand("copy");
document.body.removeChild(dummy);
}
render(){
return <ContractContext.Consumer>
@ -32,6 +44,9 @@ class AccountList extends React.Component {
<div className="card function">
<div className="card-header">
<h3 className="card-title">Get Accounts</h3>
<div className="card-options">
<a href="#" onClick={this.handleCopyClick} title="Copy to clipboard"><i className="fe fe-copy"></i></a>
</div>
</div>
<CardAlert show={this.state.error} message={this.state.errorMessage} />
<div className="card-body row">

24
lib/modules/webserver/backend/contracts/components/function-form.js
View File

@ -8,7 +8,14 @@ class FunctionForm extends React.Component {
receipt: null
};
this.child = React.createRef();
this.showResults = this.showResults.bind(this);
this.handleCopyClick = this.handleCopyClick.bind(this);
}
handleCopyClick(e){
this.child.current.copyCommand(e);
}
_getFunctionParamFields(elem){
@ -30,21 +37,18 @@ class FunctionForm extends React.Component {
const receipt = this.state.receipt;
return <div className="card function">
{
this.props.abi.type == "function" || this.props.abi.type == "fallback"
?
<div className="card-header">
<h3 className="card-title">{this.props.abi.type == 'function' ? this.props.abi.name : (this.props.abi.type == 'fallback' ? '(fallback)' : this.props.abi.name)}</h3>
</div>
:
""
}
<div className="card-header">
<h3 className="card-title">{this.props.abi.type == 'function' ? this.props.abi.name : (this.props.abi.type == 'fallback' ? '(fallback)' : this.props.abi.name)}</h3>
<div className="card-options">
<a href="#" onClick={this.handleCopyClick} title="Copy to clipboard"><i className="fe fe-copy"></i></a>
</div>
</div>
<CardAlert show={this.state.error} message={this.state.message} />
<div className="card-body row">
<Function definition={this.props.definition} contract={this.props.contract} contractName={this.props.contractName} duplicated={isDuplicated} abi={this.props.abi} resultHandler={this.showResults} />
<Function ref={this.child} definition={this.props.definition} contract={this.props.contract} contractName={this.props.contractName} duplicated={isDuplicated} abi={this.props.abi} resultHandler={this.showResults} />
</div>
{
receipt != null || !this.state.error && this.state.message != null

35
lib/modules/webserver/backend/contracts/components/function.js
View File

@ -20,6 +20,30 @@ class Function extends React.Component {
this.handleClick = this.handleClick.bind(this);
}
copyCommand(e){
e.preventDefault();
let fields = this.state.fields;
let functionLabel = this._getFunctionLabel();
let functionParams = this._getFunctionParamString();
let methodParams = this._getMethodString();
if(this.props.abi.type == "constructor")
functionParams = `{arguments: [${functionParams}]}`;
const command = `await ${functionLabel}(${functionParams})${this.props.abi.type != 'fallback' ? '.' + this._getMethodType() : ''}${methodParams}`;
var dummy = document.createElement("input");
document.body.appendChild(dummy);
dummy.setAttribute('value', command);
dummy.select();
document.execCommand("copy");
document.body.removeChild(dummy);
}
async handleClick(e, instanceUpdateCallback){
e.preventDefault();
@ -70,7 +94,6 @@ class Function extends React.Component {
[this._getMethodType()](executionParams)
if(this._getMethodType() == 'call'){
console.log("A");
this.props.resultHandler(false, _receipt, null);
} else {
this.props.resultHandler(false, null, _receipt);
@ -173,21 +196,21 @@ class Function extends React.Component {
_getFunctionParamString(){
if(this.props.abi.type == 'fallback') return '';
return this.props.abi.inputs
.map((input, i) => (input.type.indexOf('int') == -1 ? '"' : '') + this.state.fields[input.name] + (input.type.indexOf('int') == -1 ? '"' : ''))
.map((input, i) => (input.type.indexOf('int') == -1 ? '"' : '') + (this.state.fields[input.name] || (input.type.indexOf('int') == -1 ? '' : '0')) + (input.type.indexOf('int') == -1 ? '"' : ''))
.join(', ');
}
_getMethodString(elem){
let methodParams = "({";
methodParams += `from: ` + this.state.selectedAccount;
methodParams += `from: ` + (this.state.selectedAccount || '"0x00"');
if(this._getMethodType() == 'send'){
methodParams += ', gasLimit: ' + this.state.methodFields.gasLimit
methodParams += ', gasLimit: ' + (this.state.methodFields.gasLimit || 0)
if(this.props.abi.payable){
methodParams += ', value: ' + this.state.methodFields.value
methodParams += ', value: ' + (this.state.methodFields.value || 0)
}
if(this.props.abi.type == 'fallback'){
methodParams += ', data: "' + this.state.methodFields.data + '", to: "' + this.state.methodFields.to + '"'
methodParams += ', data: "' + (this.state.methodFields.data || '"0x00"' ) + '", to: "' + (this.state.methodFields.to || '"0x00"') + '"'
}
}
return methodParams + "})";