Skip to content

Instantly share code, notes, and snippets.

@connorbode

connorbode/avvy-identity-provision.html

Last active April 19, 2021 06:40
Show Gist options
  • Save connorbode/dd5c8acff5172cf19897780f3bc2f4d3 to your computer and use it in GitHub Desktop.
Save connorbode/dd5c8acff5172cf19897780f3bc2f4d3 to your computer and use it in GitHub Desktop.
Download ZIP
Demonstration of identity loading for avvy.domains
Raw
avvy-identity-provision.html
<html>
<head>
<style>
* {
font-family: Arial;
}
body {
background: #eee;
}
.wrap {
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
align-items: center;
justify-content: center;
}
#inner {
border-radius: 15px;
background: white;
padding: 10px;
text-align: center;
display: none;
}
#avatar {
width: 100px;
height: 100px;
border-radius: 100px;
background: #eee;
background-position: center;
background-size: cover;
margin: auto;
}
#address {
margin-top: 20px;
font-weight: bold;
font-size: 18px;
}
#nickname {
font-size: 15px;
}
</style>
</head>
<body>
<div class="wrap">
<div id="inner">
<div id="avatar"></div>
<div id="address"></div>
<div id="nickname"></div>
</div>
</div>
<script src="https://unpkg.com/@avvy/[email protected]/dist/index.js"></script>
<script src="https://www.unpkg.com/[email protected]/dist/web3.min.js"></script>
<script>
const get = (sel) => document.querySelector(sel)
async function main() {
const web3 = await new Web3(ethereum)
const avvy = new AvvyClient(web3)
const accounts = await ethereum.request({ method: 'eth_requestAccounts' })
const main = await avvy.getMain(accounts[0])
const avatar = await avvy.lookup(main.domain, avvy.TYPES.AVATAR)
const nickname = await avvy.lookup(main.domain, avvy.TYPES.NICKNAME)
get('#avatar').style.backgroundImage = `url(${avatar})`
get('#address').innerText = main.domain
get('#nickname').innerText = nickname
get('#inner').style.display = 'block'
}
main()
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment