mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-12-23 09:52:26 +01:00
Merge pull request #1729 from MetaMask/i1707-ClarifySearchingIndication
Clarify network searching indication
This commit is contained in:
commit
27c651d8da
@ -2,6 +2,9 @@
|
|||||||
|
|
||||||
## Current Master
|
## Current Master
|
||||||
|
|
||||||
|
- Visually indicate that network spinner is a menu.
|
||||||
|
- Indicate what network is being searched for when disconnected.
|
||||||
|
|
||||||
## 3.8.1 2017-6-30
|
## 3.8.1 2017-6-30
|
||||||
|
|
||||||
- Temporarily disabled loading popular tokens by default to improve performance.
|
- Temporarily disabled loading popular tokens by default to improve performance.
|
||||||
|
@ -68,7 +68,7 @@ App.prototype.render = function () {
|
|||||||
const { isLoading, loadingMessage, transForward, network } = props
|
const { isLoading, loadingMessage, transForward, network } = props
|
||||||
const isLoadingNetwork = network === 'loading'
|
const isLoadingNetwork = network === 'loading'
|
||||||
const loadMessage = loadingMessage || isLoadingNetwork ?
|
const loadMessage = loadingMessage || isLoadingNetwork ?
|
||||||
'Searching for Network' : null
|
`Connecting to ${this.getNetworkName()}` : null
|
||||||
|
|
||||||
log.debug('Main ui render function')
|
log.debug('Main ui render function')
|
||||||
|
|
||||||
@ -136,7 +136,7 @@ App.prototype.renderAppBar = function () {
|
|||||||
},
|
},
|
||||||
}, [
|
}, [
|
||||||
|
|
||||||
h('div', {
|
h('div.left-menu-section', {
|
||||||
style: {
|
style: {
|
||||||
display: 'flex',
|
display: 'flex',
|
||||||
flexDirection: 'row',
|
flexDirection: 'row',
|
||||||
@ -151,21 +151,15 @@ App.prototype.renderAppBar = function () {
|
|||||||
src: '/images/icon-128.png',
|
src: '/images/icon-128.png',
|
||||||
}),
|
}),
|
||||||
|
|
||||||
h('#network-spacer.flex-center', {
|
h(NetworkIndicator, {
|
||||||
style: {
|
network: this.props.network,
|
||||||
marginRight: '-72px',
|
provider: this.props.provider,
|
||||||
|
onClick: (event) => {
|
||||||
|
event.preventDefault()
|
||||||
|
event.stopPropagation()
|
||||||
|
this.setState({ isNetworkMenuOpen: !isNetworkMenuOpen })
|
||||||
},
|
},
|
||||||
}, [
|
}),
|
||||||
h(NetworkIndicator, {
|
|
||||||
network: this.props.network,
|
|
||||||
provider: this.props.provider,
|
|
||||||
onClick: (event) => {
|
|
||||||
event.preventDefault()
|
|
||||||
event.stopPropagation()
|
|
||||||
this.setState({ isNetworkMenuOpen: !isNetworkMenuOpen })
|
|
||||||
},
|
|
||||||
}),
|
|
||||||
]),
|
|
||||||
]),
|
]),
|
||||||
|
|
||||||
// metamask name
|
// metamask name
|
||||||
@ -555,6 +549,27 @@ App.prototype.renderCustomOption = function (provider) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
App.prototype.getNetworkName = function () {
|
||||||
|
const { provider } = this.props
|
||||||
|
const providerName = provider.type
|
||||||
|
|
||||||
|
let name
|
||||||
|
|
||||||
|
if (providerName === 'mainnet') {
|
||||||
|
name = 'Main Ethereum Network'
|
||||||
|
} else if (providerName === 'ropsten') {
|
||||||
|
name = 'Ropsten Test Network'
|
||||||
|
} else if (providerName === 'kovan') {
|
||||||
|
name = 'Kovan Test Network'
|
||||||
|
} else if (providerName === 'rinkeby') {
|
||||||
|
name = 'Rinkeby Test Network'
|
||||||
|
} else {
|
||||||
|
name = 'Unknown Private Network'
|
||||||
|
}
|
||||||
|
|
||||||
|
return name
|
||||||
|
}
|
||||||
|
|
||||||
App.prototype.renderCommonRpc = function (rpcList, provider) {
|
App.prototype.renderCommonRpc = function (rpcList, provider) {
|
||||||
const { rpcTarget } = provider
|
const { rpcTarget } = provider
|
||||||
const props = this.props
|
const props = this.props
|
||||||
|
@ -22,15 +22,24 @@ Network.prototype.render = function () {
|
|||||||
let iconName, hoverText
|
let iconName, hoverText
|
||||||
|
|
||||||
if (networkNumber === 'loading') {
|
if (networkNumber === 'loading') {
|
||||||
return h('img.network-indicator', {
|
return h('span', {
|
||||||
title: 'Attempting to connect to blockchain.',
|
|
||||||
onClick: (event) => this.props.onClick(event),
|
|
||||||
style: {
|
style: {
|
||||||
width: '27px',
|
display: 'flex',
|
||||||
marginRight: '-27px',
|
alignItems: 'center',
|
||||||
|
flexDirection: 'row',
|
||||||
},
|
},
|
||||||
src: 'images/loading.svg',
|
onClick: (event) => this.props.onClick(event),
|
||||||
})
|
}, [
|
||||||
|
h('img', {
|
||||||
|
title: 'Attempting to connect to blockchain.',
|
||||||
|
style: {
|
||||||
|
width: '27px',
|
||||||
|
},
|
||||||
|
src: 'images/loading.svg',
|
||||||
|
}),
|
||||||
|
h('i.fa.fa-sort-desc'),
|
||||||
|
])
|
||||||
|
|
||||||
} else if (providerName === 'mainnet') {
|
} else if (providerName === 'mainnet') {
|
||||||
hoverText = 'Main Ethereum Network'
|
hoverText = 'Main Ethereum Network'
|
||||||
iconName = 'ethereum-network'
|
iconName = 'ethereum-network'
|
||||||
|
Loading…
Reference in New Issue
Block a user