Skip to content

Instantly share code, notes, and snippets.

@nuuneoi
Created August 24, 2018 20:00
Show Gist options
  • Save nuuneoi/28541e2c8dabc76942daf4e8fa1afb57 to your computer and use it in GitHub Desktop.
Save nuuneoi/28541e2c8dabc76942daf4e8fa1afb57 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>DApp Tutorial</title>
<style>
body {
background-color:#F0F0F0;
padding: 2em;
font-family: 'Raleway','Source Sans Pro', 'Arial';
}
.container {
width: 50%;
margin: 0 auto;
}
label {
display:block;
margin-bottom:10px;
}
input {
padding:10px;
width: 50%;
margin-bottom: 1em;
}
button {
margin: 2em 0;
padding: 1em 4em;
display:block;
}
#balance {
padding:1em;
background-color:#fff;
margin: 1em 0;
}
#status {
font-weight:normal;
font-family: monospace;
padding:1em;
background-color:#fff;
margin: 1em 0;
}
</style>
</head>
<body>
<!-- Form -->
<div class="container">
<h1>dApp Basic Example</h1>
<h2 id="balance">Current Balance = <span id="currentBalance"></span></h2>
<button id="button" style="display: block" onclick="javascript:getBalance()">Get New Balance</button>
<hr/>
<br/>
<label for="newBalance" class="col-lg-2 control-label"><strong>New Balance</strong></label>
<input id="newBalance" type="number" value="0" style="display: inline-block">
<button id="button" style="display: inline-block" onclick="javascript:setBalance()">Set New Balance</button>
<br/>
<br/>
<label><strong>Status</strong></label>
<h4 id="status"></h4>
</div>
</body>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/gh/ethereum/web3.js/dist/web3.min.js"></script>
<script>
function addStatusLine(text) {
document.getElementById("status").innerHTML = text + "<br/><br/>" + document.getElementById("status").innerHTML;
}
function getBalance() {
addStatusLine("");
addStatusLine("calling getBalance()");
// TODO: Call getBalance Smart Contract
}
function setBalance() {
// TODO: Call setBalance Smart Contract
}
// Initializing
if (typeof web3 !== 'undefined') {
web3 = new Web3(web3.currentProvider);
}
// Get default address
web3.eth.defaultAccount = web3.eth.accounts[0];
// TODO: Replace your SimpleContract abi here
var abi = [];
// TODO: Replace your SimpleContract contract address here
var contractAddress = '';
// Create an interface to SimpleContract on TomoChain
var SimpleContractContract = web3.eth.contract(abi);
var SimpleContract = SimpleContractContract.at(contractAddress);
// Get Balance on the first load
getBalance();
</script>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment