aboutsummaryrefslogtreecommitdiffstats
path: root/ui/app/app.js
diff options
context:
space:
mode:
Diffstat (limited to 'ui/app/app.js')
-rw-r--r--ui/app/app.js107
1 files changed, 78 insertions, 29 deletions
diff --git a/ui/app/app.js b/ui/app/app.js
index ec869145e..2f4136b78 100644
--- a/ui/app/app.js
+++ b/ui/app/app.js
@@ -26,6 +26,7 @@ const LoadingIndicator = require('./loading')
const txHelper = require('../lib/tx-helper')
const SandwichExpando = require('sandwich-expando')
const MenuDroppo = require('menu-droppo')
+const DropMenuItem = require('./components/drop-menu-item')
module.exports = connect(mapStateToProps)(App)
@@ -130,37 +131,85 @@ App.prototype.renderAppBar = function(){
return (
- h('.app-header.flex-row.flex-space-between', {
- style: {
- alignItems: 'center',
- visibility: state.isUnlocked ? 'visibile' : 'none',
- background: state.isUnlocked ? 'white' : 'none',
- height: '36px',
- },
- }, state.isUnlocked && [
-
- // mini logo
- h('img', {
- height: 24,
- width: 24,
- src: '/images/icon-128.png',
- }),
-
- // metamask namlterChangese
- h('h1', 'MetaMask'),
-
- // hamburger
- h(SandwichExpando, {
- width: 16,
- barHeight: 2,
- padding: 0,
- isOpen: state.menuOpen,
- color: 'rgb(247,146,30)',
- onClick: () => this.props.dispatch(actions.toggleMenu()),
- }),
+ h('div', [
- ])
+ h('.app-header.flex-row.flex-space-between', {
+ style: {
+ alignItems: 'center',
+ visibility: state.isUnlocked ? 'visibile' : 'none',
+ background: state.isUnlocked ? 'white' : 'none',
+ height: '36px',
+ },
+ }, state.isUnlocked && [
+
+ // mini logo
+ h('img', {
+ height: 24,
+ width: 24,
+ src: '/images/icon-128.png',
+ }),
+
+ // metamask namlterChangese
+ h('h1', 'MetaMask'),
+
+ // hamburger
+ h(SandwichExpando, {
+ width: 16,
+ barHeight: 2,
+ padding: 0,
+ isOpen: state.menuOpen,
+ color: 'rgb(247,146,30)',
+ onClick: (event) => {
+ event.preventDefault()
+ event.stopPropagation()
+ this.props.dispatch(actions.toggleMenu())
+ },
+ }),
+ ]),
+ h(MenuDroppo, {
+ style: {
+ right: '0px',
+ },
+ innerStyle: {
+ background: 'white',
+
+ // This shadow is hidden by the surrounding bounding box.
+ // Maybe worth revealing in the future:
+ boxShadow: '1px 1px 2px rgba(0,0,0,0.1)',
+ float: 'right',
+ },
+ isOpen: state.menuOpen,
+ onClickOutside: (event) => {
+ this.props.dispatch(actions.closeMenu())
+ },
+ }, [ // DROP MENU ITEMS
+ h('menu', [
+ h('style', '.drop-menu-item:hover { background:rgb(235, 235, 235); }'),
+
+ h(DropMenuItem, {
+ closeMenu:() => this.props.dispatch(actions.closeMenu()),
+ action:() => this.props.dispatch(actions.showConfigPage()),
+ icon: null,
+ label: 'Settings'
+ }),
+
+ h(DropMenuItem, {
+ closeMenu:() => this.props.dispatch(actions.closeMenu()),
+ action:() => this.props.dispatch(actions.lockMetamask()),
+ icon: null,
+ label: 'Lock Account'
+ }),
+
+ h(DropMenuItem, {
+ closeMenu:() => this.props.dispatch(actions.closeMenu()),
+ action:() => this.props.dispatch(actions.showInfoPage()),
+ icon: null,
+ label: 'Help'
+ }),
+ ]),
+ ]),
+ ])
)
}