Browse Source

code styling update

all-modes
Petr Balashov 8 years ago
parent
commit
01d54b5581
  1. 27
      react/src/components/dashboard/atomic.js
  2. 2
      react/src/components/dashboard/coinTile.js
  3. 20
      react/src/components/dashboard/coinTileItem.js
  4. 8
      react/src/components/dashboard/dashboard.js
  5. 2
      react/src/components/dashboard/edex.js
  6. 74
      react/src/components/dashboard/jumblr.js
  7. 35
      react/src/components/dashboard/loginModal.js
  8. 40
      react/src/components/dashboard/navbar.js
  9. 36
      react/src/components/dashboard/receiveCoin.js
  10. 162
      react/src/components/dashboard/sendCoin.js
  11. 207
      react/src/components/dashboard/settings.js
  12. 4
      react/src/components/dashboard/walletsData.js
  13. 34
      react/src/translate/en.js

27
react/src/components/dashboard/atomic.js

@ -483,14 +483,18 @@ class Atomic extends React.Component {
return ( return (
<div className="page" style={{ marginLeft: '0' }}> <div className="page" style={{ marginLeft: '0' }}>
<div className="page-content" id="section-iguana-atomic-explorer"> <div className="page-content" id="section-iguana-atomic-explorer">
<div className="row" id="atomic-explorer" data-plugin="masonry"> <div className="row" id="atomic-explorer">
<div className="col-xlg-12 col-md-12"> <div className="col-xlg-12 col-md-12">
<h4 className="font-size-14 text-uppercase">Atomic Explorer</h4> <h4 className="font-size-14 text-uppercase">Atomic Explorer</h4>
<div className="panel panel-bordered"> <div className="panel panel-bordered">
<div className="panel-body"> <div className="panel-body">
<div className="col-sm-4 col-xs-12"> <div className="col-sm-4 col-xs-12">
<div className="form-group"> <div className="form-group">
<select className="form-control form-material" id="atomic_explorer_select_coin_options" onChange={this.updateSelectedCoin}> <select
className="form-control
form-material"
id="atomic_explorer_select_coin_options"
onChange={ this.updateSelectedCoin }>
<option value="-">{ translate('INDEX.SELECT_COIN') }</option> <option value="-">{ translate('INDEX.SELECT_COIN') }</option>
<AddCoinOptionsCrypto /> <AddCoinOptionsCrypto />
<AddCoinOptionsAC /> <AddCoinOptionsAC />
@ -499,16 +503,29 @@ class Atomic extends React.Component {
</div> </div>
</div> </div>
<div className="col-sm-4 col-xs-12" style={{ textAlign: 'center' }}> <div className="col-sm-4 col-xs-12" style={{ textAlign: 'center' }}>
<select className="form-control form-material" id="atomic_explorer_select_command_options" onChange={this.updateSelectedAPI}> <select
className="form-control form-material"
id="atomic_explorer_select_command_options"
onChange={this.updateSelectedAPI}>
<option value="">-{ translate('ATOMIC.SELECT_COMMAND') }-</option> <option value="">-{ translate('ATOMIC.SELECT_COMMAND') }-</option>
{ this.renderAtomicOptions() } { this.renderAtomicOptions() }
</select> </select>
</div> </div>
<div className="col-sm-4 col-xs-12" style={{ textAlign: 'center' }}> <div className="col-sm-4 col-xs-12" style={{ textAlign: 'center' }}>
<input type="text" className="form-control" id="atomic_explorer_input_data" name="atomic_explorer_input_data" placeholder={translate('ATOMIC.INPUT_PLACEHOLDER')} onChange={this.updateInput} /> <input
type="text"
className="form-control"
id="atomic_explorer_input_data"
name="atomic_explorer_input_data"
placeholder={ translate('ATOMIC.INPUT_PLACEHOLDER') }
onChange={ this.updateInput } />
</div> </div>
<div className="col-sm-12 col-xs-12" style={{ textAlign: 'center' }}> <div className="col-sm-12 col-xs-12" style={{ textAlign: 'center' }}>
<button type="button" className="btn btn-primary waves-effect waves-light" id="atomic_explorer_getcoinpeers_btn" onClick={this.getAtomicData}>{translate('ATOMIC.SUBMIT')}</button> <button
type="button"
className="btn btn-primary waves-effect waves-light"
id="atomic_explorer_getcoinpeers_btn"
onClick={ this.getAtomicData }>{ translate('ATOMIC.SUBMIT') }</button>
</div> </div>
</div> </div>
</div> </div>

2
react/src/components/dashboard/coinTile.js

@ -363,7 +363,7 @@ class CoinTile extends React.Component {
<h3 className="panel-title">{ translate('INDEX.ACTIVE_COINS') }</h3> <h3 className="panel-title">{ translate('INDEX.ACTIVE_COINS') }</h3>
</div> </div>
</div> </div>
<div className="wallet-widgets-list" data-plugin="pageAsideScroll"> <div className="wallet-widgets-list">
<div data-role="container"> <div data-role="container">
<div data-role="content"> <div data-role="content">
<div className="list-group row wallet-widgets-row"> <div className="list-group row wallet-widgets-row">

20
react/src/components/dashboard/coinTileItem.js

@ -65,7 +65,10 @@ class CoinTileItem extends React.Component {
Store.dispatch(getKMDAddressesNative(coin, mode, useAddress)); Store.dispatch(getKMDAddressesNative(coin, mode, useAddress));
Store.dispatch(getShepherdCache(JSON.parse(sessionStorage.getItem('IguanaActiveAccount')).pubkey, coin)); Store.dispatch(getShepherdCache(JSON.parse(sessionStorage.getItem('IguanaActiveAccount')).pubkey, coin));
if (this.props && this.props.Dashboard && this.props.Dashboard.activeHandle && this.props.Dashboard.activeHandle[coin]) { if (this.props &&
this.props.Dashboard &&
this.props.Dashboard.activeHandle &&
this.props.Dashboard.activeHandle[coin]) {
if (!this.props.ActiveCoin.addresses) { if (!this.props.ActiveCoin.addresses) {
Store.dispatch(getAddressesByAccount(coin, mode)); Store.dispatch(getAddressesByAccount(coin, mode));
} }
@ -134,12 +137,17 @@ class CoinTileItem extends React.Component {
const { item } = this.props; const { item } = this.props;
return ( return (
<div className="list-group-item col-xlg-6 col-lg-12 wallet-widgets-info" data-edexcoincode="{item.coin}"> <div className="list-group-item col-xlg-6 col-lg-12 wallet-widgets-info">
<div className={ this.props.ActiveCoin.coin === item.coin ? 'widget widget-shadow active' : 'widget widget-shadow' }> <div className={ this.props.ActiveCoin.coin === item.coin ? 'widget widget-shadow active' : 'widget widget-shadow' }>
<div className="widget-content text-center bg-white padding-20 edexcoin-logo" data-edexcoincode="{item.coin}" data-edexcoinmodecode="{item.modecode}" data-edexcoinname="{item.coinname}" onClick={() => this.dashboardChangeActiveCoin(item.coin, item.mode)}> <div
<a className="avatar margin-bottom-5" href="javascript:void(0)" id="edexcoin-logo"> className="widget-content text-center bg-white padding-20 edexcoin-logo"
<img className="img-responsive" src={'assets/images/cryptologo/' + item.coinlogo + '.png'} alt="{item.coinname}"/> onClick={ () => this.dashboardChangeActiveCoin(item.coin, item.mode) }>
<span className={'badge up badge-' + item.modecolor} id="basfull" data-edexcoincode="{item.coin}" data-toggle="tooltip" data-placement="top" data-original-title="{item.modetip}">{item.modecode}</span> <a className="avatar margin-bottom-5" id="edexcoin-logo">
<img
className="img-responsive"
src={ 'assets/images/cryptologo/' + item.coinlogo + '.png' }
alt={ item.coinname }/>
<span className={ 'badge up badge-' + item.modecolor } id="basfull">{ item.modecode }</span>
</a> </a>
<div className="coin-name">{ item.coinname } ({ item.coinlogo.toUpperCase() })</div> <div className="coin-name">{ item.coinname } ({ item.coinlogo.toUpperCase() })</div>
</div> </div>

8
react/src/components/dashboard/dashboard.js

@ -30,7 +30,9 @@ class Dashboard extends React.Component {
return ( return (
<div style={{ height: '100%' }}> <div style={{ height: '100%' }}>
<div className={this.props.Dashboard.activeSection === 'wallets' ? 'page-main' : ''} id="section-dashboard" data-edexcoin="COIN"> <div
className={ this.props.Dashboard.activeSection === 'wallets' ? 'page-main' : '' }
id="section-dashboard">
<Navbar {...this.props} /> <Navbar {...this.props} />
<div className={ this.props.Dashboard.activeSection === 'wallets' ? 'show' : 'hide' }> <div className={ this.props.Dashboard.activeSection === 'wallets' ? 'show' : 'hide' }>
<CoinTile {...this.props} /> <CoinTile {...this.props} />
@ -65,7 +67,9 @@ class Dashboard extends React.Component {
} }
render() { render() {
if (this.props && this.props.Main && this.props.Main.isLoggedIn) { if (this.props &&
this.props.Main &&
this.props.Main.isLoggedIn) {
return this.renderDashboard(); return this.renderDashboard();
} else { } else {
return null; return null;

2
react/src/components/dashboard/edex.js

@ -4,7 +4,7 @@ import { translate } from '../../translate/translate';
class EDEX extends React.Component { class EDEX extends React.Component {
render() { render() {
return ( return (
<div className="page" data-animsition-in="fade-in" data-animsition-out="fade-out" style={{marginLeft: '0px'}}> <div className="page" style={{ marginLeft: '0px' }}>
<div className="page-content" id="section-easydex"> <div className="page-content" id="section-easydex">
<h2>Coming Soon!</h2> <h2>Coming Soon!</h2>
</div> </div>

74
react/src/components/dashboard/jumblr.js

@ -30,9 +30,9 @@ class Jumblr extends React.Component {
render() { render() {
return ( return (
<div className="page" data-animsition-in="fade-in" data-animsition-out="fade-out" style={{marginLeft: '0'}}> <div className="page" style={{ marginLeft: '0' }}>
<div className="page-content" id="section-jumblr"> <div className="page-content" id="section-jumblr">
<div className="row" id="jumblr_dashboard" data-plugin="masonry"> <div className="row" id="jumblr_dashboard">
<div className="col-xs-12" id="jumblr_testing_alert"> <div className="col-xs-12" id="jumblr_testing_alert">
<div className="alert alert-danger" role="alert"> <div className="alert alert-danger" role="alert">
<button type="button" className="close" data-dismiss="alert" aria-label="Close"> <button type="button" className="close" data-dismiss="alert" aria-label="Close">
@ -68,10 +68,21 @@ class Jumblr extends React.Component {
<div className="col-xs-12"> <div className="col-xs-12">
<div className="panel-group" id="jumber_quick_info" aria-multiselectable="true" role="tablist"> <div className="panel-group" id="jumber_quick_info" aria-multiselectable="true" role="tablist">
<div className="panel"> <div className="panel">
<div className="panel-heading" id="jumblr_security_notes" role="tab" onClick={() => this.openTab(0)}> <div
<a className={this.state.activeTab === 0 ? 'panel-title' : 'panel-title collapsed'} data-toggle="collapse" data-parent="#jumber_quick_info" aria-expanded="true" aria-controls="jumblr_security_notes_1">{translate('JUMBLR.FEW_SECURITY_NOTES')}</a> className="panel-heading"
id="jumblr_security_notes"
role="tab"
onClick={ () => this.openTab(0) }>
<a
className={ this.state.activeTab === 0 ? 'panel-title' : 'panel-title collapsed' }
aria-expanded="true"
aria-controls="jumblr_security_notes_1">{ translate('JUMBLR.FEW_SECURITY_NOTES') }</a>
</div> </div>
<div className={this.state.activeTab === 0 ? 'panel-collapse collapse in' : 'panel-collapse collapse'} id="jumblr_security_notes_1" aria-labelledby="jumblr_security_notes" role="tabpanel"> <div
className={ this.state.activeTab === 0 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
id="jumblr_security_notes_1"
aria-labelledby="jumblr_security_notes"
role="tabpanel">
<div className="panel-body"> <div className="panel-body">
<ul> <ul>
<li>{ translate('JUMBLR.FEW_SECURITY_NOTES_DESC1') }</li> <li>{ translate('JUMBLR.FEW_SECURITY_NOTES_DESC1') }</li>
@ -84,10 +95,21 @@ class Jumblr extends React.Component {
</div> </div>
</div> </div>
<div className="panel"> <div className="panel">
<div className="panel-heading" id="jumblr_access_funds" role="tab" onClick={() => this.openTab(1)}> <div
<a className={this.state.activeTab === 1 ? 'panel-title' : 'panel-title collapsed'} data-toggle="collapse" data-parent="#jumber_quick_info" aria-expanded="false" aria-controls="jumblr_access_funds_2">{translate('JUMBLR.ACCESS_JUMBLR_FUNDS')}</a> className="panel-heading"
id="jumblr_access_funds"
role="tab"
onClick={ () => this.openTab(1) }>
<a
className={ this.state.activeTab === 1 ? 'panel-title' : 'panel-title collapsed' }
aria-expanded="false"
aria-controls="jumblr_access_funds_2">{ translate('JUMBLR.ACCESS_JUMBLR_FUNDS') }</a>
</div> </div>
<div className={this.state.activeTab === 1 ? 'panel-collapse collapse in' : 'panel-collapse collapse'} id="jumblr_access_funds_2" aria-labelledby="jumblr_access_funds" role="tabpanel"> <div
className={ this.state.activeTab === 1 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
id="jumblr_access_funds_2"
aria-labelledby="jumblr_access_funds"
role="tabpanel">
<div className="panel-body"> <div className="panel-body">
<p>{ translate('JUMBLR.ADDRESS_ACCESSIBLE_EASILY') }</p> <p>{ translate('JUMBLR.ADDRESS_ACCESSIBLE_EASILY') }</p>
<ul> <ul>
@ -117,9 +139,15 @@ class Jumblr extends React.Component {
</div> </div>
<div className="panel"> <div className="panel">
<div className="panel-heading" id="jumblr_using_jumblr" role="tab" onClick={ () => this.openTab(2) }> <div className="panel-heading" id="jumblr_using_jumblr" role="tab" onClick={ () => this.openTab(2) }>
<a className={this.state.activeTab === 2 ? 'panel-title' : 'panel-title collapsed'} data-toggle="collapse" data-parent="#jumber_quick_info" aria-expanded="false" aria-controls="jumblr_using_jumblr_3">{translate('JUMBLR.USING_JUMBLR')}</a> <a
className={ this.state.activeTab === 2 ? 'panel-title' : 'panel-title collapsed' }
aria-expanded="false"
aria-controls="jumblr_using_jumblr_3">{ translate('JUMBLR.USING_JUMBLR') }</a>
</div> </div>
<div className={this.state.activeTab === 2 ? 'panel-collapse collapse in' : 'panel-collapse collapse'} id="jumblr_using_jumblr_3" aria-labelledby="jumblr_using_jumblr" <div
className={ this.state.activeTab === 2 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
id="jumblr_using_jumblr_3"
aria-labelledby="jumblr_using_jumblr"
role="tabpanel"> role="tabpanel">
<div className="panel-body"> <div className="panel-body">
<ul> <ul>
@ -157,11 +185,16 @@ class Jumblr extends React.Component {
<tr> <tr>
<td>BTC Jumblr</td> <td>BTC Jumblr</td>
<td> <td>
<button type="button" className="btn btn-animate btn-animate-side btn-default btn-sm waves-effect waves-light jumblr_show_hide_addr_btc_btn" data-jumblr="BTCjumblr"> <button type="button" className="btn btn-animate btn-animate-side btn-default btn-sm waves-effect waves-light jumblr_show_hide_addr_btc_btn">
<span><i className="icon fa-eye" aria-hidden="true"></i> { translate('JUMBLR.SHOW_HIDE') }</span> <span><i className="icon fa-eye" aria-hidden="true"></i> { translate('JUMBLR.SHOW_HIDE') }</span>
</button> </button>
<span className="label label-lg label-outline label-success" id="jumblr_BTCjumblr" style={{display: 'none'}}></span> <span
<span className="label label-lg label-outline label-default" id="jumblr_BTCjumblr_showhide">{translate('JUMBLR.HIDDEN')}</span> className="label label-lg label-outline label-success"
id="jumblr_BTCjumblr"
style={{ display: 'none' }}></span>
<span
className="label label-lg label-outline label-default"
id="jumblr_BTCjumblr_showhide">{ translate('JUMBLR.HIDDEN') }</span>
</td> </td>
</tr> </tr>
<tr> <tr>
@ -173,11 +206,18 @@ class Jumblr extends React.Component {
<tr> <tr>
<td>KMD Jumblr</td> <td>KMD Jumblr</td>
<td> <td>
<button type="button" className="btn btn-animate btn-animate-side btn-default btn-sm waves-effect waves-light jumblr_show_hide_addr_kmd_btn" data-jumblr="KMDjumblr"> <button type="button" className="btn btn-animate btn-animate-side btn-default btn-sm waves-effect waves-light jumblr_show_hide_addr_kmd_btn">
<span><i className="icon fa-eye" aria-hidden="true"></i> {translate('JUMBLR.SHOW_HIDE')}</span> <span>
<i className="icon fa-eye" aria-hidden="true"></i> { translate('JUMBLR.SHOW_HIDE') }
</span>
</button> </button>
<span className="label label-lg label-outline label-success" id="jumblr_KMDjumblr" style={{display: 'none'}}></span> <span
<span className="label label-lg label-outline label-default" id="jumblr_KMDjumblr_showhide">{translate('JUMBLR.HIDDEN')}</span> className="label label-lg label-outline label-success"
id="jumblr_KMDjumblr"
style={{ display: 'none' }}></span>
<span
className="label label-lg label-outline label-default"
id="jumblr_KMDjumblr_showhide">{ translate('JUMBLR.HIDDEN') }</span>
</td> </td>
</tr> </tr>
</tbody> </tbody>

35
react/src/components/dashboard/loginModal.js

@ -48,18 +48,28 @@ class LoginModal extends React.Component {
if (this.props.Dashboard.activateLoginModal) { if (this.props.Dashboard.activateLoginModal) {
return ( return (
<div> <div>
<div className={'modal modal-3d-sign add-coin-modal ' + (this.state.display ? 'show in' : 'fade hide')} id="AddCoinDilogModel-login" aria-hidden="true" aria-labelledby="AddCoinDilogModel-login" role="dialog" tabIndex="-1"> <div
className={ 'modal modal-3d-sign add-coin-modal ' + (this.state.display ? 'show in' : 'fade hide') }
id="AddCoinDilogModel-login"
aria-hidden="true"
aria-labelledby="AddCoinDilogModel-login"
role="dialog"
tabIndex="-1">
<div className="modal-dialog modal-center modal-lg"> <div className="modal-dialog modal-center modal-lg">
<div className="modal-content"> <div className="modal-content">
<div className="modal-header bg-orange-a400 wallet-send-header"> <div className="modal-header bg-orange-a400 wallet-send-header">
<button type="button" className="close white" data-dismiss="modal" aria-label="Close" onClick={this.dismiss}> <button
type="button"
className="close white"
aria-label="Close"
onClick={ this.dismiss }>
<span aria-hidden="true">×</span> <span aria-hidden="true">×</span>
</button> </button>
<h4 className="modal-title white">{ translate('INDEX.SELECT_A_COIN') }</h4> <h4 className="modal-title white">{ translate('INDEX.SELECT_A_COIN') }</h4>
</div> </div>
<div className="modal-body"> <div className="modal-body">
<div id="wallet-login"> <div id="wallet-login">
<div className="page animsition vertical-align text-center fade-in" data-animsition-in="fade-in" data-animsition-out="fade-out"> <div className="page animsition vertical-align text-center fade-in">
<div className="page-content vertical-align-middle"> <div className="page-content vertical-align-middle">
<div className="brand"> <div className="brand">
<img className="brand-img" src="assets/images/easydex-logo-big.png" alt="SuperNET Iguana" /> <img className="brand-img" src="assets/images/easydex-logo-big.png" alt="SuperNET Iguana" />
@ -69,14 +79,25 @@ class LoginModal extends React.Component {
<h4 style={{ color: '#fff' }} id="login-welcome">{ translate('INDEX.WELCOME_LOGIN') }</h4> <h4 style={{ color: '#fff' }} id="login-welcome">{ translate('INDEX.WELCOME_LOGIN') }</h4>
<div className="login-form"> <div className="login-form">
<div className="form-group form-material floating"> <div className="form-group form-material floating">
<input type={this.state.seedInputVisibility ? 'text' : 'password'} className="form-control" name="loginPassphrase" id="password" onChange={this.updateInput} /> <input
<i className={this.state.seedInputVisibility ? 'seed-toggle fa fa-eye-slash' : 'seed-toggle fa fa-eye'} onClick={this.toggleSeedInputVisibility}></i> type={ this.state.seedInputVisibility ? 'text' : 'password' }
className="form-control"
name="loginPassphrase"
id="password"
onChange={ this.updateInput } />
<i
className={ this.state.seedInputVisibility ? 'seed-toggle fa fa-eye-slash' : 'seed-toggle fa fa-eye' }
onClick={ this.toggleSeedInputVisibility }></i>
<label className="floating-label" htmlFor="inputPassword">{translate('INDEX.WALLET_SEED')}</label> <label className="floating-label" htmlFor="inputPassword">{translate('INDEX.WALLET_SEED')}</label>
</div> </div>
<button type="button" className="btn btn-primary btn-block" id="loginbtn" onClick={this.loginSeed} disabled={!this.state.loginPassphrase || !this.state.loginPassphrase.length}>{translate('INDEX.SIGN_IN')}</button> <button
type="button"
className="btn btn-primary btn-block"
id="loginbtn"
onClick={ this.loginSeed }
disabled={ !this.state.loginPassphrase || !this.state.loginPassphrase.length }>{ translate('INDEX.SIGN_IN') }</button>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>

40
react/src/components/dashboard/navbar.js

@ -50,8 +50,13 @@ class Navbar extends React.Component {
<i className="icon md-more" aria-hidden="true"></i> <i className="icon md-more" aria-hidden="true"></i>
</button> </button>
<div className="navbar-brand navbar-brand-center site-gridmenu-toggle" data-toggle="gridmenu"> <div className="navbar-brand navbar-brand-center site-gridmenu-toggle" data-toggle="gridmenu">
<img className="navbar-brand-logo hidden-xs" src="assets/images/easydex-logo-dashboard.png" title="SuperNET Igauana" /> <img
<img className="navbar-brand-logo hidden-md hidden-sm hidden-lg" src="assets/images/easydex-logo-dashboard-white.png" title="SuperNET Igauana white" /> className="navbar-brand-logo hidden-xs" src="assets/images/easydex-logo-dashboard.png"
title="SuperNET Iguana" />
<img
className="navbar-brand-logo hidden-md hidden-sm hidden-lg"
src="assets/images/easydex-logo-dashboard-white.png"
title="SuperNET Iguana white" />
<span className="navbar-brand-text hidden-xs"></span> <span className="navbar-brand-text hidden-xs"></span>
</div> </div>
<button type="button" className="navbar-toggle collapsed"> <button type="button" className="navbar-toggle collapsed">
@ -63,7 +68,7 @@ class Navbar extends React.Component {
<div className="collapse navbar-collapse navbar-collapse-toolbar" id="site-navbar-collapse"> <div className="collapse navbar-collapse navbar-collapse-toolbar" id="site-navbar-collapse">
<ul className="nav navbar-toolbar"> <ul className="nav navbar-toolbar">
<li className="hidden-float" id="toggleMenubar" style={{ display: 'none' }}> <li className="hidden-float" id="toggleMenubar" style={{ display: 'none' }}>
<a data-toggle="menubar" href="#" role="button"> <a role="button">
<i className="icon hamburger hamburger-arrow-left"> <i className="icon hamburger hamburger-arrow-left">
<span className="sr-only">{ translate('INDEX.TOGGLE_MENUBAR') }</span> <span className="sr-only">{ translate('INDEX.TOGGLE_MENUBAR') }</span>
<span className="hamburger-bar"></span> <span className="hamburger-bar"></span>
@ -71,17 +76,17 @@ class Navbar extends React.Component {
</a> </a>
</li> </li>
<li className={ this.props.Dashboard.activeSection === 'wallets' ? 'active nav-top-menu' : 'nav-top-menu' }> <li className={ this.props.Dashboard.activeSection === 'wallets' ? 'active nav-top-menu' : 'nav-top-menu' }>
<a href="javascript:void(0)" id="nav-dashboard" onClick={() => this.dashboardChangeSection('wallets')}> <a id="nav-dashboard" onClick={ () => this.dashboardChangeSection('wallets') }>
<i className="site-menu-icon" aria-hidden="true"></i> { translate('INDEX.WALLETS') } <i className="site-menu-icon" aria-hidden="true"></i> { translate('INDEX.WALLETS') }
</a> </a>
</li> </li>
<li className={ this.props.Dashboard.activeSection === 'edex' ? 'active nav-top-menu' : 'nav-top-menu' }> <li className={ this.props.Dashboard.activeSection === 'edex' ? 'active nav-top-menu' : 'nav-top-menu' }>
<a href="javascript:void(0)" id="nav-easydex" onClick={() => this.dashboardChangeSection('edex')}> <a id="nav-easydex" onClick={ () => this.dashboardChangeSection('edex') }>
<i className="site-menu-icon" aria-hidden="true"></i> EasyDEX <i className="site-menu-icon" aria-hidden="true"></i> EasyDEX
</a> </a>
</li> </li>
<li className={ this.props.Dashboard.activeSection === 'jumblr' ? 'active nav-top-menu' : 'nav-top-menu' } style={{ display: 'none' }}> <li className={ this.props.Dashboard.activeSection === 'jumblr' ? 'active nav-top-menu' : 'nav-top-menu' } style={{ display: 'none' }}>
<a href="javascript:void(0)" id="nav-jumblr" onClick={() => this.dashboardChangeSection('jumblr')}> <a id="nav-jumblr" onClick={ () => this.dashboardChangeSection('jumblr') }>
<i className="site-menu-icon" aria-hidden="true"></i> Jumblr <i className="site-menu-icon" aria-hidden="true"></i> Jumblr
</a> </a>
</li> </li>
@ -93,15 +98,18 @@ class Navbar extends React.Component {
</ul> </ul>
<ul className="nav navbar-toolbar navbar-right navbar-toolbar-right"> <ul className="nav navbar-toolbar navbar-right navbar-toolbar-right">
<li role="presentation"> <li role="presentation">
<a href="javascript:void(0)" role="menuitem" id="btn_edexcoin_addcoin" data-toggle="modal" style={{ paddingBottom: '10px', paddingTop: '16px' }} onClick={this.toggleAddCoinModal}> <a
role="menuitem"
id="btn_edexcoin_addcoin"
style={{ paddingBottom: '10px', paddingTop: '16px' }}
onClick={ this.toggleAddCoinModal }>
<span> <span>
<img src="assets/images/icons/activatecoin.png" alt="Add Coin" /> <img src="assets/images/icons/activatecoin.png" alt={ translate('INDEX.ADD_COIN') } />
</span> </span>
</a> </a>
</li> </li>
<li className={ 'dropdown' + (this.state.openDropMenu ? ' open' : '') } onClick={ this.openDropMenu }> <li className={ 'dropdown' + (this.state.openDropMenu ? ' open' : '') } onClick={ this.openDropMenu }>
<a className="navbar-avatar dropdown-toggle" data-toggle="dropdown" href="#" aria-expanded="false" <a className="navbar-avatar dropdown-toggle" aria-expanded="false" role="button">
data-animation="scale-up" role="button">
<span className="avatar avatar-online"> <span className="avatar avatar-online">
<img src="assets/images/iguana_profile_02.jpg" alt="iguana profile pic" /> <img src="assets/images/iguana_profile_02.jpg" alt="iguana profile pic" />
<i></i> <i></i>
@ -109,18 +117,24 @@ class Navbar extends React.Component {
</a> </a>
<ul className="dropdown-menu" role="menu"> <ul className="dropdown-menu" role="menu">
<li role="presentation"> <li role="presentation">
<a href="javascript:void(0)" role="menuitem" id="nav-iguana-wallet-settings" onClick={() => this.dashboardChangeSection('settings')}> <a
role="menuitem"
id="nav-iguana-wallet-settings"
onClick={ () => this.dashboardChangeSection('settings') }>
<i className="icon md-settings" aria-hidden="true"></i> { translate('INDEX.SETTINGS') } <i className="icon md-settings" aria-hidden="true"></i> { translate('INDEX.SETTINGS') }
</a> </a>
</li> </li>
<li role="presentation"> <li role="presentation">
<a href="javascript:void(0)" role="menuitem" id="nav-about-iguana" onClick={() => this.dashboardChangeSection('about')}> <a
role="menuitem"
id="nav-about-iguana"
onClick={ () => this.dashboardChangeSection('about') }>
<i className="icon fa-users" aria-hidden="true"></i> { translate('INDEX.ABOUT_IGUANA') } <i className="icon fa-users" aria-hidden="true"></i> { translate('INDEX.ABOUT_IGUANA') }
</a> </a>
</li> </li>
<li className="divider" role="presentation"></li> <li className="divider" role="presentation"></li>
<li role="presentation"> <li role="presentation">
<a href="javascript:void(0)" role="menuitem" id="logout-account" onClick={this.logout}> <a role="menuitem" id="logout-account" onClick={ this.logout }>
<i className="icon md-power" aria-hidden="true"></i> { translate('INDEX.LOGOUT') } <i className="icon md-power" aria-hidden="true"></i> { translate('INDEX.LOGOUT') }
</a> </a>
</li> </li>

36
react/src/components/dashboard/receiveCoin.js

@ -35,11 +35,20 @@ class ReceiveCoin extends React.Component {
<span className="label label-default"> <span className="label label-default">
<i className="icon fa-eye"></i> { translate('IAPI.PUBLIC_SM') } <i className="icon fa-eye"></i> { translate('IAPI.PUBLIC_SM') }
</span> </span>
<button className="btn btn-default btn-xs clipboard-edexaddr margin-left-10" data-edexcoin="COIN" id="edexcoin_active_addr_clipboard" onClick={() => this._copyCoinAddress(address)}><i className="icon wb-copy" aria-hidden="true"></i> {translate('INDEX.COPY')}</button> <button
<span className="label label-default margin-left-10 action" title="Check" onClick={() => this._checkAddressBasilisk(address)}> className="btn btn-default btn-xs clipboard-edexaddr margin-left-10"
id="edexcoin_active_addr_clipboard"
onClick={ () => this._copyCoinAddress(address) }><i className="icon wb-copy" aria-hidden="true"></i> { translate('INDEX.COPY') }</button>
<span
className="label label-default margin-left-10 action"
title="Check"
onClick={ () => this._checkAddressBasilisk(address) }>
<i className="icon fa-database"></i> <i className="icon fa-database"></i>
</span> </span>
<span className="label label-default margin-left-10 action" title="Import" onClick={() => this._validateAddressBasilisk(address)}> <span
className="label label-default margin-left-10 action"
title="Import"
onClick={ () => this._validateAddressBasilisk(address) }>
<i className="icon fa-info-circle"></i> <i className="icon fa-info-circle"></i>
</span> </span>
</td> </td>
@ -50,7 +59,10 @@ class ReceiveCoin extends React.Component {
<span className="label label-default"> <span className="label label-default">
<i className="icon fa-eye"></i> { translate('IAPI.PUBLIC_SM') } <i className="icon fa-eye"></i> { translate('IAPI.PUBLIC_SM') }
</span> </span>
<button className="btn btn-default btn-xs clipboard-edexaddr margin-left-10" data-edexcoin="COIN" id="edexcoin_active_addr_clipboard" onClick={() => this._copyCoinAddress(address)}><i className="icon wb-copy" aria-hidden="true"></i> {translate('INDEX.COPY')}</button> <button
className="btn btn-default btn-xs clipboard-edexaddr margin-left-10"
id="edexcoin_active_addr_clipboard"
onClick={ () => this._copyCoinAddress(address) }><i className="icon wb-copy" aria-hidden="true"></i> { translate('INDEX.COPY') }</button>
</td> </td>
); );
} }
@ -65,10 +77,12 @@ class ReceiveCoin extends React.Component {
for (let i = 0; i < this.props.addresses.public.length; i++) { for (let i = 0; i < this.props.addresses.public.length; i++) {
let address = this.props.addresses.public[i]; let address = this.props.addresses.public[i];
if (this.props.mode === 'basilisk' && address.amount === 'N/A') { if (this.props.mode === 'basilisk' &&
address.amount === 'N/A') {
address.amount = this.props.cache && this.props.cache[this.props.coin][address.address] && this.props.cache[this.props.coin][address.address].getbalance.data && this.props.cache[this.props.coin][address.address].getbalance.data.balance ? this.props.cache[this.props.coin][address.address].getbalance.data.balance : 'N/A'; address.amount = this.props.cache && this.props.cache[this.props.coin][address.address] && this.props.cache[this.props.coin][address.address].getbalance.data && this.props.cache[this.props.coin][address.address].getbalance.data.balance ? this.props.cache[this.props.coin][address.address].getbalance.data.balance : 'N/A';
} }
if (this.props.mode === 'basilisk' && (address.interest === 'N/A' || !address.interest)) { if (this.props.mode === 'basilisk' &&
(address.interest === 'N/A' || !address.interest)) {
address.interest = this.props.cache && this.props.cache[this.props.coin][address.address] && this.props.cache[this.props.coin][address.address].getbalance.data && this.props.cache[this.props.coin][address.address].getbalance.data.interest ? this.props.cache[this.props.coin][address.address].getbalance.data.interest : 'N/A'; address.interest = this.props.cache && this.props.cache[this.props.coin][address.address] && this.props.cache[this.props.coin][address.address].getbalance.data && this.props.cache[this.props.coin][address.address].getbalance.data.interest ? this.props.cache[this.props.coin][address.address].getbalance.data.interest : 'N/A';
} }
@ -89,12 +103,14 @@ class ReceiveCoin extends React.Component {
} }
render() { render() {
if (this.props && this.props.receive && this.props.mode !== 'native') { if (this.props &&
this.props.receive &&
this.props.mode !== 'native') {
return ( return (
<div data-edexcoin="COIN" id="edexcoin_recieve"> <div id="edexcoin_recieve">
<div className="col-xs-12 margin-top-20"> <div className="col-xs-12 margin-top-20">
<div className="panel nav-tabs-horizontal"> <div className="panel nav-tabs-horizontal">
<div data-edexcoin="COIN" id="edexcoin_recieve_section"> <div id="edexcoin_recieve_section">
<div className="col-xlg-12 col-lg-12 col-sm-12 col-xs-12"> <div className="col-xlg-12 col-lg-12 col-sm-12 col-xs-12">
<div className="panel"> <div className="panel">
<header className="panel-heading"> <header className="panel-heading">
@ -103,7 +119,7 @@ class ReceiveCoin extends React.Component {
<h4 className="panel-title">{ translate('INDEX.RECEIVING_ADDRESS') }</h4> <h4 className="panel-title">{ translate('INDEX.RECEIVING_ADDRESS') }</h4>
</header> </header>
<div className="panel-body"> <div className="panel-body">
<table className="table table-hover dataTable table-striped" data-edexcoin="COIN" id="edexcoin-recieve-addr-tbl"> <table className="table table-hover dataTable table-striped" id="edexcoin-recieve-addr-tbl">
<thead> <thead>
<tr> <tr>
<th>{ translate('INDEX.TYPE') }</th> <th>{ translate('INDEX.TYPE') }</th>

162
react/src/components/dashboard/sendCoin.js

@ -263,7 +263,7 @@ class SendCoin extends React.Component {
); );
} else { } else {
return ( return (
<span>- Select Transparent or Private Address -</span> <span>- { translate('SEND.SELECT_T_OR_Z_ADDR') } -</span>
); );
} }
} }
@ -271,13 +271,21 @@ class SendCoin extends React.Component {
renderAddressList() { renderAddressList() {
return ( return (
<div className={ 'btn-group bootstrap-select form-control form-material showkmdwalletaddrs show-tick ' + (this.state.addressSelectorOpen ? 'open' : '') }> <div className={ 'btn-group bootstrap-select form-control form-material showkmdwalletaddrs show-tick ' + (this.state.addressSelectorOpen ? 'open' : '') }>
<button type="button" className="btn dropdown-toggle btn-info" data-toggle="dropdown" data-id="kmd_wallet_send_from" title="- Select Transparent or Private Address -" aria-expanded="true" onClick={this.openDropMenu}> <button
<span className="filter-option pull-left">{this.renderSelectorCurrentLabel()} </span>&nbsp;<span className="bs-caret"><span className="caret"></span></span> type="button"
className="btn dropdown-toggle btn-info"
title={ '-' + translate('SEND.SELECT_T_OR_Z_ADDR') + '-' }
aria-expanded="true"
onClick={ this.openDropMenu }>
<span className="filter-option pull-left">{ this.renderSelectorCurrentLabel() } </span>&nbsp;
<span className="bs-caret">
<span className="caret"></span>
</span>
</button> </button>
<div className="dropdown-menu open"> <div className="dropdown-menu open">
<ul className="dropdown-menu inner" role="menu"> <ul className="dropdown-menu inner" role="menu">
<li className="selected"> <li className="selected">
<a tabIndex="0"><span className="text"> - Select Transparent or Private Address - </span><span className="glyphicon glyphicon-ok check-mark"></span></a> <a tabIndex="0"><span className="text"> - { translate('SEND.SELECT_T_OR_Z_ADDR') } - </span><span className="glyphicon glyphicon-ok check-mark"></span></a>
</li> </li>
{ this.renderAddressByType('public') } { this.renderAddressByType('public') }
</ul> </ul>
@ -386,7 +394,8 @@ class SendCoin extends React.Component {
.then(function(json) { .then(function(json) {
console.log('sendData', sendData); console.log('sendData', sendData);
console.log('iguanaUTXORawTXJSON', json); console.log('iguanaUTXORawTXJSON', json);
if (json.result === 'success' && json.completed === true) { if (json.result === 'success' &&
json.completed === true) {
Store.dispatch(triggerToaster(true, translate('TOASTR.SIGNED_TX_GENERATED') + '.', translate('TOASTR.WALLET_NOTIFICATION'), 'success')); Store.dispatch(triggerToaster(true, translate('TOASTR.SIGNED_TX_GENERATED') + '.', translate('TOASTR.WALLET_NOTIFICATION'), 'success'));
if (sendData.sendsig === 1) { if (sendData.sendsig === 1) {
@ -457,7 +466,7 @@ class SendCoin extends React.Component {
console.log(result); console.log(result);
resolve(result); resolve(result);
forceUpdateCache(); forceUpdateCache();
Store.dispatch(triggerToaster(true, 'Local UTXO data is updated. Ready to send new transaction.', translate('TOASTR.WALLET_NOTIFICATION'), 'info')); Store.dispatch(triggerToaster(true, translate('TOASTR.LOCAL_UTXO_UPDATED'), translate('TOASTR.WALLET_NOTIFICATION'), 'info'));
this.setState(Object.assign({}, this.state, { this.setState(Object.assign({}, this.state, {
utxoMethodInProgress: false, utxoMethodInProgress: false,
@ -466,10 +475,10 @@ class SendCoin extends React.Component {
}.bind(this)); }.bind(this));
}.bind(this); }.bind(this);
Store.dispatch(triggerToaster(true, 'Awaiting transaction data response...', translate('TOASTR.WALLET_NOTIFICATION'), 'info')); Store.dispatch(triggerToaster(true, translate('TOASTR.AWAITING_TX_RESP') + '...', translate('TOASTR.WALLET_NOTIFICATION'), 'info'));
function waterfallUTXOProcess() { function waterfallUTXOProcess() {
Store.dispatch(triggerToaster(true, 'Processing UTXO...', translate('TOASTR.WALLET_NOTIFICATION'), 'info')); Store.dispatch(triggerToaster(true, translate('TOASTR.PROCESSING_UTXO') + '...', translate('TOASTR.WALLET_NOTIFICATION'), 'info'));
getTxidData() getTxidData()
.then(function(gettxdata) { .then(function(gettxdata) {
@ -544,12 +553,15 @@ class SendCoin extends React.Component {
} else if (key === 'rawtx') { } else if (key === 'rawtx') {
return this.renderSignedTx(true); return this.renderSignedTx(true);
} else if (key === 'complete' || key === 'completed' || key === 'result') { } else if (key === 'complete' || key === 'completed' || key === 'result') {
if (this.props.ActiveCoin.lastSendToResponse[key] === true || this.props.ActiveCoin.lastSendToResponse[key] === 'success') { if (this.props.ActiveCoin.lastSendToResponse[key] === true ||
this.props.ActiveCoin.lastSendToResponse[key] === 'success') {
return ( return (
<span className="label label-success">{ this.props.ActiveCoin.lastSendToResponse[key] === true ? 'true' : 'success' }</span> <span className="label label-success">{ this.props.ActiveCoin.lastSendToResponse[key] === true ? 'true' : 'success' }</span>
); );
} else { } else {
if (key === 'result' && this.props.ActiveCoin.lastSendToResponse.result && typeof this.props.ActiveCoin.lastSendToResponse.result !== 'object') { if (key === 'result' &&
this.props.ActiveCoin.lastSendToResponse.result &&
typeof this.props.ActiveCoin.lastSendToResponse.result !== 'object') {
return ( return (
<span>{ this.props.ActiveCoin.lastSendToResponse.result }</span> <span>{ this.props.ActiveCoin.lastSendToResponse.result }</span>
); );
@ -609,8 +621,8 @@ class SendCoin extends React.Component {
return ( return (
<div style={{ padding: '20px', textAlign: 'center' }}> <div style={{ padding: '20px', textAlign: 'center' }}>
<div style={{ padding: '10px 0' }}> <div style={{ padding: '10px 0' }}>
Processing transaction...<br /> { translate('SEND.PROCESSING_TRANSACTION') }...<br />
Note: it may take a few minutes to complete the transaction. { translate('SEND.NOTE_IT_WILL_TAKE') }.
</div> </div>
<div className="loader-wrapper active"> <div className="loader-wrapper active">
<div className="loader-layer loader-blue"> <div className="loader-layer loader-blue">
@ -687,11 +699,25 @@ class SendCoin extends React.Component {
return ( return (
<div className="row"> <div className="row">
<div className="col-lg-6 form-group form-material"> <div className="col-lg-6 form-group form-material">
<label className="control-label" htmlFor="kmd_wallet_sendto">Fetch OpenAlias recipient address</label> <label
<input type="text" className="form-control" name="sendToOA" onChange={this.updateInput} id="kmd_wallet_sendto" placeholder="Enter an alias as address@site.com" autoComplete="off" required /> className="control-label"
htmlFor="kmd_wallet_sendto">Fetch OpenAlias recipient address</label>
<input
type="text"
className="form-control"
name="sendToOA"
onChange={ this.updateInput }
id="kmd_wallet_sendto"
placeholder="Enter an alias as address@site.com"
autoComplete="off"
required />
</div> </div>
<div className="col-lg-6 form-group form-material"> <div className="col-lg-6 form-group form-material">
<button type="button" className="btn btn-primary waves-effect waves-light" id="kmd_wallet_send_coins_btn" onClick={this.getOAdress}> <button
type="button"
className="btn btn-primary waves-effect waves-light"
id="kmd_wallet_send_coins_btn"
onClick={ this.getOAdress }>
Get address Get address
</button> </button>
</div> </div>
@ -710,7 +736,10 @@ class SendCoin extends React.Component {
<div className="pull-left margin-right-10"> <div className="pull-left margin-right-10">
<input type="checkbox" id="edexcoin_send_api_type" /> <input type="checkbox" id="edexcoin_send_api_type" />
</div> </div>
<label className="padding-top-3" htmlFor="edexcoin_send_api_type" onClick={this.toggleSendAPIType}>Send via sendtoaddress API</label> <label
className="padding-top-3"
htmlFor="edexcoin_send_api_type"
onClick={ this.toggleSendAPIType }>{ translate('SEND.SEND_VIA') } sendtoaddress API</label>
</div> </div>
</div> </div>
); );
@ -720,26 +749,34 @@ class SendCoin extends React.Component {
} }
render() { render() {
if (this.props.ActiveCoin && this.props.ActiveCoin.send && this.props.ActiveCoin.mode !== 'native') { if (this.props.ActiveCoin &&
this.props.ActiveCoin.send &&
this.props.ActiveCoin.mode !== 'native') {
return ( return (
<div className="col-sm-12 padding-top-10" id="edexcoin_send"> <div className="col-sm-12 padding-top-10" id="edexcoin_send">
<div className="col-xlg-12 col-md-12 col-sm-12 col-xs-12"> <div className="col-xlg-12 col-md-12 col-sm-12 col-xs-12">
<div className="steps row" style={{ marginTop: '10px' }}> <div className="steps row" style={{ marginTop: '10px' }}>
<div className={this.state.currentStep === 0 ? 'step col-md-4 current' : 'step col-md-4'} id="edexcoin_send_step_1"> <div
className={ this.state.currentStep === 0 ? 'step col-md-4 current' : 'step col-md-4' }
id="edexcoin_send_step_1">
<span className="step-number">1</span> <span className="step-number">1</span>
<div className="step-desc"> <div className="step-desc">
<span className="step-title">{ translate('INDEX.FILL_SEND_FORM') }</span> <span className="step-title">{ translate('INDEX.FILL_SEND_FORM') }</span>
<p>{ translate('INDEX.FILL_SEND_DETAILS') }</p> <p>{ translate('INDEX.FILL_SEND_DETAILS') }</p>
</div> </div>
</div> </div>
<div className={this.state.currentStep === 1 ? 'step col-md-4 current' : 'step col-md-4'} id="edexcoin_send_step_2"> <div
className={ this.state.currentStep === 1 ? 'step col-md-4 current' : 'step col-md-4' }
id="edexcoin_send_step_2">
<span className="step-number">2</span> <span className="step-number">2</span>
<div className="step-desc"> <div className="step-desc">
<span className="step-title">{ translate('INDEX.CONFIRMING') }</span> <span className="step-title">{ translate('INDEX.CONFIRMING') }</span>
<p>{ translate('INDEX.CONFIRM_DETAILS') }</p> <p>{ translate('INDEX.CONFIRM_DETAILS') }</p>
</div> </div>
</div> </div>
<div className={this.state.currentStep === 2 ? 'step col-md-4 current' : 'step col-md-4'} id="edexcoin_send_step_3"> <div
className={ this.state.currentStep === 2 ? 'step col-md-4 current' : 'step col-md-4' }
id="edexcoin_send_step_3">
<span className="step-number">3</span> <span className="step-number">3</span>
<div className="step-desc"> <div className="step-desc">
<span className="step-title">{ translate('INDEX.PROCESSING_TX') }</span> <span className="step-title">{ translate('INDEX.PROCESSING_TX') }</span>
@ -750,49 +787,80 @@ class SendCoin extends React.Component {
<div className={ this.state.currentStep === 0 ? 'panel' : 'panel hide' } id="edexcoin-send-screen"> <div className={ this.state.currentStep === 0 ? 'panel' : 'panel hide' } id="edexcoin-send-screen">
<div className="panel-heading"> <div className="panel-heading">
<h3 data-edexcoin="COIN" className="panel-title"> <h3 className="panel-title">
{ translate('INDEX.SEND') } { this.props.ActiveCoin.coin } { translate('INDEX.SEND') } { this.props.ActiveCoin.coin }
</h3> </h3>
</div> </div>
<div className="panel-body container-fluid"> <div className="panel-body container-fluid">
<form className="edexcoin-send-form" data-edexcoin="COIN" method="post" role="form" autoComplete="off"> <form className="edexcoin-send-form" method="post" role="form" autoComplete="off">
{this.renderSendApiTypeSelector()} {this.renderSendApiTypeSelector()}
<div className="row"> <div className="row">
<div className={ this.props.ActiveCoin.mode === 'basilisk' ? 'col-xlg-12 form-group form-material' : 'hide' }> <div className={ this.props.ActiveCoin.mode === 'basilisk' ? 'col-xlg-12 form-group form-material' : 'hide' }>
<label className="control-label" data-edexcoin="COIN" htmlFor="edexcoin_send_from">{translate('INDEX.SEND_FROM')}</label> <label className="control-label" htmlFor="edexcoin_send_from">{ translate('INDEX.SEND_FROM') }</label>
{ this.renderAddressList() } { this.renderAddressList() }
</div> </div>
</div> </div>
{ this.renderOASendUI() } { this.renderOASendUI() }
<div className="row"> <div className="row">
<div className="col-xlg-12 form-group form-material"> <div className="col-xlg-12 form-group form-material">
<label className="control-label" data-edexcoin="COIN" htmlFor="edexcoin_sendto">{translate('INDEX.SEND_TO')}</label> <label className="control-label" htmlFor="edexcoin_sendto">{ translate('INDEX.SEND_TO') }</label>
<input type="text" className="form-control" id="edexcoin_sendto" name="sendTo" placeholder="Enter address" autoComplete="off" value={this.state.sendTo} onChange={this.updateInput} required /> <input
type="text"
className="form-control"
id="edexcoin_sendto"
name="sendTo"
placeholder={ translate('SEND.ENTER_AN_ADDRESS') }
autoComplete="off"
value={ this.state.sendTo }
onChange={ this.updateInput }
required />
</div> </div>
<div className="col-lg-6 form-group form-material"> <div className="col-lg-6 form-group form-material">
<label className="control-label" htmlFor="edexcoin_amount" data-edexcoin="COIN" id="edexcoin_amount_label"> <label className="control-label" htmlFor="edexcoin_amount" id="edexcoin_amount_label">
{ this.props.ActiveCoin.coin } { this.props.ActiveCoin.coin }
</label> </label>
<input type="text" className="form-control" id="edexcoin_amount" name="amount" placeholder="0.000" autoComplete="off" onChange={this.updateInput} /> <input
type="text"
className="form-control"
id="edexcoin_amount"
name="amount"
placeholder="0.000"
autoComplete="off"
onChange={ this.updateInput } />
</div> </div>
<div className="col-lg-6 form-group form-material"> <div className="col-lg-6 form-group form-material">
<label className="control-label" data-edexcoin="COIN" htmlFor="edexcoin_fee">{translate('INDEX.FEE')}</label> <label className="control-label" htmlFor="edexcoin_fee">{ translate('INDEX.FEE') }</label>
<input type="text" className="form-control" id="edexcoin_fee" name="fee" defaultValue={this.state.fee} value={this.state.fee} placeholder="0.000" autoComplete="off" onChange={this.updateInput} /> <input
type="text"
className="form-control"
id="edexcoin_fee"
name="fee"
defaultValue={ this.state.fee }
value={ this.state.fee }
placeholder="0.000"
autoComplete="off"
onChange={ this.updateInput } />
</div> </div>
<div className="col-lg-12"> <div className="col-lg-12">
<span data-edexcoin="KMD"> <span data-edexcoin="KMD">
<b>{translate('INDEX.TOTAL')} ({translate('INDEX.AMOUNT_SM')} - txfee):</b> <span id="edexcoin_total_value">{Number(this.state.amount) - Number(this.state.fee)}</span> {this.props.ActiveCoin.coin} <strong>{ translate('INDEX.TOTAL') } ({ translate('INDEX.AMOUNT_SM') } - txfee):</strong> <span id="edexcoin_total_value">{ Number(this.state.amount) - Number(this.state.fee) }</span> { this.props.ActiveCoin.coin }
</span> </span>
</div> </div>
<div className="col-lg-10 margin-top-10"> <div className="col-lg-10 margin-top-10">
<div className="pull-left margin-right-10"> <div className="pull-left margin-right-10">
<input type="checkbox" id="edexcoin_send_sig" data-plugin="switchery" data-size="small" /> <input type="checkbox" id="edexcoin_send_sig" />
</div> </div>
<label className="padding-top-3" htmlFor="edexcoin_send_sig" onClick={this.toggleSendSig}>{translate('INDEX.DONT_SEND')}</label> <label
className="padding-top-3"
htmlFor="edexcoin_send_sig"
onClick={ this.toggleSendSig }>{ translate('INDEX.DONT_SEND') }</label>
</div> </div>
{ this.renderUTXOCacheInfo()} { this.renderUTXOCacheInfo()}
<div className="col-lg-12"> <div className="col-lg-12">
<button type="button" className="btn btn-primary waves-effect waves-light pull-right edexcoin_send_coins_btn_step1" onClick={() => this.changeSendCoinStep(1)}> <button
type="button"
className="btn btn-primary waves-effect waves-light pull-right edexcoin_send_coins_btn_step1"
onClick={ () => this.changeSendCoinStep(1) }>
{ translate('INDEX.SEND') } { Number(this.state.amount) - Number(this.state.fee) } { this.props.ActiveCoin.coin } { translate('INDEX.SEND') } { Number(this.state.amount) - Number(this.state.fee) } { this.props.ActiveCoin.coin }
</button> </button>
</div> </div>
@ -807,7 +875,7 @@ class SendCoin extends React.Component {
<div className="panel-body"> <div className="panel-body">
<div className="row"> <div className="row">
<div className="col-xs-12"> <div className="col-xs-12">
<b>{translate('INDEX.TO')}</b> <strong>{translate('INDEX.TO')}</strong>
</div> </div>
<div className="col-lg-6 col-sm-6 col-xs-12" id="mdl_confirm_currency_sendto_addr">{ this.state.sendTo }</div> <div className="col-lg-6 col-sm-6 col-xs-12" id="mdl_confirm_currency_sendto_addr">{ this.state.sendTo }</div>
<div className="col-lg-6 col-sm-6 col-xs-6"> <div className="col-lg-6 col-sm-6 col-xs-6">
@ -822,7 +890,7 @@ class SendCoin extends React.Component {
<div className="row"> <div className="row">
<div className="col-xs-12"> <div className="col-xs-12">
<b>{translate('INDEX.FROM')}</b> <strong>{ translate('INDEX.FROM') }</strong>
</div> </div>
<div className="col-lg-6 col-sm-6 col-xs-12" id="mdl_confirm_currency_sendfrom_addr">{ this.props.Dashboard.activeHandle[this.props.ActiveCoin.coin] }</div> <div className="col-lg-6 col-sm-6 col-xs-12" id="mdl_confirm_currency_sendfrom_addr">{ this.props.Dashboard.activeHandle[this.props.ActiveCoin.coin] }</div>
<div className="col-lg-6 col-sm-6 col-xs-6" style={{ color: '#f44336' }}> <div className="col-lg-6 col-sm-6 col-xs-6" style={{ color: '#f44336' }}>
@ -830,9 +898,16 @@ class SendCoin extends React.Component {
</div> </div>
</div> </div>
<div className="widget-body-footer"> <div className="widget-body-footer">
<a className="btn btn-default waves-effect waves-light" id="edexcoin_send_coins_back_btn" onClick={() => this.changeSendCoinStep(0)}>{translate('INDEX.BACK')}</a> <a
className="btn btn-default waves-effect waves-light"
id="edexcoin_send_coins_back_btn"
onClick={ () => this.changeSendCoinStep(0) }>{ translate('INDEX.BACK') }</a>
<div className="widget-actions pull-right"> <div className="widget-actions pull-right">
<button type="button" className="btn btn-primary" id="edexcoin_send_coins_btn" onClick={() => this.changeSendCoinStep(2)}>{translate('INDEX.CONFIRM')}</button> <button
type="button"
className="btn btn-primary"
id="edexcoin_send_coins_btn"
onClick={ () => this.changeSendCoinStep(2) }>{ translate('INDEX.CONFIRM') }</button>
</div> </div>
</div> </div>
</div> </div>
@ -844,9 +919,11 @@ class SendCoin extends React.Component {
<div className="panel-heading"> <div className="panel-heading">
<h4 className="panel-title">{ translate('INDEX.TRANSACTION_RESULT') }</h4> <h4 className="panel-title">{ translate('INDEX.TRANSACTION_RESULT') }</h4>
<div className={ !this.state.sendSig ? 'hide' : 'center' }> <div className={ !this.state.sendSig ? 'hide' : 'center' }>
You picked option "{translate('INDEX.DONT_SEND')}" { translate('INDEX.YOU_PICKED_OPT') } "{ translate('INDEX.DONT_SEND') }"
</div> </div>
<table className="table table-hover table-striped edexcoin_sendto_result" id="edexcoin_sendto_result"> <table
className="table table-hover table-striped edexcoin_sendto_result"
id="edexcoin_sendto_result">
<thead> <thead>
<tr> <tr>
<th>{ translate('INDEX.KEY') }</th> <th>{ translate('INDEX.KEY') }</th>
@ -859,7 +936,12 @@ class SendCoin extends React.Component {
</table> </table>
<div className="widget-body-footer"> <div className="widget-body-footer">
<div className="widget-actions margin-bottom-15 margin-right-15"> <div className="widget-actions margin-bottom-15 margin-right-15">
<button type="button" className="btn btn-primary" id="edexcoin_send_coins_anothertx_btn" onClick={() => this.changeSendCoinStep(0)} disabled={this.state.utxoMethodInProgress}>{!this.state.utxoMethodInProgress ? translate('INDEX.MAKE_ANOTHER_TX') : 'Please wait...'}</button> <button
type="button"
className="btn btn-primary"
id="edexcoin_send_coins_anothertx_btn"
onClick={ () => this.changeSendCoinStep(0) }
disabled={ this.state.utxoMethodInProgress }>{ !this.state.utxoMethodInProgress ? translate('INDEX.MAKE_ANOTHER_TX') : translate('SEND.PLEASE_WAIT') + '...' }</button>
</div> </div>
</div> </div>
</div> </div>

207
react/src/components/dashboard/settings.js

@ -92,7 +92,9 @@ class Settings extends React.Component {
if (this.props.Settings.rawPeers && if (this.props.Settings.rawPeers &&
this.state.getPeersCoin && this.state.getPeersCoin &&
this.props.Settings.rawPeers[coin]) { this.props.Settings.rawPeers[coin]) {
return this.props.Settings.rawPeers[coin].map((ip) => <div key={ip}>{ip}</div>); return this.props.Settings.rawPeers[coin].map((ip) =>
<div key={ ip }>{ ip }</div>
);
} else { } else {
return null; return null;
} }
@ -108,69 +110,73 @@ class Settings extends React.Component {
return ( return (
<div className="panel" id="AppInfo"> <div className="panel" id="AppInfo">
<div className="panel-heading" role="tab" onClick={ () => this.openTab('AppInfo', 8) }> <div className="panel-heading" role="tab" onClick={ () => this.openTab('AppInfo', 8) }>
<a className={this.state.activeTab === 8 ? 'panel-title' : 'panel-title collapsed'} data-toggle="collapse" data-parent="#AppInfoAccordion"> <a className={this.state.activeTab === 8 ? 'panel-title' : 'panel-title collapsed'}>
<i className="icon md-info" aria-hidden="true"></i>App Info <i className="icon md-info" aria-hidden="true"></i>{ translate('SETTINGS.APP_INFO') }
</a> </a>
</div> </div>
<div className={this.state.activeTab === 8 ? 'panel-collapse collapse in' : 'panel-collapse collapse'} style={{height: this.state.activeTab === 8 ? this.state.activeTabHeight + 'px' : '10px'}} aria-labelledby="DebugLog" role="tabpanel"> <div
className={ this.state.activeTab === 8 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
style={{ height: this.state.activeTab === 8 ? this.state.activeTabHeight + 'px' : '10px' }}
aria-labelledby="DebugLog"
role="tabpanel">
<div className="panel-body"> <div className="panel-body">
<div className="col-sm-12" style={{ paddingTop: '15px' }}> <div className="col-sm-12" style={{ paddingTop: '15px' }}>
<div className="row"> <div className="row">
<h5>App Release</h5> <h5>{ translate('SETTINGS.APP_RELEASE') }</h5>
<div> <div>
Name: {this.props.Settings.appInfo.releaseInfo.name} { translate('SETTINGS.NAME') }: { this.props.Settings.appInfo.releaseInfo.name }
</div> </div>
<div> <div>
Version: {this.props.Settings.appInfo.releaseInfo.version} { translate('SETTINGS.VERSION') }: { this.props.Settings.appInfo.releaseInfo.version }
</div> </div>
</div> </div>
</div> </div>
<div className="col-sm-12" style={{ paddingTop: '20px' }}> <div className="col-sm-12" style={{ paddingTop: '20px' }}>
<div className="row"> <div className="row">
<h5>System Info</h5> <h5>{ translate('SETTINGS.SYS_INFO') }</h5>
<div> <div>
Architecture: {this.props.Settings.appInfo.sysInfo.arch} { translate('SETTINGS.ARCH') }: { this.props.Settings.appInfo.sysInfo.arch }
</div> </div>
<div> <div>
OS Type: {this.props.Settings.appInfo.sysInfo.os_type} { translate('SETTINGS.OS_TYPE') }: { this.props.Settings.appInfo.sysInfo.os_type }
</div> </div>
<div> <div>
OS Platfrom: {this.props.Settings.appInfo.sysInfo.platform} { translate('SETTINGS.OS_PLATFORM') }: { this.props.Settings.appInfo.sysInfo.platform }
</div> </div>
<div> <div>
OS Release: {this.props.Settings.appInfo.sysInfo.os_release} { translate('SETTINGS.OS_RELEASE') }: { this.props.Settings.appInfo.sysInfo.os_release }
</div> </div>
<div> <div>
CPU: {this.props.Settings.appInfo.sysInfo.cpu} { translate('SETTINGS.CPU') }: { this.props.Settings.appInfo.sysInfo.cpu }
</div> </div>
<div> <div>
CPU Cores: {this.props.Settings.appInfo.sysInfo.cpu_cores} { translate('SETTINGS.CPU_CORES') }: { this.props.Settings.appInfo.sysInfo.cpu_cores }
</div> </div>
<div> <div>
Memory: {this.props.Settings.appInfo.sysInfo.totalmem_readable} { translate('SETTINGS.MEM') }: { this.props.Settings.appInfo.sysInfo.totalmem_readable }
</div> </div>
</div> </div>
</div> </div>
<div className="col-sm-12" style={{ paddingTop: '20px' }}> <div className="col-sm-12" style={{ paddingTop: '20px' }}>
<div className="row"> <div className="row">
<h5>Locations</h5> <h5>{ translate('SETTINGS.LOCATIONS') }</h5>
<div> <div>
Cache: {this.props.Settings.appInfo.dirs.cacheLocation} { translate('SETTINGS.CACHE') }: { this.props.Settings.appInfo.dirs.cacheLocation }
</div> </div>
<div> <div>
Config: {this.props.Settings.appInfo.dirs.configLocation} { translate('SETTINGS.CONFIG') }: { this.props.Settings.appInfo.dirs.configLocation }
</div> </div>
<div> <div>
Iguana Bin: {this.props.Settings.appInfo.dirs.iguanaBin} Iguana { translate('SETTINGS.BIN') }: { this.props.Settings.appInfo.dirs.iguanaBin }
</div> </div>
<div> <div>
Iguana Dir: {this.props.Settings.appInfo.dirs.iguanaDir} Iguana { translate('SETTINGS.DIR') }: { this.props.Settings.appInfo.dirs.iguanaDir }
</div> </div>
<div> <div>
Komodo Bin: {this.props.Settings.appInfo.dirs.komododBin} Komodo { translate('SETTINGS.BIN') }: { this.props.Settings.appInfo.dirs.komododBin }
</div> </div>
<div> <div>
Komodo Dir: {this.props.Settings.appInfo.dirs.komodoDir} Komodo { translate('SETTINGS.DIR') }: { this.props.Settings.appInfo.dirs.komodoDir }
</div> </div>
</div> </div>
</div> </div>
@ -190,7 +196,9 @@ class Settings extends React.Component {
if (this.props.Settings.supernetPeers && if (this.props.Settings.supernetPeers &&
this.state.getPeersCoin && this.state.getPeersCoin &&
this.props.Settings.supernetPeers[coin]) { this.props.Settings.supernetPeers[coin]) {
return this.props.Settings.supernetPeers[coin].map((ip) => <div key={ip}>{ip}</div>); return this.props.Settings.supernetPeers[coin].map((ip) =>
<div key={ ip }>{ ip }</div>
);
} else { } else {
return null; return null;
} }
@ -217,15 +225,12 @@ class Settings extends React.Component {
for (let key in _appSettings) { for (let key in _appSettings) {
if (key.indexOf('__') === -1) { if (key.indexOf('__') === -1) {
_appSettingsPristine[key] = _appSettings[key]; _appSettingsPristine[key] = _appSettings[key];
// console.log('key changed: ' + key + ', value: ' + _appSettings[key]);
} else { } else {
const _nestedKey = key.split('__'); const _nestedKey = key.split('__');
_appSettingsPristine[_nestedKey[0]][_nestedKey[1]] = _appSettings[key]; _appSettingsPristine[_nestedKey[0]][_nestedKey[1]] = _appSettings[key];
// console.log('key changed: ' + _nestedKey[0] + '.' + _nestedKey[1] + ', value: ' + _appSettings[key]);
} }
} }
// console.log('changed settings obj', _appSettingsPristine);
Store.dispatch(saveAppConfig(_appSettingsPristine)); Store.dispatch(saveAppConfig(_appSettingsPristine));
} }
@ -251,7 +256,11 @@ class Settings extends React.Component {
{ _key } { _key }
</td> </td>
<td style={{ padding: '15px' }}> <td style={{ padding: '15px' }}>
<input type="text" name={`${key}__${_key}`} defaultValue={_appConfig[key][_key]} onChange={this.updateInputSettings} /> <input
type="text"
name={ `${key}__${_key}` }
defaultValue={ _appConfig[key][_key] }
onChange={ this.updateInputSettings } />
</td> </td>
</tr> </tr>
); );
@ -263,7 +272,11 @@ class Settings extends React.Component {
{ key } { key }
</td> </td>
<td style={{ padding: '15px' }}> <td style={{ padding: '15px' }}>
<input type="text" name={`${key}`} defaultValue={_appConfig[key]} onChange={this.updateInputSettings} /> <input
type="text"
name={ `${key}` }
defaultValue={ _appConfig[key] }
onChange={ this.updateInputSettings } />
</td> </td>
</tr> </tr>
); );
@ -306,7 +319,12 @@ class Settings extends React.Component {
<i className="icon md-balance-wallet" aria-hidden="true"></i>{ translate('INDEX.WALLET_INFO') } <i className="icon md-balance-wallet" aria-hidden="true"></i>{ translate('INDEX.WALLET_INFO') }
</a> </a>
</div> </div>
<div className={this.state.activeTab === 0 ? 'panel-collapse collapse in' : 'panel-collapse collapse'} style={{height: this.state.activeTab === 0 ? this.state.activeTabHeight + 'px' : '10px'}} id="WalletInfoTab" aria-labelledby="WalletInfo" role="tabpanel"> <div
className={ this.state.activeTab === 0 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
style={{ height: this.state.activeTab === 0 ? this.state.activeTabHeight + 'px' : '10px' }}
id="WalletInfoTab"
aria-labelledby="WalletInfo"
role="tabpanel">
<div className="panel-body"> <div className="panel-body">
<table className="table" id="wallet-info-table"> <table className="table" id="wallet-info-table">
<thead> <thead>
@ -360,11 +378,16 @@ class Settings extends React.Component {
<div className="panel" id="AddNodeforCoin"> <div className="panel" id="AddNodeforCoin">
<div className="panel-heading" role="tab" onClick={ () => this.openTab('AddNodeforCoin', 1) }> <div className="panel-heading" role="tab" onClick={ () => this.openTab('AddNodeforCoin', 1) }>
<a className={this.state.activeTab === 1 ? 'panel-title' : 'panel-title collapsed'} data-toggle="collapse" data-parent="#SettingsAccordion"> <a className={ this.state.activeTab === 1 ? 'panel-title' : 'panel-title collapsed' }>
<i className="icon md-plus-square" aria-hidden="true"></i>{ translate('INDEX.ADD_NODE') } <i className="icon md-plus-square" aria-hidden="true"></i>{ translate('INDEX.ADD_NODE') }
</a> </a>
</div> </div>
<div className={this.state.activeTab === 1 ? 'panel-collapse collapse in' : 'panel-collapse collapse'} style={{height: this.state.activeTab === 1 ? this.state.activeTabHeight + 'px' : '10px'}} id="AddNodeforCoinTab" aria-labelledby="AddNodeforCoin" role="tabpanel"> <div
className={ this.state.activeTab === 1 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
style={{ height: this.state.activeTab === 1 ? this.state.activeTabHeight + 'px' : '10px' }}
id="AddNodeforCoinTab"
aria-labelledby="AddNodeforCoin"
role="tabpanel">
<div className="panel-body"> <div className="panel-body">
<div className="row"> <div className="row">
<div className="col-sm-6"> <div className="col-sm-6">
@ -373,7 +396,11 @@ class Settings extends React.Component {
</div> </div>
<div className="col-sm-8 col-xs-12"> <div className="col-sm-8 col-xs-12">
<div className="form-group"> <div className="form-group">
<select className="form-control form-material" id="settings_select_coin_options" name="getPeersCoin" onChange={this.updateInput}> <select
className="form-control form-material"
id="settings_select_coin_options"
name="getPeersCoin"
onChange={ this.updateInput }>
<option>{ translate('INDEX.SELECT_COIN') }</option> <option>{ translate('INDEX.SELECT_COIN') }</option>
<AddCoinOptionsCrypto /> <AddCoinOptionsCrypto />
<AddCoinOptionsAC /> <AddCoinOptionsAC />
@ -382,7 +409,11 @@ class Settings extends React.Component {
</div> </div>
</div> </div>
<div className="col-sm-4 col-xs-12" style={{ textAlign: 'center' }}> <div className="col-sm-4 col-xs-12" style={{ textAlign: 'center' }}>
<button type="button" className="btn btn-primary waves-effect waves-light" data-toggle="modal" data-dismiss="modal" id="settings_getcoinpeers_btn" onClick={this.checkNodes}>{translate('INDEX.CHECK_NODES')}</button> <button
type="button"
className="btn btn-primary waves-effect waves-light"
id="settings_getcoinpeers_btn"
onClick={ this.checkNodes }>{ translate('INDEX.CHECK_NODES') }</button>
</div> </div>
<div className="col-sm-12"> <div className="col-sm-12">
<h5> <h5>
@ -402,7 +433,11 @@ class Settings extends React.Component {
</div> </div>
<div className="col-sm-8 col-xs-12"> <div className="col-sm-8 col-xs-12">
<div className="form-group"> <div className="form-group">
<select className="form-control form-material" id="settings_select_coin_addpeer_options" name="addNodeCoin" onChange={this.updateInput}> <select
className="form-control form-material"
id="settings_select_coin_addpeer_options"
name="addNodeCoin"
onChange={ this.updateInput }>
<option>{ translate('INDEX.SELECT_COIN') }</option> <option>{ translate('INDEX.SELECT_COIN') }</option>
<AddCoinOptionsCrypto /> <AddCoinOptionsCrypto />
<AddCoinOptionsAC /> <AddCoinOptionsAC />
@ -410,11 +445,21 @@ class Settings extends React.Component {
</select> </select>
</div> </div>
<div className="form-group"> <div className="form-group">
<input type="text" className="form-control" id="settings_add_peer_ip" name="addPeerIP" placeholder="Add Peer IP" onChange={this.updateInput} /> <input
type="text"
className="form-control"
id="settings_add_peer_ip"
name="addPeerIP"
placeholder={ translate('SETTINGS.ADD_PEER_IP') }
onChange={ this.updateInput } />
</div> </div>
</div> </div>
<div className="col-sm-4 col-xs-12" style={{ textAlign: 'center' }}> <div className="col-sm-4 col-xs-12" style={{ textAlign: 'center' }}>
<button type="button" className="btn btn-primary waves-effect waves-light" data-toggle="modal" data-dismiss="modal" id="settings_addcoinpeers_btn" onClick={this.addNode}>{translate('INDEX.ADD_NODE')}</button> <button
type="button"
className="btn btn-primary waves-effect waves-light"
id="settings_addcoinpeers_btn"
onClick={ this.addNode }>{ translate('INDEX.ADD_NODE') }</button>
</div> </div>
</div> </div>
</div> </div>
@ -424,33 +469,51 @@ class Settings extends React.Component {
<div className="panel" id="DumpWallet"> <div className="panel" id="DumpWallet">
<div className="panel-heading" role="tab" onClick={ () => this.openTab('DumpWallet', 2) }> <div className="panel-heading" role="tab" onClick={ () => this.openTab('DumpWallet', 2) }>
<a className={this.state.activeTab === 2 ? 'panel-title' : 'panel-title collapsed'} data-toggle="collapse" data-parent="#SettingsAccordion"> <a className={this.state.activeTab === 2 ? 'panel-title' : 'panel-title collapsed'}>
<i className="icon wb-briefcase" aria-hidden="true"></i>{ translate('INDEX.WALLET_BACKUP') } <i className="icon wb-briefcase" aria-hidden="true"></i>{ translate('INDEX.WALLET_BACKUP') }
</a> </a>
</div> </div>
<div className={this.state.activeTab === 2 ? 'panel-collapse collapse in' : 'panel-collapse collapse'} style={{height: this.state.activeTab === 2 ? this.state.activeTabHeight + 'px' : '10px'}} id="DumpWalletTab" aria-labelledby="DumpWallet" role="tabpanel"> <div
className={ this.state.activeTab === 2 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
style={{ height: this.state.activeTab === 2 ? this.state.activeTabHeight + 'px' : '10px' }}
id="DumpWalletTab"
aria-labelledby="DumpWallet"
role="tabpanel">
<div className="panel-body">Wallet Backup section to be updated soon.</div> <div className="panel-body">Wallet Backup section to be updated soon.</div>
</div> </div>
</div> </div>
<div className="panel" id="FiatCurrencySettings"> <div className="panel" id="FiatCurrencySettings">
<div className="panel-heading" role="tab" onClick={() => this.openTab('FiatCurrencySettings', 3)}> <div
<a className={this.state.activeTab === 3 ? 'panel-title' : 'panel-title collapsed'} data-toggle="collapse" data-parent="#SettingsAccordion"> className="panel-heading"
role="tab"
onClick={ () => this.openTab('FiatCurrencySettings', 3) }>
<a className={ this.state.activeTab === 3 ? 'panel-title' : 'panel-title collapsed' }>
<i className="icon fa-money" aria-hidden="true"></i>{ translate('INDEX.FIAT_CURRENCY') } <i className="icon fa-money" aria-hidden="true"></i>{ translate('INDEX.FIAT_CURRENCY') }
</a> </a>
</div> </div>
<div className={this.state.activeTab === 3 ? 'panel-collapse collapse in' : 'panel-collapse collapse'} style={{height: this.state.activeTab === 3 ? this.state.activeTabHeight + 'px' : '10px'}} id="FiatCurrencySettingsTab" aria-labelledby="FiatCurrencySettings" role="tabpanel"> <div
className={ this.state.activeTab === 3 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
style={{ height: this.state.activeTab === 3 ? this.state.activeTabHeight + 'px' : '10px' }}
id="FiatCurrencySettingsTab"
aria-labelledby="FiatCurrencySettings"
role="tabpanel">
<div className="panel-body">Fiat currency settings section to be updated soon.</div> <div className="panel-body">Fiat currency settings section to be updated soon.</div>
</div> </div>
</div> </div>
<div className="panel" id="ExportKeys"> <div className="panel" id="ExportKeys">
<div className="panel-heading" role="tab" onClick={ () => this.openTab('ExportKeys', 4) }> <div className="panel-heading" role="tab" onClick={ () => this.openTab('ExportKeys', 4) }>
<a className={this.state.activeTab === 4 ? 'panel-title' : 'panel-title collapsed'} data-toggle="collapse" data-parent="#SettingsAccordion"> <a className={ this.state.activeTab === 4 ? 'panel-title' : 'panel-title collapsed' }>
<i className="icon md-key" aria-hidden="true"></i>{ translate('INDEX.EXPORT_KEYS') } <i className="icon md-key" aria-hidden="true"></i>{ translate('INDEX.EXPORT_KEYS') }
</a> </a>
</div> </div>
<div className={this.state.activeTab === 4 ? 'panel-collapse collapse in' : 'panel-collapse collapse'} style={{height: this.state.activeTab === 4 ? this.state.activeTabHeight + 'px' : '10px'}} id="ExportKeysTab" aria-labelledby="ExportKeys" role="tabpanel"> <div
className={ this.state.activeTab === 4 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
style={{ height: this.state.activeTab === 4 ? this.state.activeTabHeight + 'px' : '10px' }}
id="ExportKeysTab"
aria-labelledby="ExportKeys"
role="tabpanel">
<div className="panel-body"> <div className="panel-body">
<p> <p>
<div>{ this.renderLB('INDEX.ONLY_ACTIVE_WIF_KEYS') }</div><br/> <div>{ this.renderLB('INDEX.ONLY_ACTIVE_WIF_KEYS') }</div><br/>
@ -461,16 +524,25 @@ class Settings extends React.Component {
<div className="col-sm-12"></div> <div className="col-sm-12"></div>
<form className="wifkeys-form" method="post" action="javascript:" autoComplete="off"> <form className="wifkeys-form" method="post" action="javascript:" autoComplete="off">
<div className="form-group form-material floating"> <div className="form-group form-material floating">
<input type="password" className="form-control" name="wifkeysPassphrase" id="wifkeys_passphrase" onChange={this.updateInput} /> <input
type="password"
className="form-control"
name="wifkeysPassphrase"
id="wifkeys_passphrase"
onChange={ this.updateInput } />
<label className="floating-label" htmlFor="wifkeys_passphrase">{ translate('INDEX.PASSPHRASE') }</label> <label className="floating-label" htmlFor="wifkeys_passphrase">{ translate('INDEX.PASSPHRASE') }</label>
</div> </div>
<div className="col-sm-12 col-xs-12" style={{ textAlign: 'center' }}> <div className="col-sm-12 col-xs-12" style={{ textAlign: 'center' }}>
<button type="button" className="btn btn-primary waves-effect waves-light" data-toggle="modal" data-dismiss="modal" id="wifkeys_passphrase_btn" onClick={this.exportWifKeys}>{translate('INDEX.GET_WIF_KEYS')}</button> <button
type="button"
className="btn btn-primary waves-effect waves-light"
id="wifkeys_passphrase_btn"
onClick={ this.exportWifKeys }>{ translate('INDEX.GET_WIF_KEYS') }</button>
</div> </div>
</form> </form>
<div className="col-sm-12" style={{ paddingTop: '15px' }}> <div className="col-sm-12" style={{ paddingTop: '15px' }}>
<div className="row" id="wif-priv-keys" data-plugin="masonry"> <div className="row" id="wif-priv-keys">
<table className={ this.props.Settings && this.props.Settings.address ? 'table show' : 'table hide' }> <table className={ this.props.Settings && this.props.Settings.address ? 'table show' : 'table hide' }>
<tr> <tr>
<td style={{ width: '5%' }}> <td style={{ width: '5%' }}>
@ -493,11 +565,16 @@ class Settings extends React.Component {
<div className="panel" id="ImportKeys"> <div className="panel" id="ImportKeys">
<div className="panel-heading" role="tab" onClick={ () => this.openTab('ImportKeys', 5) }> <div className="panel-heading" role="tab" onClick={ () => this.openTab('ImportKeys', 5) }>
<a className={this.state.activeTab === 5 ? 'panel-title' : 'panel-title collapsed'} data-toggle="collapse"> <a className={ this.state.activeTab === 5 ? 'panel-title' : 'panel-title collapsed' }>
<i className="icon md-key" aria-hidden="true"></i>{ translate('INDEX.IMPORT_KEYS') } <i className="icon md-key" aria-hidden="true"></i>{ translate('INDEX.IMPORT_KEYS') }
</a> </a>
</div> </div>
<div className={this.state.activeTab === 5 ? 'panel-collapse collapse in' : 'panel-collapse collapse'} style={{height: this.state.activeTab === 5 ? this.state.activeTabHeight + 'px' : '10px'}} id="ImportKeysTab" aria-labelledby="ImportKeys" role="tabpanel"> <div
className={ this.state.activeTab === 5 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
style={{ height: this.state.activeTab === 5 ? this.state.activeTabHeight + 'px' : '10px' }}
id="ImportKeysTab"
aria-labelledby="ImportKeys"
role="tabpanel">
<div className="panel-body"> <div className="panel-body">
<p> <p>
<div>{ translate('INDEX.IMPORT_KEYS_DESC_P1') }</div><br/> <div>{ translate('INDEX.IMPORT_KEYS_DESC_P1') }</div><br/>
@ -510,8 +587,15 @@ class Settings extends React.Component {
<div className="col-sm-12"></div> <div className="col-sm-12"></div>
<form className="wifkeys-import-form" method="post" action="javascript:" autoComplete="off"> <form className="wifkeys-import-form" method="post" action="javascript:" autoComplete="off">
<div className="form-group form-material floating"> <div className="form-group form-material floating">
<input type="text" className="form-control" name="importWifKey" id="import_wifkey" onChange={ this.updateInput } /> <input
<label className="floating-label" htmlFor="import_wifkey">{ translate('INDEX.INPUT_PRIV_KEY') }</label> type="text"
className="form-control"
name="importWifKey"
id="import_wifkey"
onChange={ this.updateInput } />
<label
className="floating-label"
htmlFor="import_wifkey">{ translate('INDEX.INPUT_PRIV_KEY') }</label>
</div> </div>
<div className="col-sm-12 col-xs-12" style={{ textAlign: 'center' }}> <div className="col-sm-12 col-xs-12" style={{ textAlign: 'center' }}>
<button <button
@ -531,13 +615,18 @@ class Settings extends React.Component {
<i className="icon fa-bug" aria-hidden="true"></i>{ translate('INDEX.DEBUG_LOG') } <i className="icon fa-bug" aria-hidden="true"></i>{ translate('INDEX.DEBUG_LOG') }
</a> </a>
</div> </div>
<div className={ this.state.activeTab === 6 ? 'panel-collapse collapse in' : 'panel-collapse collapse' } <div
className={ this.state.activeTab === 6 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
style={{ height: this.state.activeTab === 6 ? this.state.activeTabHeight + 'px' : '10px' }} style={{ height: this.state.activeTab === 6 ? this.state.activeTabHeight + 'px' : '10px' }}
id="DebugLogTab" aria-labelledby="DebugLog" role="tabpanel"> id="DebugLogTab" aria-labelledby="DebugLog" role="tabpanel">
<div className="panel-body"> <div className="panel-body">
<p>{ translate('INDEX.DEBUG_LOG_DESC') }</p> <p>{ translate('INDEX.DEBUG_LOG_DESC') }</p>
<div className="col-sm-12"></div> <div className="col-sm-12"></div>
<form className="read-debug-log-import-form" method="post" action="javascript:" autoComplete="off"> <form
className="read-debug-log-import-form"
method="post"
action="javascript:"
autoComplete="off">
<div className="form-group form-material floating"> <div className="form-group form-material floating">
<input <input
type="text" type="text"
@ -546,14 +635,22 @@ class Settings extends React.Component {
id="read_debug_log_lines" id="read_debug_log_lines"
value={ this.state.debugLinesCount } value={ this.state.debugLinesCount }
onChange={ this.updateInput } /> onChange={ this.updateInput } />
<label className="floating-label" htmlFor="read_debug_log_lines">{ translate('INDEX.DEBUG_LOG_LINES') }</label> <label
className="floating-label"
htmlFor="read_debug_log_lines">{ translate('INDEX.DEBUG_LOG_LINES') }</label>
</div> </div>
<div className="form-group form-material floating"> <div className="form-group form-material floating">
<select className="form-control form-material" name="debugTarget" id="settings_select_debuglog_options" onChange={ this.updateInput }> <select
className="form-control form-material"
name="debugTarget"
id="settings_select_debuglog_options"
onChange={ this.updateInput }>
<option value="iguana">Iguana</option> <option value="iguana">Iguana</option>
<option value="komodo">Komodo</option> <option value="komodo">Komodo</option>
</select> </select>
<label className="floating-label" htmlFor="settings_select_debuglog_options">{ translate('INDEX.TARGET') }</label> <label
className="floating-label"
htmlFor="settings_select_debuglog_options">{ translate('INDEX.TARGET') }</label>
</div> </div>
<div className="col-sm-12 col-xs-12" style={{ textAlign: 'center'}}> <div className="col-sm-12 col-xs-12" style={{ textAlign: 'center'}}>
<button <button

4
react/src/components/dashboard/walletsData.js

@ -286,7 +286,7 @@ class WalletsData extends React.Component {
className="dataTables_info" className="dataTables_info"
id="kmd-tx-history-tbl_info" id="kmd-tx-history-tbl_info"
role="status" role="status"
aria-live="polite">{ translate('INDEX.SHOWING') } { _paginationFrom } { translate('INDEX.TO') } { _paginationTo } { translate('INDEX.OF') } { this.props.ActiveCoin.txhistory.length } { translate('INDEX.ENTRIES_SM') }</div> aria-live="polite">{ translate('INDEX.SHOWING') } { _paginationFrom } { translate('INDEX.TO_ALT') } { _paginationTo } { translate('INDEX.OF') } { this.props.ActiveCoin.txhistory.length } { translate('INDEX.ENTRIES_SM') }</div>
</div> </div>
<div className="col-sm-7"> <div className="col-sm-7">
<div className="dataTables_paginate paging_simple_numbers" id="kmd-tx-history-tbl_paginate"> <div className="dataTables_paginate paging_simple_numbers" id="kmd-tx-history-tbl_paginate">
@ -628,7 +628,7 @@ class WalletsData extends React.Component {
</li> </li>
<li <li
role="presentation" role="presentation"
className={ !this.state.useCache || this.props.ActiveCoin.addresses.public.length === 1 ? 'hide' : '' }> className={ !this.state.useCache || this.props.ActiveCoin.addresses && this.props.ActiveCoin.addresses.public.length === 1 ? 'hide' : '' }>
<a role="menuitem" onClick={ this.basiliskRefreshAction }> <a role="menuitem" onClick={ this.basiliskRefreshAction }>
<i className="icon fa-cloud-download" aria-hidden="true"></i> { translate('INDEX.FETCH_ALL_ADDR') } <i className="icon fa-cloud-download" aria-hidden="true"></i> { translate('INDEX.FETCH_ALL_ADDR') }
</a> </a>

34
react/src/translate/en.js

@ -1,6 +1,7 @@
export const _lang = { export const _lang = {
'EN': { 'EN': {
'INDEX': { 'INDEX': {
'ADD_COIN': 'Add Coin',
'STOP': 'Stop', 'STOP': 'Stop',
'START': 'Start', 'START': 'Start',
'UPDATE_UTXO': 'Update UTXO', 'UPDATE_UTXO': 'Update UTXO',
@ -15,7 +16,7 @@ export const _lang = {
'SHOW': 'Show', 'SHOW': 'Show',
'SHOWING': 'Showing', 'SHOWING': 'Showing',
'OF': 'of', 'OF': 'of',
'TO': 'to', 'TO_ALT': 'to',
'SEARCH': 'Search', 'SEARCH': 'Search',
'PREVIOUS': 'Previous', 'PREVIOUS': 'Previous',
'NEXT': 'Next', 'NEXT': 'Next',
@ -349,7 +350,10 @@ export const _lang = {
'FAILED_TO_ADDCOIN': 'Failed to add iguana coin', 'FAILED_TO_ADDCOIN': 'Failed to add iguana coin',
'FAILED_SHEPHERD_HERD': 'Failed to get execute shepherd herd', 'FAILED_SHEPHERD_HERD': 'Failed to get execute shepherd herd',
'COIN_SELECTION': 'Coin Selection', 'COIN_SELECTION': 'Coin Selection',
'SELECTION_NOT_FOUND': 'Local coin list is not found' 'SELECTION_NOT_FOUND': 'Local coin list is not found',
'LOCAL_UTXO_UPDATED': 'Local UTXO data is updated. Ready to send new transaction.',
'PROCESSING_UTXO': 'Processing UTXO',
'AWAITING_TX_RESP': 'Awaiting transaction data response'
}, },
'COIN_WALLETS': { 'COIN_WALLETS': {
'TX_FAILED': 'Transaction Failed', 'TX_FAILED': 'Transaction Failed',
@ -397,6 +401,24 @@ export const _lang = {
'SAVE_APP_CONFIG': 'Save app config', 'SAVE_APP_CONFIG': 'Save app config',
'CONFIG_RESTART_REQUIRED': 'Most changes to app config require wallet restart!', 'CONFIG_RESTART_REQUIRED': 'Most changes to app config require wallet restart!',
'APP_CONFIG': 'App Config', 'APP_CONFIG': 'App Config',
'APP_INFO': 'App Info',
'APP_RELEASE': 'App Release',
'NAME': 'Name',
'VERSION': 'Version',
'SYS_INFO': 'System Info',
'ARCH': 'Architecture',
'OS_TYPE': 'OS Type',
'OS_PLATFORM': 'OS Platfrom',
'OS_RELEASE': 'OS Release',
'CPU': 'CPU',
'CPU_CORES': 'CPU Cores',
'MEM': 'Memory',
'LOCATIONS': 'Locations',
'CACHE': 'Cache',
'CONFIG': 'Config',
'BIN': 'Bin',
'DIR': 'Dir',
'ADD_PEER_IP': 'Add Peer IP'
}, },
'TX_INFO': { 'TX_INFO': {
'ADDRESS': 'address', 'ADDRESS': 'address',
@ -418,7 +440,13 @@ export const _lang = {
'AWAITING': 'Awaiting in queue', 'AWAITING': 'Awaiting in queue',
'PROCESSING': 'Processing', 'PROCESSING': 'Processing',
'ERROR_CODE': 'Error Code', 'ERROR_CODE': 'Error Code',
'WAITING': 'Waiting' 'WAITING': 'Waiting',
'PROCESSING_TRANSACTION': 'Processing transaction',
'NOTE_IT_WILL_TAKE': 'Note: it may take a few minutes to complete the transaction',
'SEND_VIA': 'Send via',
'ENTER_AN_ADDRESS': 'Enter an address',
'YOU_PICKED_OPT': 'You picked option',
'PLEASE_WAIT': 'Please wait'
} }
} }
}; };
Loading…
Cancel
Save