diff options
Diffstat (limited to 'ui/app')
| -rw-r--r-- | ui/app/components/blockies/blockies-component.js | 17 | ||||
| -rw-r--r-- | ui/app/components/identicon.js | 19 |
2 files changed, 27 insertions, 9 deletions
diff --git a/ui/app/components/blockies/blockies-component.js b/ui/app/components/blockies/blockies-component.js index d6defda16..b3a97ced4 100644 --- a/ui/app/components/blockies/blockies-component.js +++ b/ui/app/components/blockies/blockies-component.js @@ -3,25 +3,30 @@ const createElement = require('react').createElement const blockies = require("ethereum-blockies"); class BlockiesIdenticon extends Component { + constructor(props) { super(props); } + getOpts () { return { - seed: this.props.seed || "foo", - color: this.props.color || "#dfe", - bgcolor: this.props.bgcolor || "#a71", - size: this.props.size || 15, - scale: this.props.scale || 3, - spotcolor: this.props.spotcolor || "#000" + seed: this.props.seed, + color: this.props.color, + bgcolor: this.props.bgcolor, + size: this.props.size, + scale: this.props.scale, + spotcolor: this.props.spotcolor, }; } + componentDidMount() { this.draw(); } + draw() { blockies.render(this.getOpts(), this.canvas); } + render() { return createElement("canvas", {ref: canvas => this.canvas = canvas}); } diff --git a/ui/app/components/identicon.js b/ui/app/components/identicon.js index 9e9b82aae..c1dc0fb5c 100644 --- a/ui/app/components/identicon.js +++ b/ui/app/components/identicon.js @@ -32,9 +32,22 @@ IdenticonComponent.prototype.render = function () { return address ? ( useBlockie - ? h(BlockiesIdenticon, { - seed: address, - }) + ? h('div', { + className: `${className} identicon`, + style: { + display: 'flex', + alignItems: 'center', + justifyContent: 'center', + height: diameter, + width: diameter, + borderRadius: diameter / 2, + overflow: 'hidden', + }, + }, [ + h(BlockiesIdenticon, { + seed: address + }) + ]) : h('div', { className: `${className} identicon`, key: 'identicon-' + address, |