Display address identicon in result

This commit is contained in:
Boris Kubiak 2018-02-09 15:18:16 +01:00
parent 50a921fd66
commit 1acaa6c64b
3 changed files with 29 additions and 2 deletions

5
package-lock.json generated
View file

@ -1166,6 +1166,11 @@
"inherits": "2.0.3"
}
},
"blockies": {
"version": "0.0.2",
"resolved": "https://registry.npmjs.org/blockies/-/blockies-0.0.2.tgz",
"integrity": "sha1-Iq1Y2k9rOCvHm/Q4bFggxwBH5O0="
},
"bluebird": {
"version": "3.5.1",
"resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.5.1.tgz",

View file

@ -7,6 +7,7 @@
"babel-loader": "^7.1.2",
"babel-preset-env": "^1.6.0",
"babel-preset-stage-3": "^6.24.1",
"blockies": "0.0.2",
"bootstrap": "^4.0.0",
"cross-env": "^5.0.5",
"css-loader": "^0.28.7",

View file

@ -1,21 +1,42 @@
<template>
<div class="panel result">
<div>Address: <span class="output" v-text="address"></span></div>
<div>Private key: <span class="output" v-text="privateKey"></span></div>
<div class="row">
<div class="float-left" id="identicon"></div>
<div class="col">
<div>Address: <span class="output" v-text="address"></span></div>
<div>Private key: <span class="output" v-text="privateKey"></span></div>
</div>
</div>
</div>
</template>
<script>
import * as blockies from 'blockies';
export default {
props: {
address: String,
privateKey: String
},
watch: {
address(addr) {
const id = document.getElementById('identicon');
id.innerHTML= '';
if(addr){
id.appendChild(blockies({seed: addr.toLocaleLowerCase(), scale: 6}));
}
}
}
}
</script>
<style lang="sass" scoped>
@import "../css/variables"
#identicon
width: 48px
height: 48px
margin-right: 15px
background-color: $panel-background-clear
.output
font-family: monospace
font-size: 1.2em