diff options
author | Chi Kei Chan <chikeichan@gmail.com> | 2017-12-08 01:47:31 +0800 |
---|---|---|
committer | GitHub <noreply@github.com> | 2017-12-08 01:47:31 +0800 |
commit | e0d0e19c925224bddf56a4088fb9c402d995d79f (patch) | |
tree | f6306a17629d68e217488ab15af7ce5029c07335 /old-ui/app/components/mascot.js | |
parent | 2e9137dddd4abd07cc45caa670f09bdc9559bbbb (diff) | |
parent | efa894a0c3af0b8182b639c25b4c249b083009cf (diff) | |
download | tangerine-wallet-browser-e0d0e19c925224bddf56a4088fb9c402d995d79f.tar.gz tangerine-wallet-browser-e0d0e19c925224bddf56a4088fb9c402d995d79f.tar.zst tangerine-wallet-browser-e0d0e19c925224bddf56a4088fb9c402d995d79f.zip |
Merge pull request #2697 from danjm/MM-333-auto-add-users-to-new-UI
[NewUI] Auto add users to new ui
Diffstat (limited to 'old-ui/app/components/mascot.js')
-rw-r--r-- | old-ui/app/components/mascot.js | 59 |
1 files changed, 59 insertions, 0 deletions
diff --git a/old-ui/app/components/mascot.js b/old-ui/app/components/mascot.js new file mode 100644 index 000000000..973ec2cad --- /dev/null +++ b/old-ui/app/components/mascot.js @@ -0,0 +1,59 @@ +const inherits = require('util').inherits +const Component = require('react').Component +const h = require('react-hyperscript') +const metamaskLogo = require('metamask-logo') +const debounce = require('debounce') + +module.exports = Mascot + +inherits(Mascot, Component) +function Mascot () { + Component.call(this) + this.logo = metamaskLogo({ + followMouse: true, + pxNotRatio: true, + width: 200, + height: 200, + }) + + this.refollowMouse = debounce(this.logo.setFollowMouse.bind(this.logo, true), 1000) + this.unfollowMouse = this.logo.setFollowMouse.bind(this.logo, false) +} + +Mascot.prototype.render = function () { + // this is a bit hacky + // the event emitter is on `this.props` + // and we dont get that until render + this.handleAnimationEvents() + + return h('#metamask-mascot-container', { + style: { zIndex: 0 }, + }) +} + +Mascot.prototype.componentDidMount = function () { + var targetDivId = 'metamask-mascot-container' + var container = document.getElementById(targetDivId) + container.appendChild(this.logo.container) +} + +Mascot.prototype.componentWillUnmount = function () { + this.animations = this.props.animationEventEmitter + this.animations.removeAllListeners() + this.logo.container.remove() + this.logo.stopAnimation() +} + +Mascot.prototype.handleAnimationEvents = function () { + // only setup listeners once + if (this.animations) return + this.animations = this.props.animationEventEmitter + this.animations.on('point', this.lookAt.bind(this)) + this.animations.on('setFollowMouse', this.logo.setFollowMouse.bind(this.logo)) +} + +Mascot.prototype.lookAt = function (target) { + this.unfollowMouse() + this.logo.lookAt(target) + this.refollowMouse() +} |