Integrated MetaMask into the UI elements
parent
90a40a0be9
commit
425b6ae6dd
|
@ -20,7 +20,7 @@
|
||||||
<li><a href="sendflag.html">Send Flag</a></li>
|
<li><a href="sendflag.html">Send Flag</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
<ul class="nav navbar-nav navbar-right">
|
<ul class="nav navbar-nav navbar-right">
|
||||||
<li><a href="#"><span class="glyphicon glyphicon-log-in"></span> Connect Wallet</a></li>
|
<li><button class="btn btn-default navbar-btn" id="metamask-login" type="button" style="margin-right:20px"><span class="glyphicon glyphicon-log-in"></span> Connect Wallet</button></li>
|
||||||
<!--<button class="btn btn-danger navbar-btn">Button</button>-->
|
<!--<button class="btn btn-danger navbar-btn">Button</button>-->
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
@ -56,5 +56,30 @@
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<script type='module'>
|
||||||
|
window.addEventListener("load", function () {
|
||||||
|
let loginbutton = document.getElementById('metamask-login');
|
||||||
|
let accounts;
|
||||||
|
ethereum.request({method: 'eth_requestAccounts'}).then(accounts => {
|
||||||
|
console.log(accounts);
|
||||||
|
if (accounts.length > 0) {
|
||||||
|
loginbutton.textContent = accounts[0];
|
||||||
|
loginbutton.disabled = true;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
loginbutton.addEventListener('click', event => {
|
||||||
|
let account;
|
||||||
|
ethereum.request({method: 'eth_requestAccounts'}).then(accounts =>{
|
||||||
|
account = accounts[0];
|
||||||
|
//alert(account);
|
||||||
|
console.log(account);
|
||||||
|
loginbutton.textContent = account;
|
||||||
|
loginbutton.disabled = true;
|
||||||
|
})
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -22,7 +22,7 @@
|
||||||
</ul>
|
</ul>
|
||||||
<ul class="nav navbar-nav navbar-right">
|
<ul class="nav navbar-nav navbar-right">
|
||||||
|
|
||||||
<li><a href="#"><span class="glyphicon glyphicon-log-in"></span> Connect Wallet</a></li>
|
<li><button class="btn btn-default navbar-btn" id="metamask-login" type="button" style="margin-right:20px"><span class="glyphicon glyphicon-log-in"></span> Connect Wallet</button></li>
|
||||||
<!--<button class="btn btn-danger navbar-btn">Button</button>-->
|
<!--<button class="btn btn-danger navbar-btn">Button</button>-->
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
@ -30,16 +30,40 @@
|
||||||
|
|
||||||
<div class="container" style="margin-top:50px">
|
<div class="container" style="margin-top:50px">
|
||||||
<h1>Send the flag</h1>
|
<h1>Send the flag</h1>
|
||||||
<form class="form-inline">
|
<form class="form-inline" id="flag-form" style="display:none">
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<label for="flagbox">Flag:</label>
|
<label for="flagbox">Flag:</label>
|
||||||
<input type="text" class="form-control" id="flagbox">
|
<input type="text" class="form-control" id="flagbox">
|
||||||
</div>
|
</div>
|
||||||
<button type="button" class="btn btn-default" id="submitFlagBtn">Submit Flag</button>
|
<button id="submitFlagBtn" type="button" class="btn btn-default">Submit Flag</button>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<script type='module'>
|
||||||
|
window.addEventListener("load", function () {
|
||||||
|
let loginbutton = document.getElementById('metamask-login');
|
||||||
|
let accounts;
|
||||||
|
ethereum.request({method: 'eth_requestAccounts'}).then(accounts => {
|
||||||
|
console.log(accounts);
|
||||||
|
if (accounts.length > 0) {
|
||||||
|
document.getElementById('flag-form').style.display = "block";
|
||||||
|
loginbutton.textContent = accounts[0];
|
||||||
|
loginbutton.disabled = true;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
let loginbutton = document.getElementById('metamask-login');
|
||||||
|
loginbutton.addEventListener('click', event => {
|
||||||
|
let account;
|
||||||
|
ethereum.request({method: 'eth_requestAccounts'}).then(accounts =>{
|
||||||
|
account = accounts[0];
|
||||||
|
document.getElementById('flag-form').style.display = "block";
|
||||||
|
loginbutton.textContent = account;
|
||||||
|
loginbutton.disabled = true;
|
||||||
|
})
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
Loading…
Reference in New Issue