lukechilds
/
EasyDEX-GUI
mirror of https://github.com/lukechilds/EasyDEX-GUI.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Merge branch 'redux' into decouple-jsx-out-of-js 

# Conflicts:
#	react/src/components/addcoin/addcoin.js
#	react/src/components/dashboard/atomic.js
#	react/src/components/dashboard/coinTile.js
#	react/src/components/dashboard/coinTileItem.js
#	react/src/components/dashboard/jumblr.js
#	react/src/components/dashboard/navbar.js
#	react/src/components/dashboard/notifications.js
#	react/src/components/dashboard/receiveCoin.js
#	react/src/components/login/login.js
all-modes
petitPapillon 8 years ago
parent
3feb00f2b2 a6629fbceb
commit
8596d2e865
34 changed files with 377 additions and 674 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 4
      react/src/actions/actionCreators.js
  2. 3
      react/src/actions/actions/nativeNewAddress.js
  3. 3
      react/src/actions/actions/nativeSend.js
  4. 2
      react/src/components/dashboard/about.js
  5. 3
      react/src/components/dashboard/atomic.js
  6. 4
      react/src/components/dashboard/coinTileItem.js
  7. 4
      react/src/components/dashboard/dashboard.scss
  8. 2
      react/src/components/dashboard/edex.js
  9. 97
      react/src/components/dashboard/sendCoin.js
  10. 143
      react/src/components/dashboard/settings.js
  11. 32
      react/src/components/dashboard/syncOnly.js
  12. 35
      react/src/components/dashboard/walletsBalance.js
  13. 6
      react/src/components/dashboard/walletsBasiliskConnection.js
  14. 4
      react/src/components/dashboard/walletsBasiliskRefresh.js
  15. 9
      react/src/components/dashboard/walletsCacheData.js
  16. 120
      react/src/components/dashboard/walletsData.js
  17. 144
      react/src/components/dashboard/walletsHeader.js
  18. 4
      react/src/components/dashboard/walletsNative.js
  19. 8
      react/src/components/dashboard/walletsNativeAlert.js
  20. 32
      react/src/components/dashboard/walletsNativeBalance.js
  21. 22
      react/src/components/dashboard/walletsNativeInfo.js
  22. 42
      react/src/components/dashboard/walletsNativeReceive.js
  23. 43
      react/src/components/dashboard/walletsNativeSend.js
  24. 41
      react/src/components/dashboard/walletsNativeSyncProgress.js
  25. 42
      react/src/components/dashboard/walletsNativeTxHistory.js
  26. 67
      react/src/components/dashboard/walletsNativeTxInfo.js
  27. 21
      react/src/components/dashboard/walletsNav.js
  28. 4
      react/src/components/dashboard/walletsNotariesList.js
  29. 31
      react/src/components/dashboard/walletsProgress.js
  30. 35
      react/src/components/dashboard/walletsTxInfo.js
  31. 4
      react/src/components/overrides.scss
  32. 2
      react/src/components/toaster/toaster-item.js
  33. 4
      react/src/components/toaster/toaster.js
  34. 4
      react/src/translate/en.js

4
react/src/actions/actionCreators.js
View File

@ -153,7 +153,7 @@ export function basiliskConnection(display) {
export function syncingNativeModeState(display, json) { export function syncingNativeModeState(display, json) {
return { return {
type: SYNCING_FULL_MODE, type: SYNCING_NATIVE_MODE,
syncingNativeMode: display, syncingNativeMode: display,
progress: json, progress: json,
} }
@ -161,7 +161,7 @@ export function syncingNativeModeState(display, json) {
export function syncingFullModeState(display, json) { export function syncingFullModeState(display, json) {
return { return {
type: SYNCING_NATIVE_MODE, type: SYNCING_FULL_MODE,
syncingFullMode: display, syncingFullMode: display,
progress: json, progress: json,
} }

3
react/src/actions/actions/nativeNewAddress.js
View File

@ -2,7 +2,8 @@ import { translate } from '../../translate/translate';
import { import {
triggerToaster, triggerToaster,
Config, Config,
getPassthruAgent getPassthruAgent,
getKMDAddressesNative
} from '../actionCreators'; } from '../actionCreators';
import { import {
logGuiHttp, logGuiHttp,

3
react/src/actions/actions/nativeSend.js
View File

@ -16,7 +16,8 @@ export function sendNativeTx(coin, _payload) {
let payload; let payload;
let _apiMethod; let _apiMethod;
if (_payload.addressType === 'public') { if (_payload.addressType === 'public' &&
_payload.sendTo.length !== 95) {
_apiMethod = 'sendtoaddress'; _apiMethod = 'sendtoaddress';
ajaxDataToHex = `["${_payload.sendTo}", ${Number(_payload.amount) - Number(_payload.fee)}]`; ajaxDataToHex = `["${_payload.sendTo}", ${Number(_payload.amount) - Number(_payload.fee)}]`;
} else { } else {

2
react/src/components/dashboard/about.js
View File

@ -4,7 +4,7 @@ class About extends React.Component {
render() { render() {
return ( return (
<div className="page margin-left-0"> <div className="page margin-left-0">
<div className="page-content" id="section-about-iguana"> <div className="page-content">
<h2>About Iguana</h2> <h2>About Iguana</h2>
<p>Page content goes here</p> <p>Page content goes here</p>
</div> </div>

3
react/src/components/dashboard/atomic.js
View File

@ -340,8 +340,7 @@ class Atomic extends React.Component {
} }
if (props.Atomic.response.error === 'less than required responses') { if (props.Atomic.response.error === 'less than required responses') {
console.log('error'); Store.dispatch(triggerToaster(true, 'Basilisk connection error', translate('TOASTR.SERVICE_NOTIFICATION'), 'error'));
// toastr.error(_lang[defaultLang].DASHBOARD.LESS_RESPONSES_REQ, _lang[defaultLang].DASHBOARD.BASILISC_NOTIFICATION)
} }
} }
} }

4
react/src/components/dashboard/coinTileItem.js
View File

@ -37,10 +37,6 @@ class CoinTileItem extends React.Component {
// TODO: 1) cache native/full node data to file // TODO: 1) cache native/full node data to file
// 2) limit amount of req per update e.g. list of addresses don't change too often // 2) limit amount of req per update e.g. list of addresses don't change too often
// 3) limit req in basilisk as much as possible incl. activehandle // 3) limit req in basilisk as much as possible incl. activehandle
// 4) add pending requests store
// TODO: update all addresses once in 20 min, current address every 10 min
// always fetch main addr data and current selected address
dispatchCoinActions(coin, mode) { dispatchCoinActions(coin, mode) {
if (mode === 'native') { if (mode === 'native') {

4
react/src/components/dashboard/dashboard.scss
View File

@ -95,11 +95,11 @@
} }
//walletsData.js //walletsData.js
z-index-10 { .z-index-10 {
z-index: 10; z-index: 10;
} }
full-width { .full-width {
width: 100%; width: 100%;
} }

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

@ -4,7 +4,7 @@ class EDEX extends React.Component {
render() { render() {
return ( return (
<div className="page margin-left-0"> <div className="page margin-left-0">
<div className="page-content" id="section-easydex"> <div className="page-content">
<h2>Coming Soon!</h2> <h2>Coming Soon!</h2>
</div> </div>
</div> </div>

97
react/src/components/dashboard/sendCoin.js
View File

@ -49,7 +49,7 @@ class SendCoin extends React.Component {
amount: 0, amount: 0,
fee: 0.0001, fee: 0.0001,
sendSig: false, sendSig: false,
sendApiType: false, sendApiType: true,
addressSelectorOpen: false, addressSelectorOpen: false,
currentStackLength: 0, currentStackLength: 0,
totalStackLength: 0, totalStackLength: 0,
@ -167,15 +167,15 @@ class SendCoin extends React.Component {
className={ 'full-width margin-bottom-10 margin-top-10 ' + (this.state.currentStackLength === 1 || (this.state.currentStackLength === 0 && this.state.totalStackLength === 0) ? 'hide' : 'progress progress-sm') }> className={ 'full-width margin-bottom-10 margin-top-10 ' + (this.state.currentStackLength === 1 || (this.state.currentStackLength === 0 && this.state.totalStackLength === 0) ? 'hide' : 'progress progress-sm') }>
<div <div
className="progress-bar progress-bar-striped active progress-bar-indicating progress-bar-success font-size-80-percent" className="progress-bar progress-bar-striped active progress-bar-indicating progress-bar-success font-size-80-percent"
style={{ width: 100 - (this.state.currentStackLength * 100 / this.state.totalStackLength) + '%' }} style={{ width: 100 - (this.state.currentStackLength * 100 / this.state.totalStackLength) + '%' }}>
role="progressbar">
{ translate('SEND.PROCESSING_REQ') }: { this.state.currentStackLength } / { this.state.totalStackLength } { translate('SEND.PROCESSING_REQ') }: { this.state.currentStackLength } / { this.state.totalStackLength }
</div> </div>
</div> </div>
<button <button
type="button" type="button"
className={ 'margin-top-10 ' + (isReadyToUpdate ? 'btn btn-primary waves-effect waves-light' : 'hide') } className={ 'margin-top-10 ' + (isReadyToUpdate ? 'btn btn-primary waves-effect waves-light' : 'hide') }
onClick={ this._fetchNewUTXOData } disabled={ waitUntilCallIsFinished }> onClick={ this._fetchNewUTXOData }
disabled={ waitUntilCallIsFinished }>
{ waitUntilCallIsFinished ? translate('SEND.LOCKED_PLEASE_WAIT') + '...' : translate('SEND.UPDATE') } { waitUntilCallIsFinished ? translate('SEND.LOCKED_PLEASE_WAIT') + '...' : translate('SEND.UPDATE') }
</button> </button>
</div> </div>
@ -218,12 +218,9 @@ class SendCoin extends React.Component {
return( return(
<li <li
data-original-index="2"
key={ mainAddress } key={ mainAddress }
className={ mainAddressAmount <= 0 ? 'hide' : '' }> className={ mainAddressAmount <= 0 ? 'hide' : '' }>
<a <a onClick={ () => this.updateAddressSelection(mainAddress, type, mainAddressAmount) }><i className={ type === 'public' ? 'icon fa-eye' : 'icon fa-eye-slash' }></i> <span className="text">[ { mainAddressAmount } { this.props.ActiveCoin.coin } ]  { mainAddress }</span><span className="glyphicon glyphicon-ok check-mark"></span></a>
tabIndex="0"
onClick={ () => this.updateAddressSelection(mainAddress, type, mainAddressAmount) }><i className={ type === 'public' ? 'icon fa-eye' : 'icon fa-eye-slash' }></i> <span className="text">[ { mainAddressAmount } { this.props.ActiveCoin.coin } ]  { mainAddress }</span><span className="glyphicon glyphicon-ok check-mark"></span></a>
</li> </li>
); );
} else { } else {
@ -242,9 +239,7 @@ class SendCoin extends React.Component {
<li <li
key={ address.address } key={ address.address }
className={ _amount <= 0 ? 'hide' : '' }> className={ _amount <= 0 ? 'hide' : '' }>
<a <a onClick={ () => this.updateAddressSelection(address.address, type, _amount) }><i className={ type === 'public' ? 'icon fa-eye' : 'icon fa-eye-slash' }></i> <span className="text">[ { _amount } { this.props.ActiveCoin.coin } ]  { address.address }</span><span className="glyphicon glyphicon-ok check-mark"></span></a>
tabIndex="0"
onClick={ () => this.updateAddressSelection(address.address, type, _amount) }><i className={ type === 'public' ? 'icon fa-eye' : 'icon fa-eye-slash' }></i> <span className="text">[ { _amount } { this.props.ActiveCoin.coin } ]  { address.address }</span><span className="glyphicon glyphicon-ok check-mark"></span></a>
</li> </li>
); );
} }
@ -291,12 +286,11 @@ class SendCoin extends React.Component {
renderAddressList() { renderAddressList() {
return ( return (
<div id="showkmdwalletaddrs" 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 <button
type="button" type="button"
className="btn dropdown-toggle btn-info" className="btn dropdown-toggle btn-info"
title={ '-' + translate('SEND.SELECT_T_OR_Z_ADDR') + '-' } title={ '-' + translate('SEND.SELECT_T_OR_Z_ADDR') + '-' }
aria-expanded="true"
onClick={ this.openDropMenu }> onClick={ this.openDropMenu }>
<span className="filter-option pull-left">{ this.renderSelectorCurrentLabel() } </span>&nbsp; <span className="filter-option pull-left">{ this.renderSelectorCurrentLabel() } </span>&nbsp;
<span className="bs-caret"> <span className="bs-caret">
@ -304,9 +298,9 @@ class SendCoin extends React.Component {
</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">
<li className="selected"> <li className="selected">
<a tabIndex="0"><span className="text"> - { translate('SEND.SELECT_T_OR_Z_ADDR') } - </span><span className="glyphicon glyphicon-ok check-mark"></span></a> <a><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>
@ -366,7 +360,8 @@ class SendCoin extends React.Component {
} }
if (step === 2) { if (step === 2) {
if (!this.state.sendApiType && this.props.ActiveCoin.mode === 'basilisk') { if (!this.state.sendApiType &&
this.props.ActiveCoin.mode === 'basilisk') {
this.handleBasiliskSend(); this.handleBasiliskSend();
} else { } else {
Store.dispatch(sendToAddress(this.props.ActiveCoin.coin, this.state)); Store.dispatch(sendToAddress(this.props.ActiveCoin.coin, this.state));
@ -694,7 +689,8 @@ class SendCoin extends React.Component {
.then(function(json) { .then(function(json) {
const reply = json.Answer; const reply = json.Answer;
if (reply && reply.length) { if (reply &&
reply.length) {
for (let i = 0; i < reply.length; i++) { for (let i = 0; i < reply.length; i++) {
const _address = reply[i].data.split(' '); const _address = reply[i].data.split(' ');
const coin = _address[0].replace('"oa1:', ''); const coin = _address[0].replace('"oa1:', '');
@ -723,13 +719,13 @@ class SendCoin extends React.Component {
<div className="col-lg-6 form-group form-material"> <div className="col-lg-6 form-group form-material">
<label <label
className="control-label" className="control-label"
htmlFor="kmd_wallet_sendto">Fetch OpenAlias recipient address</label> htmlFor="kmdWalletSendTo">Fetch OpenAlias recipient address</label>
<input <input
type="text" type="text"
className="form-control" className="form-control"
name="sendToOA" name="sendToOA"
onChange={ this.updateInput } onChange={ this.updateInput }
id="kmd_wallet_sendto" id="kmdWalletSendTo"
placeholder="Enter an alias as address@site.com" placeholder="Enter an alias as address@site.com"
autoComplete="off" autoComplete="off"
required /> required />
@ -738,7 +734,6 @@ class SendCoin extends React.Component {
<button <button
type="button" type="button"
className="btn btn-primary waves-effect waves-light" className="btn btn-primary waves-effect waves-light"
id="kmd_wallet_send_coins_btn"
onClick={ this.getOAdress }> onClick={ this.getOAdress }>
Get address Get address
</button> </button>
@ -775,30 +770,24 @@ class SendCoin extends React.Component {
this.props.ActiveCoin.send && this.props.ActiveCoin.send &&
this.props.ActiveCoin.mode !== 'native') { 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">
<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 margin-top-10"> <div className="steps row margin-top-10">
<div <div className={ this.state.currentStep === 0 ? 'step col-md-4 current' : 'step col-md-4' }>
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 <div className={ this.state.currentStep === 1 ? 'step col-md-4 current' : 'step col-md-4' }>
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 <div className={ this.state.currentStep === 2 ? 'step col-md-4 current' : 'step col-md-4' }>
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>
@ -807,29 +796,29 @@ class SendCoin extends React.Component {
</div> </div>
</div> </div>
<div className={ this.state.currentStep === 0 ? 'panel' : 'panel hide' } id="edexcoin-send-screen"> <div className={ this.state.currentStep === 0 ? 'panel' : 'panel hide' }>
<div className="panel-heading"> <div className="panel-heading">
<h3 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" method="post" role="form" autoComplete="off"> <form className="edexcoin-send-form" method="post" 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" htmlFor="edexcoin_send_from">{ translate('INDEX.SEND_FROM') }</label> <label className="control-label" htmlFor="edexcoinSendFrom">{ 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" htmlFor="edexcoin_sendto">{ translate('INDEX.SEND_TO') }</label> <label className="control-label" htmlFor="edexcoinSendTo">{ translate('INDEX.SEND_TO') }</label>
<input <input
type="text" type="text"
className="form-control" className="form-control"
id="edexcoin_sendto" id="edexcoinSendTo"
name="sendTo" name="sendTo"
placeholder={ translate('SEND.ENTER_AN_ADDRESS') } placeholder={ translate('SEND.ENTER_AN_ADDRESS') }
autoComplete="off" autoComplete="off"
@ -838,24 +827,24 @@ class SendCoin extends React.Component {
required /> 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" id="edexcoin_amount_label"> <label className="control-label" htmlFor="edexcoinAmount">
{ this.props.ActiveCoin.coin } { this.props.ActiveCoin.coin }
</label> </label>
<input <input
type="text" type="text"
className="form-control" className="form-control"
id="edexcoin_amount" id="edexcoinAmount"
name="amount" name="amount"
placeholder="0.000" placeholder="0.000"
autoComplete="off" autoComplete="off"
onChange={ this.updateInput } /> 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" htmlFor="edexcoin_fee">{ translate('INDEX.FEE') }</label> <label className="control-label" htmlFor="edexcoinFee">{ translate('INDEX.FEE') }</label>
<input <input
type="text" type="text"
className="form-control" className="form-control"
id="edexcoin_fee" id="edexcoinFee"
name="fee" name="fee"
defaultValue={ this.state.fee } defaultValue={ this.state.fee }
value={ this.state.fee } value={ this.state.fee }
@ -864,8 +853,8 @@ class SendCoin extends React.Component {
onChange={ this.updateInput } /> onChange={ this.updateInput } />
</div> </div>
<div className="col-lg-12"> <div className="col-lg-12">
<span data-edexcoin="KMD"> <span>
<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 } <strong>{ translate('INDEX.TOTAL') } ({ translate('INDEX.AMOUNT_SM') } - txfee):</strong> { Number(this.state.amount) - Number(this.state.fee) } { this.props.ActiveCoin.coin }
</span> </span>
</div> </div>
<div className={ this.state.sendApiType ? 'hide' : 'col-lg-10 margin-top-30' }> <div className={ this.state.sendApiType ? 'hide' : 'col-lg-10 margin-top-30' }>
@ -881,8 +870,9 @@ class SendCoin extends React.Component {
<div className="col-lg-12"> <div className="col-lg-12">
<button <button
type="button" type="button"
className="btn btn-primary waves-effect waves-light pull-right edexcoin_send_coins_btn_step1" className="btn btn-primary waves-effect waves-light pull-right"
onClick={ () => this.changeSendCoinStep(1) }> onClick={ () => this.changeSendCoinStep(1) }
disabled={ !this.state.sendFrom || !this.state.sendTo || !this.state.amount }>
{ 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>
@ -893,19 +883,19 @@ class SendCoin extends React.Component {
</div> </div>
<div className={ this.state.currentStep === 1 ? 'col-xlg-12 col-md-12 col-sm-12 col-xs-12' : 'col-xlg-12 col-md-12 col-sm-12 col-xs-12 hide' }> <div className={ this.state.currentStep === 1 ? 'col-xlg-12 col-md-12 col-sm-12 col-xs-12' : 'col-xlg-12 col-md-12 col-sm-12 col-xs-12 hide' }>
<div className="panel" id="edexcoin-send-confirm-screen"> <div className="panel">
<div className="panel-body"> <div className="panel-body">
<div className="row"> <div className="row">
<div className="col-xs-12"> <div className="col-xs-12">
<strong>{ translate('INDEX.TO') }</strong> <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">{ 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">
<span id="mdl_confirm_currency_send_amount">{this.state.amount}</span> { this.props.ActiveCoin.coin } { this.state.amount } { this.props.ActiveCoin.coin }
</div> </div>
<div className="col-lg-6 col-sm-6 col-xs-12">{ translate('INDEX.TX_FEE_REQ') }</div> <div className="col-lg-6 col-sm-6 col-xs-12">{ translate('INDEX.TX_FEE_REQ') }</div>
<div className="col-lg-6 col-sm-6 col-xs-6"> <div className="col-lg-6 col-sm-6 col-xs-6">
<span id="mdl_confirm_currency_send_fee">{ this.state.fee }</span> { this.props.ActiveCoin.coin } { this.state.fee } { this.props.ActiveCoin.coin }
</div> </div>
</div> </div>
<br /> <br />
@ -914,21 +904,19 @@ class SendCoin extends React.Component {
<div className="col-xs-12"> <div className="col-xs-12">
<strong>{ translate('INDEX.FROM') }</strong> <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">{ this.props.Dashboard.activeHandle[this.props.ActiveCoin.coin] }</div>
<div className="col-lg-6 col-sm-6 col-xs-6 confirm-currency-send-container"> <div className="col-lg-6 col-sm-6 col-xs-6 confirm-currency-send-container">
<span id="mdl_confirm_currency_sendfrom_total_dedcut">{ Number(this.state.amount) - Number(this.state.fee) }</span> { this.props.ActiveCoin.coin } { Number(this.state.amount) - Number(this.state.fee) } { this.props.ActiveCoin.coin }
</div> </div>
</div> </div>
<div className="widget-body-footer"> <div className="widget-body-footer">
<a <a
className="btn btn-default waves-effect waves-light" className="btn btn-default waves-effect waves-light"
id="edexcoin_send_coins_back_btn"
onClick={ () => this.changeSendCoinStep(0) }>{ translate('INDEX.BACK') }</a> onClick={ () => this.changeSendCoinStep(0) }>{ translate('INDEX.BACK') }</a>
<div className="widget-actions pull-right"> <div className="widget-actions pull-right">
<button <button
type="button" type="button"
className="btn btn-primary" className="btn btn-primary"
id="edexcoin_send_coins_btn"
onClick={ () => this.changeSendCoinStep(2) }>{ translate('INDEX.CONFIRM') }</button> onClick={ () => this.changeSendCoinStep(2) }>{ translate('INDEX.CONFIRM') }</button>
</div> </div>
</div> </div>
@ -937,15 +925,13 @@ class SendCoin extends React.Component {
</div> </div>
<div className={ this.state.currentStep === 2 ? 'col-xlg-12 col-md-12 col-sm-12 col-xs-12' : 'col-xlg-12 col-md-12 col-sm-12 col-xs-12 hide' }> <div className={ this.state.currentStep === 2 ? 'col-xlg-12 col-md-12 col-sm-12 col-xs-12' : 'col-xlg-12 col-md-12 col-sm-12 col-xs-12 hide' }>
<div className="panel" id="edexcoin-send-txdetails-screen"> <div className="panel">
<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' }>
{ translate('SEND.YOU_PICKED_OPT') } { translate('SEND.YOU_PICKED_OPT') }
</div> </div>
<table <table className="table table-hover table-striped">
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>
@ -961,7 +947,6 @@ class SendCoin extends React.Component {
<button <button
type="button" type="button"
className="btn btn-primary" className="btn btn-primary"
id="edexcoin_send_coins_anothertx_btn"
onClick={ () => this.changeSendCoinStep(0) } onClick={ () => this.changeSendCoinStep(0) }
disabled={ this.state.utxoMethodInProgress }>{ !this.state.utxoMethodInProgress ? translate('INDEX.MAKE_ANOTHER_TX') : translate('SEND.PLEASE_WAIT') + '...' }</button> disabled={ this.state.utxoMethodInProgress }>{ !this.state.utxoMethodInProgress ? translate('INDEX.MAKE_ANOTHER_TX') : translate('SEND.PLEASE_WAIT') + '...' }</button>
</div> </div>

143
react/src/components/dashboard/settings.js
View File

@ -126,16 +126,14 @@ class Settings extends React.Component {
if (releaseInfo) { if (releaseInfo) {
return ( return (
<div className="panel" id="AppInfo" onClick={ () => this.openTab('AppInfo', 8) }> <div className="panel" id="AppInfo" onClick={ () => this.openTab('AppInfo', 8) }>
<div className="panel-heading" role="tab"> <div className="panel-heading">
<a className={ this.state.activeTab === 8 ? 'panel-title' : 'panel-title collapsed' }> <a className={ this.state.activeTab === 8 ? 'panel-title' : 'panel-title collapsed' }>
<i className="icon md-info" aria-hidden="true"></i>{ translate('SETTINGS.APP_INFO') } <i className="icon md-info"></i>{ translate('SETTINGS.APP_INFO') }
</a> </a>
</div> </div>
<div <div
className={ this.state.activeTab === 8 ? 'panel-collapse collapse in' : 'panel-collapse collapse' } className={ this.state.activeTab === 8 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
style={{ height: this.state.activeTab === 8 ? this.state.activeTabHeight + 'px' : '0' }} style={{ height: this.state.activeTab === 8 ? this.state.activeTabHeight + 'px' : '0' }}>
aria-labelledby="DebugLog"
role="tabpanel">
<div className="panel-body"> <div className="panel-body">
<div className="col-sm-12 padding-top-15"> <div className="col-sm-12 padding-top-15">
<div className="row"> <div className="row">
@ -346,29 +344,26 @@ class Settings extends React.Component {
return ( return (
<div className="margin-left-0"> <div className="margin-left-0">
<div className="page-content" id="section-iguana-wallet-settings"> <div className="page-content" id="section-iguana-wallet-settings">
<div className="row" id="iguana-wallet-settings"> <div className="row">
<div className="col-xlg-12 col-md-12"> <div className="col-xlg-12 col-md-12">
<div className="row" id="iguana-wallet-settings"> <div className="row">
<div className="col-xlg-12 col-md-12"> <div className="col-xlg-12 col-md-12">
<h4 className="font-size-14 text-uppercase">{ translate('INDEX.WALLET_SETTINGS') }</h4> <h4 className="font-size-14 text-uppercase">{ translate('INDEX.WALLET_SETTINGS') }</h4>
<div className="panel-group" id="SettingsAccordion" aria-multiselectable="true" role="tablist"> <div className="panel-group" id="SettingsAccordion">
<div <div
className="panel" className="panel"
id="WalletInfo" id="WalletInfo"
onClick={ () => this.openTab('WalletInfo', 0) }> onClick={ () => this.openTab('WalletInfo', 0) }>
<div className="panel-heading" role="tab"> <div className="panel-heading">
<a className={ this.state.activeTab === 0 ? 'panel-title' : 'panel-title collapsed' }> <a className={ this.state.activeTab === 0 ? 'panel-title' : 'panel-title collapsed' }>
<i className="icon md-balance-wallet" aria-hidden="true"></i>{ translate('INDEX.WALLET_INFO') } <i className="icon md-balance-wallet"></i>{ translate('INDEX.WALLET_INFO') }
</a> </a>
</div> </div>
<div <div
className={ this.state.activeTab === 0 ? 'panel-collapse collapse in' : 'panel-collapse collapse' } className={ this.state.activeTab === 0 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
style={{ height: this.state.activeTab === 0 ? this.state.activeTabHeight + 'px' : '0' }} style={{ height: this.state.activeTab === 0 ? this.state.activeTabHeight + 'px' : '0' }}>
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">
<thead> <thead>
<tr> <tr>
<th width="10%">{ translate('INDEX.KEY') }</th> <th width="10%">{ translate('INDEX.KEY') }</th>
@ -378,39 +373,27 @@ class Settings extends React.Component {
<tbody> <tbody>
<tr> <tr>
<td className="wallet-info-key">pubkey</td> <td className="wallet-info-key">pubkey</td>
<td> <td>{ this.props.Main.activeHandle.pubkey }</td>
<div id="winfo_pubkey_value">{ this.props.Main.activeHandle.pubkey }</div>
</td>
</tr> </tr>
<tr> <tr>
<td className="wallet-info-key">btcpubkey</td> <td className="wallet-info-key">btcpubkey</td>
<td> <td>{ this.props.Main.activeHandle.btcpubkey }</td>
<div id="winfo_btcpubkey_value">{ this.props.Main.activeHandle.btcpubkey }</div>
</td>
</tr> </tr>
<tr> <tr>
<td className="wallet-info-key">rmd160</td> <td className="wallet-info-key">rmd160</td>
<td> <td>{ this.props.Main.activeHandle.rmd160 }</td>
<div id="winfo_rmd160_value">{ this.props.Main.activeHandle.rmd160 }</div>
</td>
</tr> </tr>
<tr> <tr>
<td className="wallet-info-key">NXT</td> <td className="wallet-info-key">NXT</td>
<td> <td>{ this.props.Main.activeHandle.NXT }</td>
<div id="winfo_NXT_value">{ this.props.Main.activeHandle.NXT }</div>
</td>
</tr> </tr>
<tr> <tr>
<td className="wallet-info-key">notary</td> <td className="wallet-info-key">notary</td>
<td> <td>{ this.props.Main.activeHandle.notary }</td>
<div id="winfo_notary_value">{ this.props.Main.activeHandle.notary }</div>
</td>
</tr> </tr>
<tr> <tr>
<td className="wallet-info-key">status</td> <td className="wallet-info-key">status</td>
<td> <td>{ this.props.Main.activeHandle.status }</td>
<div id="winfo_status_value">{ this.props.Main.activeHandle.status }</div>
</td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
@ -422,17 +405,14 @@ class Settings extends React.Component {
className="panel" className="panel"
id="AddNodeforCoin" id="AddNodeforCoin"
onClick={ () => this.openTab('AddNodeforCoin', 1) }> onClick={ () => this.openTab('AddNodeforCoin', 1) }>
<div className="panel-heading" role="tab"> <div className="panel-heading">
<a className={ this.state.activeTab === 1 ? 'panel-title' : 'panel-title collapsed' }> <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"></i>{ translate('INDEX.ADD_NODE') }
</a> </a>
</div> </div>
<div <div
className={ this.state.activeTab === 1 ? 'panel-collapse collapse in' : 'panel-collapse collapse' } className={ this.state.activeTab === 1 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
style={{ height: this.state.activeTab === 1 ? this.state.activeTabHeight + 'px' : '0' }} style={{ height: this.state.activeTab === 1 ? this.state.activeTabHeight + 'px' : '0' }}>
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">
@ -443,7 +423,6 @@ class Settings extends React.Component {
<div className="form-group"> <div className="form-group">
<select <select
className="form-control form-material" className="form-control form-material"
id="settings_select_coin_options"
name="getPeersCoin" name="getPeersCoin"
onChange={ this.updateInput }> onChange={ this.updateInput }>
<option>{ translate('INDEX.SELECT_COIN') }</option> <option>{ translate('INDEX.SELECT_COIN') }</option>
@ -457,18 +436,17 @@ class Settings extends React.Component {
<button <button
type="button" type="button"
className="btn btn-primary waves-effect waves-light" className="btn btn-primary waves-effect waves-light"
id="settings_getcoinpeers_btn"
onClick={ this.checkNodes }>{ translate('INDEX.CHECK_NODES') }</button> onClick={ this.checkNodes }>{ translate('INDEX.CHECK_NODES') }</button>
</div> </div>
<div className="col-sm-12"> <div className="col-sm-12">
<h5> <h5>
SuperNET Peers: <span id="coin_supernetpeers_h"></span> SuperNET Peers:
</h5> </h5>
<p id="coin_supernetpeers">{ this.renderSNPeersList() }</p> <p>{ this.renderSNPeersList() }</p>
<h5> <h5>
Raw Peers: <span id="coin_rawpeers_h"></span> Raw Peers:
</h5> </h5>
<p id="coin_rawpeers">{ this.renderPeersList() }</p> <p>{ this.renderPeersList() }</p>
</div> </div>
</div> </div>
@ -480,7 +458,6 @@ class Settings extends React.Component {
<div className="form-group"> <div className="form-group">
<select <select
className="form-control form-material" className="form-control form-material"
id="settings_select_coin_addpeer_options"
name="addNodeCoin" name="addNodeCoin"
onChange={ this.updateInput }> onChange={ this.updateInput }>
<option>{ translate('INDEX.SELECT_COIN') }</option> <option>{ translate('INDEX.SELECT_COIN') }</option>
@ -493,7 +470,6 @@ class Settings extends React.Component {
<input <input
type="text" type="text"
className="form-control" className="form-control"
id="settings_add_peer_ip"
name="addPeerIP" name="addPeerIP"
placeholder={ translate('SETTINGS.ADD_PEER_IP') } placeholder={ translate('SETTINGS.ADD_PEER_IP') }
onChange={ this.updateInput } /> onChange={ this.updateInput } />
@ -503,7 +479,6 @@ class Settings extends React.Component {
<button <button
type="button" type="button"
className="btn btn-primary waves-effect waves-light" className="btn btn-primary waves-effect waves-light"
id="settings_addcoinpeers_btn"
onClick={ this.addNode }>{ translate('INDEX.ADD_NODE') }</button> onClick={ this.addNode }>{ translate('INDEX.ADD_NODE') }</button>
</div> </div>
</div> </div>
@ -516,17 +491,14 @@ class Settings extends React.Component {
className="panel" className="panel"
id="DumpWallet" id="DumpWallet"
onClick={ () => this.openTab('DumpWallet', 2) }> onClick={ () => this.openTab('DumpWallet', 2) }>
<div className="panel-heading" role="tab"> <div className="panel-heading">
<a className={ this.state.activeTab === 2 ? 'panel-title' : 'panel-title collapsed' }> <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"></i>{ translate('INDEX.WALLET_BACKUP') }
</a> </a>
</div> </div>
<div <div
className={ this.state.activeTab === 2 ? 'panel-collapse collapse in' : 'panel-collapse collapse' } className={ this.state.activeTab === 2 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
style={{ height: this.state.activeTab === 2 ? this.state.activeTabHeight + 'px' : '0' }} style={{ height: this.state.activeTab === 2 ? this.state.activeTabHeight + 'px' : '0' }}>
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>
@ -535,17 +507,14 @@ class Settings extends React.Component {
className="panel" className="panel"
id="FiatCurrencySettings" id="FiatCurrencySettings"
onClick={ () => this.openTab('FiatCurrencySettings', 3) }> onClick={ () => this.openTab('FiatCurrencySettings', 3) }>
<div className="panel-heading" role="tab"> <div className="panel-heading">
<a className={ this.state.activeTab === 3 ? 'panel-title' : 'panel-title collapsed' }> <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"></i>{ translate('INDEX.FIAT_CURRENCY') }
</a> </a>
</div> </div>
<div <div
className={ this.state.activeTab === 3 ? 'panel-collapse collapse in' : 'panel-collapse collapse' } className={ this.state.activeTab === 3 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
style={{ height: this.state.activeTab === 3 ? this.state.activeTabHeight + 'px' : '0' }} style={{ height: this.state.activeTab === 3 ? this.state.activeTabHeight + 'px' : '0' }}>
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>
@ -554,17 +523,14 @@ class Settings extends React.Component {
className="panel" className="panel"
id="ExportKeys" id="ExportKeys"
onClick={ () => this.openTab('ExportKeys', 4) }> onClick={ () => this.openTab('ExportKeys', 4) }>
<div className="panel-heading" role="tab"> <div className="panel-heading">
<a className={ this.state.activeTab === 4 ? 'panel-title' : 'panel-title collapsed' }> <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"></i>{ translate('INDEX.EXPORT_KEYS') }
</a> </a>
</div> </div>
<div <div
className={ this.state.activeTab === 4 ? 'panel-collapse collapse in' : 'panel-collapse collapse' } className={ this.state.activeTab === 4 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
style={{ height: this.state.activeTab === 4 ? this.state.activeTabHeight + 'px' : '0' }} style={{ height: this.state.activeTab === 4 ? this.state.activeTabHeight + 'px' : '0' }}>
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/>
@ -579,21 +545,20 @@ class Settings extends React.Component {
type="password" type="password"
className="form-control" className="form-control"
name="wifkeysPassphrase" name="wifkeysPassphrase"
id="wifkeys_passphrase" id="wifkeysPassphrase"
onChange={ this.updateInput } /> onChange={ this.updateInput } />
<label className="floating-label" htmlFor="wifkeys_passphrase">{ translate('INDEX.PASSPHRASE') }</label> <label className="floating-label" htmlFor="wifkeysPassphrase">{ translate('INDEX.PASSPHRASE') }</label>
</div> </div>
<div className="col-sm-12 col-xs-12 text-align-center"> <div className="col-sm-12 col-xs-12 text-align-center">
<button <button
type="button" type="button"
className="btn btn-primary waves-effect waves-light" className="btn btn-primary waves-effect waves-light"
id="wifkeys_passphrase_btn"
onClick={ this.exportWifKeys }>{ translate('INDEX.GET_WIF_KEYS') }</button> onClick={ this.exportWifKeys }>{ translate('INDEX.GET_WIF_KEYS') }</button>
</div> </div>
</form> </form>
<div className="col-sm-12 padding-top-15"> <div className="col-sm-12 padding-top-15">
<div className="row" id="wif-priv-keys"> <div className="row">
<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 className="width-5-percent"> <td className="width-5-percent">
@ -618,17 +583,14 @@ class Settings extends React.Component {
className="panel" className="panel"
id="ImportKeys" id="ImportKeys"
onClick={ () => this.openTab('ImportKeys', 5) }> onClick={ () => this.openTab('ImportKeys', 5) }>
<div className="panel-heading" role="tab"> <div className="panel-heading">
<a className={ this.state.activeTab === 5 ? 'panel-title' : 'panel-title collapsed' }> <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"></i>{ translate('INDEX.IMPORT_KEYS') }
</a> </a>
</div> </div>
<div <div
className={ this.state.activeTab === 5 ? 'panel-collapse collapse in' : 'panel-collapse collapse' } className={ this.state.activeTab === 5 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
style={{ height: this.state.activeTab === 5 ? this.state.activeTabHeight + 'px' : '0' }} style={{ height: this.state.activeTab === 5 ? this.state.activeTabHeight + 'px' : '0' }}>
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/>
@ -645,17 +607,16 @@ class Settings extends React.Component {
type="text" type="text"
className="form-control" className="form-control"
name="importWifKey" name="importWifKey"
id="import_wifkey" id="importWifkey"
onChange={ this.updateInput } /> onChange={ this.updateInput } />
<label <label
className="floating-label" className="floating-label"
htmlFor="import_wifkey">{ translate('INDEX.INPUT_PRIV_KEY') }</label> htmlFor="importWifkey">{ translate('INDEX.INPUT_PRIV_KEY') }</label>
</div> </div>
<div className="col-sm-12 col-xs-12 text-align-center"> <div className="col-sm-12 col-xs-12 text-align-center">
<button <button
type="button" type="button"
className="btn btn-primary waves-effect waves-light" className="btn btn-primary waves-effect waves-light"
id="import_wifkey_btn"
onClick={ this.importWifKey }>{ translate('INDEX.IMPORT_PRIV_KEY') }</button> onClick={ this.importWifKey }>{ translate('INDEX.IMPORT_PRIV_KEY') }</button>
</div> </div>
</form> </form>
@ -667,15 +628,14 @@ class Settings extends React.Component {
className="panel" className="panel"
id="DebugLog" id="DebugLog"
onClick={ () => this.openTab('DebugLog', 6) }> onClick={ () => this.openTab('DebugLog', 6) }>
<div className="panel-heading" role="tab"> <div className="panel-heading">
<a className={ this.state.activeTab === 6 ? 'panel-title' : 'panel-title collapsed' }> <a className={ this.state.activeTab === 6 ? 'panel-title' : 'panel-title collapsed' }>
<i className="icon fa-bug" aria-hidden="true"></i>{ translate('INDEX.DEBUG_LOG') } <i className="icon fa-bug"></i>{ translate('INDEX.DEBUG_LOG') }
</a> </a>
</div> </div>
<div <div
className={ this.state.activeTab === 6 ? 'panel-collapse collapse in' : 'panel-collapse collapse' } className={ this.state.activeTab === 6 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
style={{ height: this.state.activeTab === 6 ? this.state.activeTabHeight + 'px' : '0' }} style={{ height: this.state.activeTab === 6 ? this.state.activeTabHeight + 'px' : '0' }}>
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>
@ -689,31 +649,30 @@ class Settings extends React.Component {
type="text" type="text"
className="form-control" className="form-control"
name="debugLinesCount" name="debugLinesCount"
id="read_debug_log_lines" id="readDebugLogLines"
value={ this.state.debugLinesCount } value={ this.state.debugLinesCount }
onChange={ this.updateInput } /> onChange={ this.updateInput } />
<label <label
className="floating-label" className="floating-label"
htmlFor="read_debug_log_lines">{ translate('INDEX.DEBUG_LOG_LINES') }</label> htmlFor="readDebugLogLines">{ translate('INDEX.DEBUG_LOG_LINES') }</label>
</div> </div>
<div className="form-group form-material floating"> <div className="form-group form-material floating">
<select <select
className="form-control form-material" className="form-control form-material"
name="debugTarget" name="debugTarget"
id="settings_select_debuglog_options" id="settingsDelectDebugLogOptions"
onChange={ this.updateInput }> 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 <label
className="floating-label" className="floating-label"
htmlFor="settings_select_debuglog_options">{ translate('INDEX.TARGET') }</label> htmlFor="settingsDelectDebugLogOptions">{ translate('INDEX.TARGET') }</label>
</div> </div>
<div className="col-sm-12 col-xs-12 text-align-center"> <div className="col-sm-12 col-xs-12 text-align-center">
<button <button
type="button" type="button"
className="btn btn-primary waves-effect waves-light" className="btn btn-primary waves-effect waves-light"
id="read_debug_log_btn"
onClick={ this.readDebugLog }>{ translate('INDEX.LOAD_DEBUG_LOG') }</button> onClick={ this.readDebugLog }>{ translate('INDEX.LOAD_DEBUG_LOG') }</button>
</div> </div>
<div className="col-sm-12 col-xs-12 text-align-left"> <div className="col-sm-12 col-xs-12 text-align-left">
@ -728,15 +687,14 @@ class Settings extends React.Component {
className="panel" className="panel"
id="AppSettings" id="AppSettings"
onClick={ () => this.openTab('AppSettings', 7) }> onClick={ () => this.openTab('AppSettings', 7) }>
<div className="panel-heading" role="tab"> <div className="panel-heading">
<a className={ this.state.activeTab === 7 ? 'panel-title' : 'panel-title collapsed' }> <a className={ this.state.activeTab === 7 ? 'panel-title' : 'panel-title collapsed' }>
<i className="icon fa-wrench" aria-hidden="true"></i>{ translate('SETTINGS.APP_CONFIG') } (config.json) <i className="icon fa-wrench"></i>{ translate('SETTINGS.APP_CONFIG') } (config.json)
</a> </a>
</div> </div>
<div <div
className={ this.state.activeTab === 7 ? 'panel-collapse collapse in' : 'panel-collapse collapse' } className={ this.state.activeTab === 7 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
style={{ height: this.state.activeTab === 7 ? this.state.activeTabHeight + 'px' : '0' }} style={{ height: this.state.activeTab === 7 ? this.state.activeTabHeight + 'px' : '0' }}>
id="DebugLogTab" aria-labelledby="DebugLog" role="tabpanel">
<div className="panel-body"> <div className="panel-body">
<p> <p>
<strong>{ translate('SETTINGS.CONFIG_RESTART_REQUIRED') }</strong> <strong>{ translate('SETTINGS.CONFIG_RESTART_REQUIRED') }</strong>
@ -752,7 +710,6 @@ class Settings extends React.Component {
<button <button
type="button" type="button"
className="btn btn-primary waves-effect waves-light" className="btn btn-primary waves-effect waves-light"
id="read_debug_log_btn"
onClick={ this._saveAppConfig }>{ translate('SETTINGS.SAVE_APP_CONFIG') }</button> onClick={ this._saveAppConfig }>{ translate('SETTINGS.SAVE_APP_CONFIG') }</button>
</div> </div>
</div> </div>

32
react/src/components/dashboard/syncOnly.js
View File

@ -97,17 +97,13 @@ class SyncOnly extends React.Component {
<div> <div>
<div className="progress progress-sm"> <div className="progress progress-sm">
<div <div
className={'font-size-80-percent full-width ' + (this.isFullySynced(fork) ? 'progress-bar progress-bar-striped active progress-bar-indicating progress-bar-success' : 'hide') } className={'font-size-80-percent full-width ' + (this.isFullySynced(fork) ? 'progress-bar progress-bar-striped active progress-bar-indicating progress-bar-success' : 'hide') }>
role="progressbar" { translate('INDEX.BUNDLES') } ({ fork.coin }) 100.00% - ( { fork.blocks } / { fork.blocks } ) ==&gt;&gt; RT{ fork.RTheight }
id="currency-bundles">
{ translate('INDEX.BUNDLES') } <span id="currency-bundles-percent">({ fork.coin }) 100.00% - ( { fork.blocks } / { fork.blocks } ) ==&gt;&gt; RT{ fork.RTheight }</span>
</div> </div>
<div <div
className={ 'font-size-80-percent ' + (this.isFullySynced(fork) ? 'hide' : 'progress-bar progress-bar-info progress-bar-striped active') } className={ 'font-size-80-percent ' + (this.isFullySynced(fork) ? 'hide' : 'progress-bar progress-bar-info progress-bar-striped active') }
style={{ width: fork.bundles + '%' }} style={{ width: fork.bundles + '%' }}>
role="progressbar" { translate('INDEX.BUNDLES') } { fork.bundles }%
id="currency-bundles">
{ translate('INDEX.BUNDLES') } <span id="currency-bundles-percent">{ fork.bundles }%</span>
</div> </div>
</div> </div>
</div> </div>
@ -115,28 +111,22 @@ class SyncOnly extends React.Component {
<div className="progress progress-sm"> <div className="progress progress-sm">
<div <div
className="progress-bar progress-bar-warning progress-bar-striped active font-size-80-percent" className="progress-bar progress-bar-warning progress-bar-striped active font-size-80-percent"
style={{ width: fork.utxo + '%' }} style={{ width: fork.utxo + '%' }}>
role="progressbar" utxo { fork.utxo }%
id="currency-utxo">
utxo <span id="currency-utxo-percent">{ fork.utxo }%</span>
</div> </div>
</div> </div>
<div className="progress progress-sm"> <div className="progress progress-sm">
<div <div
className="progress-bar progress-bar-danger progress-bar-striped active font-size-80-percent" className="progress-bar progress-bar-danger progress-bar-striped active font-size-80-percent"
style={{ width: fork.balances + '%' }} style={{ width: fork.balances + '%' }}>
role="progressbar" { translate('INDEX.BALANCES') } { fork.balances }%
id="currency-balances">
{ translate('INDEX.BALANCES') } <span id="currency-balances-percent">{ fork.balances }%</span>
</div> </div>
</div> </div>
<div className="progress progress-sm"> <div className="progress progress-sm">
<div <div
className="progress-bar progress-bar-success progress-bar-striped active font-size-80-percent" className="progress-bar progress-bar-success progress-bar-striped active font-size-80-percent"
style={{ width: fork.validated + '%' }} style={{ width: fork.validated + '%' }}>
role="progressbar" { translate('INDEX.VALIDATED') } { fork.validated }%
id="currency-validated">
{ translate('INDEX.VALIDATED') } <span id="currency-validated-percent">{ fork.validated }%</span>
</div> </div>
</div> </div>
</div> </div>
@ -197,7 +187,7 @@ class SyncOnly extends React.Component {
this.props.SyncOnly.display) { this.props.SyncOnly.display) {
return ( return (
<div> <div>
<div className="modal show sync-only-forks" aria-hidden="false" role="dialog"> <div className="modal show sync-only-forks">
<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-body modal-body-container"> <div className="modal-body modal-body-container">

35
react/src/components/dashboard/walletsBalance.js
View File

@ -98,30 +98,29 @@ class WalletsBalance extends React.Component {
<div id="wallet-widgets"> <div id="wallet-widgets">
<div className="col-xs-12"> <div className="col-xs-12">
<div className={ this.isActiveCoinMode('native') || (this.isActiveCoinMode('full') && !this.isFullySynced()) ? 'col-xs-12' : 'col-xs-12 hide' }> <div className={ this.isActiveCoinMode('native') || (this.isActiveCoinMode('full') && !this.isFullySynced()) ? 'col-xs-12' : 'col-xs-12 hide' }>
<div role="alert" className="alert alert-info alert-dismissible" id="edexcoin-wallet-waitingrt-alert"> <div className="alert alert-info alert-dismissible">
<button aria-label="Close" data-dismiss="alert" className="close" type="button"> <button className="close" type="button">
<span aria-hidden="true">×</span> <span>×</span>
</button> </button>
<h4>{ translate('INDEX.ACTIVATING_WALLET_RT') }</h4> <h4>{ translate('INDEX.ACTIVATING_WALLET_RT') }</h4>
<p id="edexcoin-wallet-waitingrt-alert-text">{ translate('INDEX.IGUANA_FULL_MODE_SYNC_P1') }</p> <p>{ translate('INDEX.IGUANA_FULL_MODE_SYNC_P1') }</p>
<p>{ translate('INDEX.IGUANA_FULL_MODE_SYNC_P2') }</p> <p>{ translate('INDEX.IGUANA_FULL_MODE_SYNC_P2') }</p>
<p className="font-weight-600">{ this.renderLB('INDEX.IGUANA_FULL_MODE_SYNC_P3') }</p> <p className="font-weight-600">{ this.renderLB('INDEX.IGUANA_FULL_MODE_SYNC_P3') }</p>
</div> </div>
<div role="alert" className="alert alert-info alert-dismissible" id="edexcoin-wallet-waitingcache-alert"> <div className="alert alert-info alert-dismissible">
<button aria-label="Close" data-dismiss="alert" className="close" type="button"> <button className="close" type="button">
<span aria-hidden="true">×</span> <span>×</span>
</button> </button>
<h4>{ translate('INDEX.FETCHING_COIN_DATA') }</h4> <h4>{ translate('INDEX.FETCHING_COIN_DATA') }</h4>
<p id="edexcoin-wallet-waitingcache-alert-text">{ translate('INDEX.IGUANA_FULL_MODE_SYNC_P1') }</p> <p>{ translate('INDEX.IGUANA_FULL_MODE_SYNC_P1') }</p>
<p>{ translate('INDEX.IGUANA_FULL_MODE_SYNC_P2') }</p> <p>{ translate('INDEX.IGUANA_FULL_MODE_SYNC_P2') }</p>
<p className="font-weight-600">{ this.renderLB('INDEX.IGUANA_FULL_MODE_SYNC_P3') }</p> <p className="font-weight-600">{ this.renderLB('INDEX.IGUANA_FULL_MODE_SYNC_P3') }</p>
</div> </div>
</div> </div>
<div
className={ this.isNativeOrBasiliskCoinMode() ? 'col-lg-4 col-xs-12' : 'col-lg-12 col-xs-12' } <div className={ this.isNativeOrBasiliskCoinMode() ? 'col-lg-4 col-xs-12' : 'col-lg-12 col-xs-12' }>
id="edexcoin_getbalance_t"> <div className="widget widget-shadow">
<div className="widget widget-shadow" id="widgetLineareaOne">
<div className="widget-content"> <div className="widget-content">
<div className="padding-20 padding-top-10"> <div className="padding-20 padding-top-10">
<div className="clearfix"> <div className="clearfix">
@ -137,10 +136,8 @@ class WalletsBalance extends React.Component {
</div> </div>
</div> </div>
<div <div className={ this.isNativeOrBasiliskCoinMode() ? 'col-lg-4 col-xs-12' : 'col-lg-4 col-xs-12 hide' }>
className={ this.isNativeOrBasiliskCoinMode() ? 'col-lg-4 col-xs-12' : 'col-lg-4 col-xs-12 hide' } <div className="widget widget-shadow">
id="edexcoin_getbalance_interest">
<div className="widget widget-shadow" id="widgetLineareaOne">
<div className="widget-content"> <div className="widget-content">
<div className="padding-20 padding-top-10"> <div className="padding-20 padding-top-10">
<div className="clearfix"> <div className="clearfix">
@ -156,10 +153,8 @@ class WalletsBalance extends React.Component {
</div> </div>
</div> </div>
<div <div className={ this.isNativeOrBasiliskCoinMode() ? 'col-lg-4 col-xs-12' : 'col-lg-4 col-xs-12 hide' }>
className={ this.isNativeOrBasiliskCoinMode() ? 'col-lg-4 col-xs-12' : 'col-lg-4 col-xs-12 hide' } <div className="widget widget-shadow">
id="edexcoin_getbalance_total_interest">
<div className="widget widget-shadow" id="widgetLineareaOne">
<div className="widget-content"> <div className="widget-content">
<div className="padding-20 padding-top-10"> <div className="padding-20 padding-top-10">
<div className="clearfix"> <div className="clearfix">

6
react/src/components/dashboard/walletsBasiliskConnection.js
View File

@ -28,15 +28,15 @@ class WalletsBasiliskConnection extends React.Component {
if (this.isBasiliskConnection()) { if (this.isBasiliskConnection()) {
return ( return (
<div onKeyDown={ (event) => this.handleKeydown(event) }> <div onKeyDown={ (event) => this.handleKeydown(event) }>
<div className="modal show" id="RefreshBasiliskConnectionsMdl" aria-hidden="false" role="dialog"> <div className="modal show" id="RefreshBasiliskConnectionsMdl">
<div className="modal-dialog modal-center modal-md"> <div className="modal-dialog modal-center modal-md">
<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">
<h4 className="modal-title white"> <h4 className="modal-title white">
<span className="icon fa-refresh no-margin"></span> { translate('INDEX.REFRESHING_BASILISK_NET') }... <span className="icon fa-refresh no-margin"></span> { translate('INDEX.REFRESHING_BASILISK_NET') }...
</h4> </h4>
<button type="button" className="close btn-close" aria-label="Close" onClick={ this.basiliskConnectionAction }> <button type="button" className="close btn-close" onClick={ this.basiliskConnectionAction }>
<span aria-hidden="true">&times;</span> <span>&times;</span>
<span className="sr-only">{ translate('INDEX.CLOSE') }</span> <span className="sr-only">{ translate('INDEX.CLOSE') }</span>
</button> </button>
</div> </div>

4
react/src/components/dashboard/walletsBasiliskRefresh.js
View File

@ -17,11 +17,11 @@ class WalletsBasiliskRefresh extends React.Component {
<div className="panel-heading"> <div className="panel-heading">
<h3 className="panel-title">{ translate('INDEX.FETCHING_BASILISK_DATA') }</h3> <h3 className="panel-title">{ translate('INDEX.FETCHING_BASILISK_DATA') }</h3>
<div className="panel-actions"> <div className="panel-actions">
<a className="panel-action icon md-refresh-alt" aria-hidden="true"></a> <a className="panel-action icon md-refresh-alt"></a>
</div> </div>
</div> </div>
<div className="table-responsive"> <div className="table-responsive">
<table className="table table-hover table-striped tbl_edexcoin_dashboard_basilisk_refresh_status"> <table className="table table-hover table-striped">
<thead> <thead>
<tr> <tr>
<th>{ translate('INDEX.ADDRESS') }</th> <th>{ translate('INDEX.ADDRESS') }</th>

9
react/src/components/dashboard/walletsCacheData.js
View File

@ -162,14 +162,14 @@ class WalletsCacheData extends React.Component {
return ( return (
<div> <div>
<div className="modal show" aria-hidden="false" role="dialog"> <div className="modal show">
<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-body modal-body-container"> <div className="modal-body modal-body-container">
<div className="panel nav-tabs-horizontal"> <div className="panel nav-tabs-horizontal">
<div className="panel-body"> <div className="panel-body">
<div className="tab-content"> <div className="tab-content">
<div className="tab-pane active" role="tabpanel"> <div className="tab-pane active">
{ this.renderNotariesFetching() } { this.renderNotariesFetching() }
<Tree defaultExpandAll={ false } openAnimation={ animation }> <Tree defaultExpandAll={ false } openAnimation={ animation }>
{ this.renderCoinRootNodes() } { this.renderCoinRootNodes() }
@ -180,7 +180,10 @@ class WalletsCacheData extends React.Component {
</div> </div>
</div> </div>
<div className="modal-footer"> <div className="modal-footer">
<button type="button" className="btn btn-default" onClick={ this.closeViewCacheModal }>{ translate('INDEX.CLOSE') }</button> <button
type="button"
className="btn btn-default"
onClick={ this.closeViewCacheModal }>{ translate('INDEX.CLOSE') }</button>
</div> </div>
</div> </div>
</div> </div>

120
react/src/components/dashboard/walletsData.js
View File

@ -253,8 +253,7 @@ class WalletsData extends React.Component {
key={ `${i}-pagination-link` } key={ `${i}-pagination-link` }
className={ this.state.activePage === i + 1 ? 'paginate_button active' : 'paginate_button' }> className={ this.state.activePage === i + 1 ? 'paginate_button active' : 'paginate_button' }>
<a <a
aria-controls="kmd-tx-history-tbl" key={ `${i}-pagination` }
tabIndex="0" key={ `${i}-pagination` }
onClick={ this.state.activePage !== (i + 1) ? () => this.updateCurrentPage(i + 1) : null }>{ i + 1 }</a> onClick={ this.state.activePage !== (i + 1) ? () => this.updateCurrentPage(i + 1) : null }>{ i + 1 }</a>
</li> </li>
); );
@ -268,12 +267,11 @@ class WalletsData extends React.Component {
this.state.itemsList !== 'loading' && this.state.itemsList !== 'loading' &&
this.props.ActiveCoin.txhistory.length > 10) { this.props.ActiveCoin.txhistory.length > 10) {
return ( return (
<div className="dataTables_length" id="kmd-tx-history-tbl_length"> <div className="dataTables_length">
<label> <label>
{ translate('INDEX.SHOW') }&nbsp; { translate('INDEX.SHOW') }&nbsp;
<select <select
name="itemsPerPage" name="itemsPerPage"
aria-controls="kmd-tx-history-tbl"
className="form-control input-sm" className="form-control input-sm"
onChange={ this.updateInput }> onChange={ this.updateInput }>
<option value="10">10</option> <option value="10">10</option>
@ -300,31 +298,17 @@ class WalletsData extends React.Component {
return ( return (
<div className="row unselectable"> <div className="row unselectable">
<div className="col-sm-5"> <div className="col-sm-5">
<div <div className="dataTables_info">{ translate('INDEX.SHOWING') } { _paginationFrom } { translate('INDEX.TO_ALT') } { _paginationTo } { translate('INDEX.OF') } { this.props.ActiveCoin.txhistory.length } { translate('INDEX.ENTRIES_SM') }</div>
className="dataTables_info"
id="kmd-tx-history-tbl_info"
role="status"
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">
<ul className="pagination"> <ul className="pagination">
<li <li className={ this.state.activePage === 1 ? 'paginate_button previous disabled' : 'paginate_button previous' }>
className={ this.state.activePage === 1 ? 'paginate_button previous disabled' : 'paginate_button previous' } <a onClick={ () => this.updateCurrentPage(this.state.activePage - 1) }>{ translate('INDEX.PREVIOUS') }</a>
id="kmd-tx-history-tbl_previous">
<a
aria-controls="kmd-tx-history-tbl"
tabIndex="0"
onClick={ () => this.updateCurrentPage(this.state.activePage - 1) }>{ translate('INDEX.PREVIOUS') }</a>
</li> </li>
{ this.renderPaginationItems() } { this.renderPaginationItems() }
<li <li className={ this.state.activePage > Math.floor(this.props.ActiveCoin.txhistory.length / this.state.itemsPerPage) ? 'paginate_button next disabled' : 'paginate_button next' }>
className={ this.state.activePage > Math.floor(this.props.ActiveCoin.txhistory.length / this.state.itemsPerPage) ? 'paginate_button next disabled' : 'paginate_button next' } <a onClick={ () => this.updateCurrentPage(this.state.activePage + 1) }>{ translate('INDEX.NEXT') }</a>
id="kmd-tx-history-tbl_next">
<a
aria-controls="kmd-tx-history-tbl"
tabIndex="0"
onClick={ () => this.updateCurrentPage(this.state.activePage + 1) }>{ translate('INDEX.NEXT') }</a>
</li> </li>
</ul> </ul>
</div> </div>
@ -420,10 +404,10 @@ class WalletsData extends React.Component {
})); }));
if (this.props.ActiveCoin.mode === 'basilisk') { if (this.props.ActiveCoin.mode === 'basilisk') {
setTimeout(function() { setTimeout(() => {
Store.dispatch(changeMainBasiliskAddress(address)); Store.dispatch(changeMainBasiliskAddress(address));
Store.dispatch(getBasiliskTransactionsList(this.props.ActiveCoin.coin, address)); Store.dispatch(getBasiliskTransactionsList(this.props.ActiveCoin.coin, address));
}.bind(this), 100); }, 100);
Store.dispatch(fetchNewCacheData({ Store.dispatch(fetchNewCacheData({
'pubkey': this.props.Dashboard.activeHandle.pubkey, 'pubkey': this.props.Dashboard.activeHandle.pubkey,
@ -496,9 +480,7 @@ class WalletsData extends React.Component {
items.push( items.push(
<li key={address.address}> <li key={address.address}>
<a <a onClick={ () => this.updateAddressSelection(address.address, type, _amount) }><i className={ type === 'public' ? 'icon fa-eye' : 'icon fa-eye-slash' }></i> <span className="text">[ { _amount } { this.props.ActiveCoin.coin } ]  { address.address }</span><span className="glyphicon glyphicon-ok check-mark"></span></a>
tabIndex="0"
onClick={ () => this.updateAddressSelection(address.address, type, _amount) }><i className={ type === 'public' ? 'icon fa-eye' : 'icon fa-eye-slash' }></i> <span className="text">[ { _amount } { this.props.ActiveCoin.coin } ]  { address.address }</span><span className="glyphicon glyphicon-ok check-mark"></span></a>
</li> </li>
); );
} }
@ -559,7 +541,6 @@ class WalletsData extends React.Component {
type="button" type="button"
className="btn dropdown-toggle btn-info" className="btn dropdown-toggle btn-info"
title={ `-${translate('KMD_NATIVE.SELECT_ADDRESS')}-` } title={ `-${translate('KMD_NATIVE.SELECT_ADDRESS')}-` }
aria-expanded="true"
onClick={ this.openDropMenu }> onClick={ this.openDropMenu }>
<span className="filter-option pull-left">{ this.renderSelectorCurrentLabel() } </span>&nbsp; <span className="filter-option pull-left">{ this.renderSelectorCurrentLabel() } </span>&nbsp;
<span className="bs-caret"> <span className="bs-caret">
@ -567,9 +548,9 @@ class WalletsData extends React.Component {
</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">
<li data-original-index="1" className="selected"> <li className="selected">
<a tabIndex="0"><span className="text"> - { translate('KMD_NATIVE.SELECT_ADDRESS') } - </span><span className="glyphicon glyphicon-ok check-mark"></span></a> <a><span className="text"> - { translate('KMD_NATIVE.SELECT_ADDRESS') } - </span><span className="glyphicon glyphicon-ok check-mark"></span></a>
</li> </li>
{ this.renderAddressByType('public') } { this.renderAddressByType('public') }
</ul> </ul>
@ -597,83 +578,66 @@ class WalletsData extends React.Component {
<div id="edexcoin_dashboardinfo"> <div id="edexcoin_dashboardinfo">
<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 id="edexcoin_dashoard_section"> <div>
<div className="col-xlg-12 col-lg-12 col-sm-12 col-xs-12 edexcoin_dashoard_section_main_div"> <div className="col-xlg-12 col-lg-12 col-sm-12 col-xs-12">
<div id="edexcoin_txhistory" className="panel"> <div className="panel">
<header className="panel-heading z-index-10"> <header className="panel-heading z-index-10">
<div className={ this.props.ActiveCoin.mode === 'basilisk' ? 'panel-actions' : 'panel-actions hide' }> <div className={ this.props.ActiveCoin.mode === 'basilisk' ? 'panel-actions' : 'panel-actions hide' }>
<div <div className={'full-width margin-bottom-3 ' + (this.state.currentStackLength === 1 || (this.state.currentStackLength === 0 && this.state.totalStackLength === 0) ? 'hide' : 'progress progress-sm') }>
className={'full-width margin-bottom-3 ' + (this.state.currentStackLength === 1 || (this.state.currentStackLength === 0 && this.state.totalStackLength === 0) ? 'hide' : 'progress progress-sm') }>
<div <div
className="progress-bar progress-bar-striped active progress-bar-indicating progress-bar-success font-size-80-percent" className="progress-bar progress-bar-striped active progress-bar-indicating progress-bar-success font-size-80-percent"
style={{ width: 100 - (this.state.currentStackLength * 100 / this.state.totalStackLength) + '%'}} style={{ width: 100 - (this.state.currentStackLength * 100 / this.state.totalStackLength) + '%'}}>
role="progressbar">
{ translate('SEND.PROCESSING_REQ') }: { this.state.currentStackLength } / { this.state.totalStackLength } { translate('SEND.PROCESSING_REQ') }: { this.state.currentStackLength } / { this.state.totalStackLength }
</div> </div>
</div> </div>
<div <div
className={ this.state.basiliskActionsMenu ? 'dropdown open' : 'dropdown' } className={ this.state.basiliskActionsMenu ? 'dropdown open' : 'dropdown' }
onClick={ this.toggleBasiliskActionsMenu }> onClick={ this.toggleBasiliskActionsMenu }>
<a <a className="dropdown-toggle btn-xs btn-default">
className="dropdown-toggle btn-xs btn-default" <i className="icon fa-magic margin-right-10"></i> { translate('INDEX.BASILISK_ACTIONS') } <span className="caret"></span>
id="btn_edexcoin_basilisk"
href="javascript:void(0)"
aria-expanded="false"
role="button">
<i className="icon fa-magic margin-right-10" aria-hidden="true"></i> { translate('INDEX.BASILISK_ACTIONS') } <span className="caret"></span>
</a> </a>
<ul className="dropdown-menu dropdown-menu-right" aria-labelledby="btn_edexcoin_basilisk" role="menu"> <ul className="dropdown-menu dropdown-menu-right">
<li role="presentation"> <li>
<a <a
className="btn_edexcoin_dashboard_getnotaries" className="btn_edexcoin_dashboard_getnotaries"
id="btn_edexcoin_dashboard_getnotaries"
role="menuitem"
onClick={ this.getDexNotariesAction }> onClick={ this.getDexNotariesAction }>
<i className="icon fa-sitemap" aria-hidden="true"></i> { translate('INDEX.GET_NOTARY_NODES_LIST') } <i className="icon fa-sitemap"></i> { translate('INDEX.GET_NOTARY_NODES_LIST') }
</a> </a>
</li> </li>
<li role="presentation"> <li>
<a <a
className="btn_edexcoin_dashboard_refresh_basilisk_conn" className="btn_edexcoin_dashboard_refresh_basilisk_conn"
id="btn_edexcoin_dashboard_refresh_basilisk_conn"
role="menuitem"
onClick={ this.basiliskConnectionAction }> onClick={ this.basiliskConnectionAction }>
<i className="icon wb-refresh" aria-hidden="true"></i> { translate('INDEX.REFRESH_BASILISK_CONNECTIONS') } <i className="icon wb-refresh"></i> { translate('INDEX.REFRESH_BASILISK_CONNECTIONS') }
</a> </a>
</li> </li>
<li role="presentation" className={ !this.state.useCache ? 'hide' : '' }> <li className={ !this.state.useCache ? 'hide' : '' }>
<a <a
className="btn_edexcoin_dashboard_fetchdata" className="btn_edexcoin_dashboard_fetchdata"
id="btn_edexcoin_dashboard_fetchdata"
role="menuitem"
onClick={ this.basiliskRefreshActionOne }> onClick={ this.basiliskRefreshActionOne }>
<i className="icon fa-cloud-download" aria-hidden="true"></i> { translate('INDEX.FETCH_WALLET_DATA') } ({ translate('INDEX.ACTIVE_ADDRESS') }) <i className="icon fa-cloud-download"></i> { translate('INDEX.FETCH_WALLET_DATA') } ({ translate('INDEX.ACTIVE_ADDRESS') })
</a> </a>
</li> </li>
<li <li className={ !this.state.useCache || this.props.ActiveCoin.addresses && this.props.ActiveCoin.addresses.public.length === 1 ? 'hide' : '' }>
role="presentation" <a onClick={ this.basiliskRefreshAction }>
className={ !this.state.useCache || this.props.ActiveCoin.addresses && this.props.ActiveCoin.addresses.public.length === 1 ? 'hide' : '' }> <i className="icon fa-cloud-download"></i> { translate('INDEX.FETCH_ALL_ADDR') }
<a role="menuitem" onClick={ this.basiliskRefreshAction }>
<i className="icon fa-cloud-download" aria-hidden="true"></i> { translate('INDEX.FETCH_ALL_ADDR') }
</a> </a>
</li> </li>
<li role="presentation" className={ !this.state.useCache ? 'hide' : '' }> <li className={ !this.state.useCache ? 'hide' : '' }>
<a <a
className="btn_edexcoin_dashboard_refetchdata" className="btn_edexcoin_dashboard_refetchdata"
id="btn_edexcoin_dashboard_refetchdata"
role="menuitem"
onClick={ this.removeAndFetchNewCache }> onClick={ this.removeAndFetchNewCache }>
<i className="icon fa-history" aria-hidden="true"></i> { translate('INDEX.REFETCH_WALLET_DATA') } <i className="icon fa-history"></i> { translate('INDEX.REFETCH_WALLET_DATA') }
</a> </a>
</li> </li>
<li role="presentation" className={'display-none ' + (!this.state.useCache ? 'hide' : '') }> <li className={ 'display-none ' + (!this.state.useCache ? 'hide' : '') }>
<a role="menuitem" onClick={ this.restartBasiliskInstance }> <a onClick={ this.restartBasiliskInstance }>
<i className="icon fa-refresh" aria-hidden="true"></i> Restart Basilisk Instance (unsafe!) <i className="icon fa-refresh"></i> Restart Basilisk Instance (unsafe!)
</a> </a>
</li> </li>
<li role="presentation" className={ !this.state.useCache ? 'hide' : '' }> <li className={ !this.state.useCache ? 'hide' : '' }>
<a className="btn_edexcoin_dashboard_fetchdata" role="menuitem" onClick={ this._toggleViewCacheModal }> <a className="btn_edexcoin_dashboard_fetchdata" onClick={ this._toggleViewCacheModal }>
<i className="icon fa-list-alt" aria-hidden="true"></i> { translate('INDEX.VIEW_CACHE_DATA') } <i className="icon fa-list-alt"></i> { translate('INDEX.VIEW_CACHE_DATA') }
</a> </a>
</li> </li>
</ul> </ul>
@ -693,15 +657,15 @@ class WalletsData extends React.Component {
{ this.renderPaginationItemsPerPageSelector() } { this.renderPaginationItemsPerPageSelector() }
</div> </div>
<div className="col-sm-6"> <div className="col-sm-6">
<div id="kmd-tx-history-tbl_filter" className="dataTables_filter"> <div className="dataTables_filter">
<label> <label>
{ translate('INDEX.SEARCH') }: <input type="search" className="form-control input-sm" aria-controls="kmd-tx-history-tbl" disabled="true" /> { translate('INDEX.SEARCH') }: <input type="search" className="form-control input-sm" disabled="true" />
</label> </label>
</div> </div>
</div> </div>
</div> </div>
<div className="row"> <div className="row">
<table className="table table-hover dataTable table-striped" id="edex-tx-history-tbl" width="100%"> <table className="table table-hover dataTable table-striped" width="100%">
<thead> <thead>
<tr> <tr>
<th>{ translate('INDEX.DIRECTION') }</th> <th>{ translate('INDEX.DIRECTION') }</th>

144
react/src/components/dashboard/walletsHeader.js
View File

@ -29,39 +29,22 @@ class WalletsHeader extends React.Component {
<div id="kmd_header_button"> <div id="kmd_header_button">
<button <button
type="button" type="button"
id="easydex_kmd_wallet_actions_header" className="bg-teal-500 btn btn-floating white waves-effect waves-float waves-light">
className="bg-teal-500 btn btn-floating white waves-effect waves-float waves-light" <i className="icon md-plus"></i>
aria-expanded="false">
<i className="icon md-plus" aria-hidden="true"></i>
</button> </button>
<ul <ul className="dropdown-menu animate dropdown-menu-right">
className="dropdown-menu animate dropdown-menu-right" <li>
aria-labelledby="easydex_kmd_wallet_actions_header" <a>{ translate('INDEX.DASHBOARD') }</a>
role="menu">
<li role="presentation">
<a
href="javascript:void(0)"
role="menuitem"
id="btn_kmd_wallet_dashboard">{ translate('INDEX.DASHBOARD') }</a>
</li> </li>
<li role="presentation"> <li>
<a <a>{ translate('INDEX.SEND') }</a>
href="javascript:void(0)"
role="menuitem"
id="btn_kmd_wallet_send">{ translate('INDEX.SEND') }</a>
</li> </li>
<li role="presentation"> <li>
<a <a>{ translate('INDEX.RECEIVE') }</a>
href="javascript:void(0)"
role="menuitem"
id="btn_kmd_wallet_recieve">{ translate('INDEX.RECEIVE') }</a>
</li> </li>
<li className="divider" role="presentation"></li> <li className="divider"></li>
<li role="presentation"> <li>
<a <a>{ translate('INDEX.SETTINGS') }</a>
href="javascript:void(0)"
role="menuitem"
id="btn_kmd_wallet_settings">{ translate('INDEX.SETTINGS') }</a>
</li> </li>
</ul> </ul>
</div> </div>
@ -69,43 +52,22 @@ class WalletsHeader extends React.Component {
<div id="zec_header_button" className="display-none"> <div id="zec_header_button" className="display-none">
<button <button
type="button" type="button"
id="easydex_zec_wallet_actions_header" className="bg-yellow-600 btn btn-floating white waves-effect waves-float waves-light">
className="bg-yellow-600 btn btn-floating white waves-effect waves-float waves-light" <i className="icon md-plus"></i>
aria-expanded="false">
<i className="icon md-plus" aria-hidden="true"></i>
</button> </button>
<ul <ul className="dropdown-menu animate dropdown-menu-right">
className="dropdown-menu animate dropdown-menu-right" <li>
aria-labelledby="easydex_zec_wallet_actions_header" <a>{ translate('INDEX.DASHBOARD') }</a>
role="menu">
<li role="presentation">
<a
href="javascript:void(0)"
role="menuitem"
data-extcoin-menu="ZEC"
id="btn_zec_wallet_dashboard">{ translate('INDEX.DASHBOARD') }</a>
</li> </li>
<li role="presentation"> <li>
<a <a>{ translate('INDEX.SEND') }</a>
href="javascript:void(0)"
role="menuitem"
data-extcoin-menu="ZEC"
id="btn_zec_wallet_send">{ translate('INDEX.SEND') }</a>
</li> </li>
<li role="presentation"> <li>
<a <a>{ translate('INDEX.RECEIVE') }</a>
href="javascript:void(0)"
role="menuitem"
data-extcoin-menu="ZEC"
id="btn_zec_wallet_recieve">{ translate('INDEX.RECEIVE') }</a>
</li> </li>
<li className="divider" role="presentation"></li> <li className="divider"></li>
<li role="presentation"> <li>
<a <a>{ translate('INDEX.SETTINGS') }</a>
href="javascript:void(0)"
role="menuitem"
data-extcoin-menu="ZEC"
id="btn_zec_wallet_settings">{ translate('INDEX.SETTINGS') }</a>
</li> </li>
</ul> </ul>
</div> </div>
@ -113,67 +75,45 @@ class WalletsHeader extends React.Component {
<div id="kmd_header_button"> <div id="kmd_header_button">
<button <button
type="button" type="button"
id="jumblr_actions_header"
className="btn white waves-effect waves-light"> className="btn white waves-effect waves-light">
<i className="icon fa-refresh" aria-hidden="true"></i>{ translate('INDEX.REFRESH') } <i className="icon fa-refresh"></i>{ translate('INDEX.REFRESH') }
</button> </button>
</div> </div>
<div id="kmd_header_button" className="display-none"> <div id="kmd_header_button" className="display-none">
<button <button
type="button" type="button"
id="easydex_acpax_wallet_actions_header" className="bg-teal-500 btn btn-floating white waves-effect waves-float waves-light">
className="bg-teal-500 btn btn-floating white waves-effect waves-float waves-light" <i className="icon md-plus"></i>
aria-expanded="false">
<i className="icon md-plus" aria-hidden="true"></i>
</button> </button>
<ul <ul className="dropdown-menu animate dropdown-menu-right">
className="dropdown-menu animate dropdown-menu-right" <li>
aria-labelledby="easydex_acpax_wallet_actions_header" <a>{ translate('INDEX.DASHBOARD') }</a>
role="menu">
<li role="presentation">
<a
href="javascript:void(0)"
role="menuitem"
data-extcoin-menu="KMD"
id="btn_acpax_wallet_dashboard">{ translate('INDEX.DASHBOARD') }</a>
</li> </li>
<li role="presentation"> <li>
<a <a>{ translate('INDEX.SEND') }</a>
href="javascript:void(0)"
role="menuitem"
data-extcoin-menu="KMD"
id="btn_acpax_wallet_send">{ translate('INDEX.SEND') }</a>
</li> </li>
<li role="presentation"> <li>
<a <a>{ translate('INDEX.RECEIVE') }</a>
href="javascript:void(0)"
role="menuitem"
data-extcoin-menu="KMD"
id="btn_acpax_wallet_recieve">{ translate('INDEX.RECEIVE') }</a>
</li> </li>
<li className="divider" role="presentation"></li> <li className="divider"></li>
<li role="presentation"> <li>
<a <a>{ translate('INDEX.SETTINGS') }</a>
href="javascript:void(0)"
role="menuitem"
data-extcoin-menu="KMD"
id="btn_acpax_wallet_settings">{ translate('INDEX.SETTINGS') }</a>
</li> </li>
</ul> </ul>
</div> </div>
<div className="row no-space width-350 hidden-xs" id="easydex_btc_btcd_balances_header display-none"> <div className="row no-space width-350 hidden-xs display-none">
<div className="col-xs-6"> <div className="col-xs-6">
<div className="counter"> <div className="counter">
<span className="font-weight-medium" id="header_coinname_balance"> - BTC</span> <span className="font-weight-medium"> - BTC</span>
<span className="counter-label small" id="header_coinfiatbalance"> - USD</span> <span className="counter-label small"> - USD</span>
</div> </div>
</div> </div>
<div className="col-xs-6"> <div className="col-xs-6">
<div className="counter"> <div className="counter">
<span className="font-weight-medium" id="header_coinname_balance"> - BTCD</span> <span className="font-weight-medium"> - BTCD</span>
<span className="counter-label small" id="header_coinfiatbalance"> - USD</span> <span className="counter-label small"> - USD</span>
</div> </div>
</div> </div>
</div> </div>

4
react/src/components/dashboard/walletsNative.js
View File

@ -32,7 +32,7 @@ class WalletsNative extends React.Component {
if (this.isActiveCoinModeNative()) { if (this.isActiveCoinModeNative()) {
return ( return (
<div className="page margin-left-0"> <div className="page margin-left-0">
<div id="section-extcoin" className="padding-top-0"> <div className="padding-top-0">
<div id="easydex-header-div" className="background-color-white" style={{ 'backgroundImage': `url("assets/images/bg/${this.defaultBG()}_transparent_header_bg.png")` }}> <div id="easydex-header-div" className="background-color-white" style={{ 'backgroundImage': `url("assets/images/bg/${this.defaultBG()}_transparent_header_bg.png")` }}>
<ol className="breadcrumb"> <ol className="breadcrumb">
<li className="header-easydex-section"> <li className="header-easydex-section">
@ -42,7 +42,7 @@ class WalletsNative extends React.Component {
</div> </div>
<div className="page-content"> <div className="page-content">
<WalletsNativeSyncProgress {...this.props} /> <WalletsNativeSyncProgress {...this.props} />
<div className="row" id="extcoin-wallet"> <div className="row">
<WalletsNativeBalance {...this.props} /> <WalletsNativeBalance {...this.props} />
<WalletsNativeTxHistory {...this.props} /> <WalletsNativeTxHistory {...this.props} />
<WalletsNativeReceive {...this.props} /> <WalletsNativeReceive {...this.props} />

8
react/src/components/dashboard/walletsNativeAlert.js
View File

@ -11,12 +11,12 @@ class WalletsNativeAlert extends React.Component {
render() { render() {
if (this.hasNoProgress()) { if (this.hasNoProgress()) {
return ( return (
<div role="alert" className="alert alert-danger alert-dismissible" id="extcoin-wallet-connection-alert"> <div className="alert alert-danger alert-dismissible">
<button aria-label="Close" data-dismiss="alert" className="close" type="button"> <button className="close" type="button">
<span aria-hidden="true">×</span> <span>×</span>
</button> </button>
<h4>{ translate('INDEX.OOPS_ERROR') }</h4> <h4>{ translate('INDEX.OOPS_ERROR') }</h4>
<p id="extcoin-wallet-connection-alert-text"> <p>
<span>{ translate('INDEX.OOPS_ERROR_DESC') }</span> <span>{ translate('INDEX.OOPS_ERROR_DESC') }</span>
<code>server=1</code><br/> <code>server=1</code><br/>
<code>rpcport=</code><br/> <code>rpcport=</code><br/>

32
react/src/components/dashboard/walletsNativeBalance.js
View File

@ -7,68 +7,60 @@ class WalletsNativeBalance extends React.Component {
this.props.ActiveCoin.nativeActiveSection === 'default') { this.props.ActiveCoin.nativeActiveSection === 'default') {
return ( return (
<div className="col-xs-12"> <div className="col-xs-12">
<div className="col-lg-3 col-xs-12" id="kmd_widget_get_total_balance_t"> <div className="col-lg-3 col-xs-12">
<div className="widget widget-shadow" id="widgetLineareaOne"> <div className="widget widget-shadow">
<div className="widget-content white bg-yellow-800"> <div className="widget-content white bg-yellow-800">
<div className="padding-20 padding-top-10"> <div className="padding-20 padding-top-10">
<div className="clearfix"> <div className="clearfix">
<div className="pull-left padding-vertical-10"> <div className="pull-left padding-vertical-10">
<i className="icon fa-eye font-size-24 vertical-align-bottom margin-right-5"></i>{ translate('INDEX.TRANSPARENT_BALANCE') } <i className="icon fa-eye font-size-24 vertical-align-bottom margin-right-5"></i>{ translate('INDEX.TRANSPARENT_BALANCE') }
</div> </div>
<span <span className="pull-right padding-top-10 font-size-22">{ this.props.ActiveCoin.balance.transparent ? this.props.ActiveCoin.balance.transparent : '-' }</span>
className="pull-right padding-top-10 font-size-22"
id="kmd_transparent_balance">{ this.props.ActiveCoin.balance.transparent ? this.props.ActiveCoin.balance.transparent : '-' }</span>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div className="col-lg-3 col-xs-12" id="kmd_widget_get_total_balance_z"> <div className="col-lg-3 col-xs-12">
<div className="widget widget-shadow" id="widgetLineareaOne"> <div className="widget widget-shadow">
<div className="widget-content white bg-blue-grey-800"> <div className="widget-content white bg-blue-grey-800">
<div className="padding-20 padding-top-10"> <div className="padding-20 padding-top-10">
<div className="clearfix"> <div className="clearfix">
<div className="pull-left padding-vertical-10"> <div className="pull-left padding-vertical-10">
<i className="icon fa-eye-slash font-size-24 vertical-align-bottom margin-right-5"></i>{ translate('INDEX.Z_BALANCE') } <i className="icon fa-eye-slash font-size-24 vertical-align-bottom margin-right-5"></i>{ translate('INDEX.Z_BALANCE') }
</div> </div>
<span <span className="pull-right padding-top-10 font-size-22">{ this.props.ActiveCoin.balance.private ? this.props.ActiveCoin.balance.private : '-' }</span>
className="pull-right padding-top-10 font-size-22"
id="kmd_private_balance">{ this.props.ActiveCoin.balance.private ? this.props.ActiveCoin.balance.private : '-' }</span>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div className="col-lg-3 col-xs-12" id="kmd_widget_get_total_balance_i"> <div className="col-lg-3 col-xs-12">
<div className="widget widget-shadow" id="widgetLineareaOne"> <div className="widget widget-shadow">
<div className="widget-content white bg-cyan-700"> <div className="widget-content white bg-cyan-700">
<div className="padding-20 padding-top-10"> <div className="padding-20 padding-top-10">
<div className="clearfix"> <div className="clearfix">
<div className="pull-left padding-vertical-10"> <div className="pull-left padding-vertical-10">
<i className="icon fa-money font-size-24 vertical-align-bottom margin-right-5"></i>{ translate('INDEX.INTEREST_EARNED') } <i className="icon fa-money font-size-24 vertical-align-bottom margin-right-5"></i>{ translate('INDEX.INTEREST_EARNED') }
</div> </div>
<span <span className="pull-right padding-top-10 font-size-22">{ this.props.ActiveCoin.balance.interest ? this.props.ActiveCoin.balance.interest : '-' }</span>
className="pull-right padding-top-10 font-size-22"
id="kmd_total_interest_balance">{ this.props.ActiveCoin.balance.interest ? this.props.ActiveCoin.balance.interest : '-' }</span>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div className="col-lg-3 col-xs-12" id="kmd_widget_get_total_balance_tzi"> <div className="col-lg-3 col-xs-12">
<div className="widget widget-shadow" id="widgetLineareaOne"> <div className="widget widget-shadow">
<div className="widget-content white bg-green-600"> <div className="widget-content white bg-green-600">
<div className="padding-20 padding-top-10"> <div className="padding-20 padding-top-10">
<div className="clearfix"> <div className="clearfix">
<div className="pull-left padding-vertical-10"> <div className="pull-left padding-vertical-10">
<i className="icon fa-bullseye font-size-24 vertical-align-bottom margin-right-5"></i>{ translate('INDEX.ZT_BALANCE') } <i className="icon fa-bullseye font-size-24 vertical-align-bottom margin-right-5"></i>{ translate('INDEX.ZT_BALANCE') }
</div> </div>
<span <span className="pull-right padding-top-10 font-size-22">{ this.props.ActiveCoin.balance.total ? this.props.ActiveCoin.balance.total : '-' }</span>
className="pull-right padding-top-10 font-size-22"
id="kmd_total_tz_balance">{ this.props.ActiveCoin.balance.total ? this.props.ActiveCoin.balance.total : '-' }</span>
</div> </div>
</div> </div>
</div> </div>

22
react/src/components/dashboard/walletsNativeInfo.js
View File

@ -12,9 +12,9 @@ class WalletsNativeInfo extends React.Component {
this.props.Dashboard.progress && this.props.Dashboard.progress &&
this.props.ActiveCoin.nativeActiveSection === 'settings') { this.props.ActiveCoin.nativeActiveSection === 'settings') {
return ( return (
<div id="kmd_wallet_settings"> <div>
<div className="col-xlg-6 col-md-4"> <div className="col-xlg-6 col-md-4">
<div className="panel" id="projects"> <div className="panel">
<div className="panel-heading"> <div className="panel-heading">
<h3 className="panel-title">{ translate('INDEX.WALLET_INFO') }</h3> <h3 className="panel-title">{ translate('INDEX.WALLET_INFO') }</h3>
</div> </div>
@ -35,21 +35,15 @@ class WalletsNativeInfo extends React.Component {
</tr> </tr>
<tr> <tr>
<td>{ translate('INDEX.UNCONFIRMED_BALANCE') }</td> <td>{ translate('INDEX.UNCONFIRMED_BALANCE') }</td>
<td> <td></td>
<span id="kmd_unconfirmed_balance"></span>
</td>
</tr> </tr>
<tr> <tr>
<td>{ translate('INDEX.IMMATURE_BALANCE') }</td> <td>{ translate('INDEX.IMMATURE_BALANCE') }</td>
<td> <td></td>
<span id="kmd_immature_balance"></span>
</td>
</tr> </tr>
<tr> <tr>
<td>{ translate('INDEX.TOTAL_TX_COUNT') }</td> <td>{ translate('INDEX.TOTAL_TX_COUNT') }</td>
<td> <td></td>
<span id="KMDTotalTransactionsCount"></span>
</td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
@ -58,7 +52,7 @@ class WalletsNativeInfo extends React.Component {
</div> </div>
<div className="col-xlg-6 col-md-8"> <div className="col-xlg-6 col-md-8">
<div className="panel" id="projects"> <div className="panel">
<div className="panel-heading"> <div className="panel-heading">
<h3 className="panel-title"> <h3 className="panel-title">
Komodo { translate('INDEX.INFO') } Komodo { translate('INDEX.INFO') }
@ -102,9 +96,7 @@ class WalletsNativeInfo extends React.Component {
<td> <td>
{ translate('INDEX.NOTARIZED') } BTC { translate('INDEX.NOTARIZED') } BTC
</td> </td>
<td> <td></td>
<span id="kmd_notarizedbtc"></span>
</td>
</tr> </tr>
<tr> <tr>
<td>{ translate('INDEX.BLOCKS') }</td> <td>{ translate('INDEX.BLOCKS') }</td>

42
react/src/components/dashboard/walletsNativeReceive.js
View File

@ -55,8 +55,7 @@ class WalletsNativeReceive extends React.Component {
</span> </span>
<button <button
className="btn btn-default btn-xs clipboard-edexaddr margin-left-10" className="btn btn-default btn-xs clipboard-edexaddr margin-left-10"
id="edexcoin_active_addr_clipboard" onClick={ () => this.copyZAddress(address.address) }><i className="icon wb-copy"></i> { translate('INDEX.COPY') }</button>
onClick={ () => this.copyZAddress(address.address) }><i className="icon wb-copy" aria-hidden="true"></i> { translate('INDEX.COPY') }</button>
</td> </td>
<td>{ type === 'public' ? address.address : address.address.substring(0, 34) + '...' }</td> <td>{ type === 'public' ? address.address : address.address.substring(0, 34) + '...' }</td>
<td>{ address.amount }</td> <td>{ address.amount }</td>
@ -77,43 +76,28 @@ class WalletsNativeReceive extends React.Component {
this.props.ActiveCoin && this.props.ActiveCoin &&
this.props.ActiveCoin.nativeActiveSection === 'receive') { this.props.ActiveCoin.nativeActiveSection === 'receive') {
return ( return (
<div id="kmd_wallet_recieve"> <div>
<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 id="kmd_wallet_recieve_section"> <div>
<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">
<div className="panel-actions"> <div className="panel-actions">
<div className={ 'dropdown' + (this.state.openDropMenu ? ' open' : '') } onClick={ this.openDropMenu }> <div className={ 'dropdown' + (this.state.openDropMenu ? ' open' : '') } onClick={ this.openDropMenu }>
<a <a className="dropdown-toggle white btn btn-warning">
className="dropdown-toggle white btn btn-warning" <i className="icon md-arrows margin-right-10"></i> { translate('INDEX.GET_NEW_ADDRESS') } <span className="caret"></span>
id="GetNewRecievingAddress"
href="javascript:void(0)"
aria-expanded="false"
role="button">
<i className="icon md-arrows margin-right-10" aria-hidden="true"></i> { translate('INDEX.GET_NEW_ADDRESS') } <span className="caret"></span>
</a> </a>
<ul <ul
className="dropdown-menu dropdown-menu-right" className="dropdown-menu dropdown-menu-right">
aria-labelledby="GetNewRecievingAddress" <li>
role="menu"> <a onClick={ () => this.getNewAddress('public') }>
<li role="presentation"> <i className="icon fa-eye"></i> { translate('INDEX.TRANSPARENT_ADDRESS') }
<a
href="javascript:void(0)"
id="kmd_get_new_taddr"
role="menuitem"
onClick={ () => this.getNewAddress('public') }>
<i className="icon fa-eye" aria-hidden="true"></i> { translate('INDEX.TRANSPARENT_ADDRESS') }
</a> </a>
</li> </li>
<li data-extcoin="COIN" role="presentation"> <li>
<a <a onClick={ () => this.getNewAddress('private') }>
href="javascript:void(0)" <i className="icon fa-eye-slash"></i> { translate('INDEX.PRIVATE_Z_ADDRESS') }
id="kmd_get_new_zaddr"
role="menuitem"
onClick={ () => this.getNewAddress('private') }>
<i className="icon fa-eye-slash" aria-hidden="true"></i> { translate('INDEX.PRIVATE_Z_ADDRESS') }
</a> </a>
</li> </li>
</ul> </ul>
@ -122,7 +106,7 @@ class WalletsNativeReceive extends React.Component {
<h3 className="panel-title">{ translate('INDEX.RECEIVING_ADDRESS') }</h3> <h3 className="panel-title">{ translate('INDEX.RECEIVING_ADDRESS') }</h3>
</header> </header>
<div className="panel-body"> <div className="panel-body">
<table className="table table-hover dataTable table-striped" id="kmd-recieve-addr-tbl"> <table className="table table-hover dataTable table-striped">
<thead> <thead>
<tr> <tr>
<th>{ translate('INDEX.TYPE') }</th> <th>{ translate('INDEX.TYPE') }</th>

43
react/src/components/dashboard/walletsNativeSend.js
View File

@ -53,10 +53,8 @@ class WalletsNativeSend extends React.Component {
this.props.ActiveCoin.addresses[type] && this.props.ActiveCoin.addresses[type] &&
this.props.ActiveCoin.addresses[type].length) { this.props.ActiveCoin.addresses[type].length) {
return this.props.ActiveCoin.addresses[type].map((address) => return this.props.ActiveCoin.addresses[type].map((address) =>
<li data-original-index="2" key={ address.address } className={ address.amount <= 0 ? 'hide' : '' }> <li key={ address.address } className={ address.amount <= 0 ? 'hide' : '' }>
<a <a onClick={ () => this.updateAddressSelection(address.address, type, address.amount) }><i className={ type === 'public' ? 'icon fa-eye' : 'icon fa-eye-slash' }></i> <span className="text">[ { address.amount } { this.props.ActiveCoin.coin } ]  { address.address }</span><span className="glyphicon glyphicon-ok check-mark"></span></a>
tabIndex="0"
onClick={ () => this.updateAddressSelection(address.address, type, address.amount) }><i className={ type === 'public' ? 'icon fa-eye' : 'icon fa-eye-slash' }></i> <span className="text">[ { address.amount } { this.props.ActiveCoin.coin } ]  { address.address }</span><span className="glyphicon glyphicon-ok check-mark"></span></a>
</li> </li>
); );
} else { } else {
@ -85,7 +83,6 @@ class WalletsNativeSend extends React.Component {
type="button" type="button"
className="btn dropdown-toggle btn-info" className="btn dropdown-toggle btn-info"
title="- { translate('SEND.SELECT_T_OR_Z_ADDR') } -" title="- { translate('SEND.SELECT_T_OR_Z_ADDR') } -"
aria-expanded="true"
onClick={ this.openDropMenu }> onClick={ this.openDropMenu }>
<span className="filter-option pull-left">{ this.renderSelectorCurrentLabel() } </span> <span className="filter-option pull-left">{ this.renderSelectorCurrentLabel() } </span>
<span className="bs-caret"> <span className="bs-caret">
@ -93,9 +90,9 @@ class WalletsNativeSend extends React.Component {
</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">
<li className="selected"> <li className="selected">
<a tabIndex="0"><span className="text"> - { translate('SEND.SELECT_T_OR_Z_ADDR') } - </span><span className="glyphicon glyphicon-ok check-mark"></span></a> <a><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') }
{ this.renderAddressByType('private') } { this.renderAddressByType('private') }
@ -125,14 +122,12 @@ class WalletsNativeSend extends React.Component {
} }
}; };
if (opid.status === 'queued') {
return ( return (
<span className={ `label label-${_satatusDef[opid.status].icon}` }> <span className={ `label label-${_satatusDef[opid.status].icon}` }>
<i className="icon fa-eye"></i> <span>{ translate(`KMD_NATIVE.${_satatusDef[opid.status].label}`) }</span> <i className="icon fa-eye"></i> <span>{ translate(`KMD_NATIVE.${_satatusDef[opid.status].label}`) }</span>
</span> </span>
); );
} }
}
renderOPIDResult(opid) { renderOPIDResult(opid) {
let isWaitingStatus = true; let isWaitingStatus = true;
@ -255,13 +250,13 @@ class WalletsNativeSend extends React.Component {
<div className="col-lg-6 form-group form-material"> <div className="col-lg-6 form-group form-material">
<label <label
className="control-label" className="control-label"
htmlFor="kmd_wallet_sendto">{ translate('INDEX.SEND_TO') } via Openalias address</label> htmlFor="kmdWalletSendTo">{ translate('INDEX.SEND_TO') } via Openalias address</label>
<input <input
type="text" type="text"
className="form-control" className="form-control"
name="sendToOA" name="sendToOA"
onChange={ this.updateInput } onChange={ this.updateInput }
id="kmd_wallet_sendto" id="kmdWalletSendTo"
placeholder="Enter an alias as address@site.com" placeholder="Enter an alias as address@site.com"
autoComplete="off" autoComplete="off"
required /> required />
@ -270,7 +265,6 @@ class WalletsNativeSend extends React.Component {
<button <button
type="button" type="button"
className="btn btn-primary waves-effect waves-light" className="btn btn-primary waves-effect waves-light"
id="kmd_wallet_send_coins_btn"
onClick={ this.getOAdress }> onClick={ this.getOAdress }>
Get address Get address
</button> </button>
@ -296,32 +290,30 @@ class WalletsNativeSend extends React.Component {
</h3> </h3>
</div> </div>
<div className="panel-body container-fluid"> <div className="panel-body container-fluid">
<form className="extcoin-send-form" method="post" role="form" autoComplete="off"> <form className="extcoin-send-form" method="post" autoComplete="off">
<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 <label className="control-label">{ translate('INDEX.SEND_FROM') }</label>
className="control-label"
htmlFor="kmd_wallet_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" htmlFor="kmd_wallet_sendto">{ translate('INDEX.SEND_TO') }</label> <label className="control-label" htmlFor="kmdWalletSendTo">{ translate('INDEX.SEND_TO') }</label>
<input <input
type="text" type="text"
className="form-control" className="form-control"
name="sendTo" name="sendTo"
onChange={ this.updateInput } onChange={ this.updateInput }
value={ this.state.sendTo } value={ this.state.sendTo }
id="kmd_wallet_sendto" id="kmdWalletSendTo"
placeholder={ translate('SEND.ENTER_T_OR_Z_ADDR') } placeholder={ translate('SEND.ENTER_T_OR_Z_ADDR') }
autoComplete="off" autoComplete="off"
required /> 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="kmd_wallet_amount" id="kmd_wallet_amount_label"> <label className="control-label" htmlFor="kmdWalletAmount">
{ this.props.ActiveCoin.coin } { this.props.ActiveCoin.coin }
</label> </label>
<input <input
@ -329,18 +321,18 @@ class WalletsNativeSend extends React.Component {
className="form-control" className="form-control"
name="amount" name="amount"
onChange={ this.updateInput } onChange={ this.updateInput }
id="kmd_wallet_amount" id="kmdWalletAmount"
placeholder="0.000" placeholder="0.000"
autoComplete="off" /> autoComplete="off" />
</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="kmd_wallet_fee">{ translate('INDEX.FEE') }</label> <label className="control-label" htmlFor="kmdWalletFee">{ translate('INDEX.FEE') }</label>
<input <input
type="text" type="text"
className="form-control" className="form-control"
name="fee" name="fee"
onChange={ this.updateInput } onChange={ this.updateInput }
id="kmd_wallet_fee" id="kmdWalletFee"
placeholder="0.000" placeholder="0.000"
value={ this.state.fee } value={ this.state.fee }
autoComplete="off" /> autoComplete="off" />
@ -354,8 +346,8 @@ class WalletsNativeSend extends React.Component {
<button <button
type="button" type="button"
className="btn btn-primary waves-effect waves-light pull-right" className="btn btn-primary waves-effect waves-light pull-right"
id="kmd_wallet_send_coins_btn" onClick={ this.handleSubmit }
onClick={ this.handleSubmit }> disabled={ !this.state.sendFrom || !this.state.sendTo || !this.state.amount }>
{ translate('INDEX.SEND') } { this.state.amount } { this.props.ActiveCoin.coin } { translate('INDEX.SEND') } { this.state.amount } { this.props.ActiveCoin.coin }
</button> </button>
</div> </div>
@ -368,7 +360,7 @@ class WalletsNativeSend extends React.Component {
<div className="col-xs-12"> <div className="col-xs-12">
<div className="row"> <div className="row">
<div className="panel nav-tabs-horizontal"> <div className="panel nav-tabs-horizontal">
<div id="kmd_wallet_opids_status_section"> <div>
<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">
@ -377,7 +369,6 @@ class WalletsNativeSend extends React.Component {
<div className="panel-body"> <div className="panel-body">
<table <table
className="table table-hover dataTable table-striped" className="table table-hover dataTable table-striped"
id="kmd-opid-status-tbl"
width="100%"> width="100%">
<thead> <thead>
<tr> <tr>

41
react/src/components/dashboard/walletsNativeSyncProgress.js
View File

@ -6,24 +6,14 @@ class WalletsNativeSyncProgress extends React.Component {
if (this.props.Dashboard.progress.blocks > 0 && if (this.props.Dashboard.progress.blocks > 0 &&
this.props.Dashboard.progress.longestchain === 0) { this.props.Dashboard.progress.longestchain === 0) {
return ( return (
<div <div className="progress-bar progress-bar-info progress-bar-striped active full-width font-size-80-percent">
className="progress-bar progress-bar-info progress-bar-striped active full-width font-size-80-percent" <span className="full-width">{ translate('INDEX.SYNC_ERR_LONGESTCHAIN') }</span>
role="progressbar"
id="extcoin-sync">
<span
id="extcoin-sync-percent"
className="full-width">{ translate('INDEX.SYNC_ERR_LONGESTCHAIN') }</span>
</div> </div>
); );
} else if (this.props.Dashboard.progress.blocks === 0) { } else if (this.props.Dashboard.progress.blocks === 0) {
return ( return (
<div <div className="progress-bar progress-bar-info progress-bar-striped active full-width font-size-80-percent">
className="progress-bar progress-bar-info progress-bar-striped active full-width font-size-80-percent" <span className="full-width">{ translate('INDEX.SYNC_ERR_BLOCKS') }</span>
role="progressbar"
id="extcoin-sync">
<span
id="extcoin-sync-percent"
className="full-width">{ translate('INDEX.SYNC_ERR_BLOCKS') }</span>
</div> </div>
); );
} else { } else {
@ -32,12 +22,8 @@ class WalletsNativeSyncProgress extends React.Component {
return ( return (
<div <div
className="progress-bar progress-bar-info progress-bar-striped active font-size-80-percent" className="progress-bar progress-bar-info progress-bar-striped active font-size-80-percent"
style={{ width: syncPercentage }} style={{ width: syncPercentage }}>
role="progressbar" <span style={{ width: syncPercentage }}>{ syncPercentage }</span> | { this.props.Dashboard.progress.blocks } / { this.props.Dashboard.progress.longestchain } | { translate('INDEX.CONNECTIONS') }: { this.props.Dashboard.progress.connections }
id="extcoin-sync">
<span
id="extcoin-sync-percent"
style={{ width: syncPercentage }}>{ syncPercentage }</span> | <span id="extcoin-synced-blocks">{ this.props.Dashboard.progress.blocks }</span> / <span id="extcoin-longestchain">{ this.props.Dashboard.progress.longestchain }</span> | { translate('INDEX.CONNECTIONS') }: <span id="extcoin-connections">{ this.props.Dashboard.progress.connections }</span>
</div> </div>
); );
} }
@ -60,7 +46,7 @@ class WalletsNativeSyncProgress extends React.Component {
return(`: ${Math.floor(currentBestChain * 100 / this.props.Dashboard.progress.remoteKMDNode.blocks)}% (blocks ${currentBestChain} / ${this.props.Dashboard.progress.remoteKMDNode.blocks})`); return(`: ${Math.floor(currentBestChain * 100 / this.props.Dashboard.progress.remoteKMDNode.blocks)}% (blocks ${currentBestChain} / ${this.props.Dashboard.progress.remoteKMDNode.blocks})`);
} else { } else {
return ( return (
<span id="activating-komodod-tridot">...</span> <span>...</span>
); );
} }
} }
@ -81,17 +67,14 @@ class WalletsNativeSyncProgress extends React.Component {
if ((this.props.Dashboard.progress.blocks < this.props.Dashboard.progress.longestchain) || if ((this.props.Dashboard.progress.blocks < this.props.Dashboard.progress.longestchain) ||
this.props.Dashboard.progress.remoteKMDNode) { this.props.Dashboard.progress.remoteKMDNode) {
return ( return (
<div <div className="alert alert-info alert-dismissible margin-bottom-40">
role="alert" <button className="close" type="button">
className="alert alert-info alert-dismissible margin-bottom-40" <span>×</span>
id="extcoin-wallet-activating-alert">
<button aria-label="Close" data-dismiss="alert" className="close" type="button">
<span aria-hidden="true">×</span>
</button> </button>
<h4> <h4>
{ translate('INDEX.ACTIVATING_CHAIN') }{ this.renderActivatingBestChainProgress() } { translate('INDEX.ACTIVATING_CHAIN') }{ this.renderActivatingBestChainProgress() }
</h4> </h4>
<p id="extcoin-wallet-connection-alert-text">{ this.renderLB('INDEX.KMD_STARTED') }</p> <p>{ this.renderLB('INDEX.KMD_STARTED') }</p>
</div> </div>
); );
} else { } else {
@ -107,7 +90,7 @@ class WalletsNativeSyncProgress extends React.Component {
<div> <div>
{ this.renderChainActivationNotification() } { this.renderChainActivationNotification() }
<div className="row sync-progress-container"> <div className="row sync-progress-container">
<div className="col-xs-12" id="extcoin-progressbars"> <div className="col-xs-12">
<div className="progress"> <div className="progress">
{ this.renderSyncPercentagePlaceholder() } { this.renderSyncPercentagePlaceholder() }
</div> </div>

42
react/src/components/dashboard/walletsNativeTxHistory.js
View File

@ -125,8 +125,7 @@ class WalletsNativeTxHistory extends React.Component {
items.push( items.push(
<li className={ this.state.activePage === i + 1 ? 'paginate_button active' : 'paginate_button' }> <li className={ this.state.activePage === i + 1 ? 'paginate_button active' : 'paginate_button' }>
<a <a
aria-controls="kmd-tx-history-tbl" key={ `${i}-pagination` }
tabIndex="0" key={ `${i}-pagination` }
onClick={ this.state.activePage !== (i + 1) ? () => this.updateCurrentPage(i + 1) : null }>{ i + 1 }</a> onClick={ this.state.activePage !== (i + 1) ? () => this.updateCurrentPage(i + 1) : null }>{ i + 1 }</a>
</li> </li>
); );
@ -140,12 +139,11 @@ class WalletsNativeTxHistory extends React.Component {
this.props.ActiveCoin.txhistory !== 'loading' && this.props.ActiveCoin.txhistory !== 'loading' &&
this.props.ActiveCoin.txhistory.length > 10) { this.props.ActiveCoin.txhistory.length > 10) {
return ( return (
<div className="dataTables_length" id="kmd-tx-history-tbl_length"> <div className="dataTables_length">
<label> <label>
{ translate('INDEX.SHOW') }&nbsp; { translate('INDEX.SHOW') }&nbsp;
<select <select
name="itemsPerPage" name="itemsPerPage"
aria-controls="kmd-tx-history-tbl"
className="form-control input-sm" className="form-control input-sm"
onChange={ this.updateInput }> onChange={ this.updateInput }>
<option value="10">10</option> <option value="10">10</option>
@ -173,31 +171,17 @@ class WalletsNativeTxHistory extends React.Component {
return ( return (
<div className="row unselectable"> <div className="row unselectable">
<div className="col-sm-5"> <div className="col-sm-5">
<div <div className="dataTables_info">{ translate('INDEX.SHOWING') } { _paginationStart } { translate('INDEX.TO') } { _paginationEnd } { translate('INDEX.OF') } { this.props.ActiveCoin.txhistory.length } { translate('INDEX.ENTRIES_SM') }</div>
className="dataTables_info"
id="kmd-tx-history-tbl_info"
role="status"
aria-live="polite">{ translate('INDEX.SHOWING') } { _paginationStart } { translate('INDEX.TO') } { _paginationEnd } { 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">
<ul className="pagination"> <ul className="pagination">
<li <li className={ this.state.activePage === 1 ? 'paginate_button previous disabled' : 'paginate_button previous' }>
className={ this.state.activePage === 1 ? 'paginate_button previous disabled' : 'paginate_button previous' } <a onClick={ () => this.updateCurrentPage(this.state.activePage - 1) }>{ translate('INDEX.PREVIOUS') }</a>
id="kmd-tx-history-tbl_previous">
<a
aria-controls="kmd-tx-history-tbl"
tabIndex="0"
onClick={ () => this.updateCurrentPage(this.state.activePage - 1) }>{ translate('INDEX.PREVIOUS') }</a>
</li> </li>
{this.renderPaginationItems()} {this.renderPaginationItems()}
<li <li className={ _paginationNextState ? 'paginate_button next disabled' : 'paginate_button next' }>
className={ _paginationNextState ? 'paginate_button next disabled' : 'paginate_button next' } <a onClick={ () => this.updateCurrentPage(this.state.activePage + 1) }>{ translate('INDEX.NEXT') }</a>
id="kmd-tx-history-tbl_next">
<a
aria-controls="kmd-tx-history-tbl"
tabIndex="0"
onClick={ () => this.updateCurrentPage(this.state.activePage + 1) }>{ translate('INDEX.NEXT') }</a>
</li> </li>
</ul> </ul>
</div> </div>
@ -258,10 +242,10 @@ class WalletsNativeTxHistory extends React.Component {
this.props.ActiveCoin.nativeActiveSection === 'default') { this.props.ActiveCoin.nativeActiveSection === 'default') {
return ( return (
<div className="native-transactions"> <div className="native-transactions">
<div id="kmd_wallet_dashboardinfo"> <div>
<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 id="kmd_wallet_dashoard_section"> <div>
<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">
@ -273,15 +257,15 @@ class WalletsNativeTxHistory extends React.Component {
{ this.renderPaginationItemsPerPageSelector() } { this.renderPaginationItemsPerPageSelector() }
</div> </div>
<div className="col-sm-6"> <div className="col-sm-6">
<div id="kmd-tx-history-tbl_filter" className="dataTables_filter"> <div className="dataTables_filter">
<label> <label>
{ translate('INDEX.SEARCH') }: <input type="search" className="form-control input-sm" aria-controls="kmd-tx-history-tbl" disabled="true" /> { translate('INDEX.SEARCH') }: <input type="search" className="form-control input-sm" disabled="true" />
</label> </label>
</div> </div>
</div> </div>
</div> </div>
<div className="row"> <div className="row">
<table className="table table-hover dataTable table-striped" id="kmd-tx-history-tbl" width="100%"> <table className="table table-hover dataTable table-striped" width="100%">
<thead> <thead>
<tr> <tr>
<th>{ translate('INDEX.TYPE') }</th> <th>{ translate('INDEX.TYPE') }</th>

67
react/src/components/dashboard/walletsNativeTxInfo.js
View File

@ -38,55 +38,36 @@ class WalletsNativeTxInfo extends React.Component {
return ( return (
<div onKeyDown={ (event) => this.handleKeydown(event) }> <div onKeyDown={ (event) => this.handleKeydown(event) }>
<div className="modal show" id="kmd_txid_info_mdl" aria-hidden="false" role="dialog"> <div className="modal show" id="kmd_txid_info_mdl">
<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-body modal-body-container"> <div className="modal-body modal-body-container">
<div className="panel nav-tabs-horizontal"> <div className="panel nav-tabs-horizontal">
<ul className="nav nav-tabs nav-tabs-line" role="tablist"> <ul className="nav nav-tabs nav-tabs-line">
<li className={ this.state.activeTab === 0 ? 'active' : '' } role="presentation"> <li className={ this.state.activeTab === 0 ? 'active' : '' }>
<a <a onClick={ () => this.openTab(0) }>
data-toggle="tab" <i className="icon md-balance-wallet"></i>TxID Info
aria-controls="KmdTxIDInfotab1"
role="tab"
onClick={ () => this.openTab(0) }>
<i className="icon md-balance-wallet" aria-hidden="true"></i>TxID Info
</a> </a>
</li> </li>
<li className={ this.state.activeTab === 1 ? 'active' : '' } role="presentation"> <li className={ this.state.activeTab === 1 ? 'active' : '' }>
<a <a onClick={ () => this.openTab(1) }>
data-toggle="tab" <i className="icon md-plus-square"></i>Vjointsplits, Details
aria-controls="KmdTxIDInfotab2"
role="tab"
onClick={ () => this.openTab(1) }>
<i className="icon md-plus-square" aria-hidden="true"></i>Vjointsplits, Details
</a> </a>
</li> </li>
<li className={ this.state.activeTab === 2 ? 'active' : '' } role="presentation"> <li className={ this.state.activeTab === 2 ? 'active' : '' }>
<a <a onClick={ () => this.openTab(2) }>
data-toggle="tab" <i className="icon wb-briefcase"></i>Hex
aria-controls="KmdTxIDInfotab3"
role="tab"
onClick={ () => this.openTab(2) }>
<i className="icon wb-briefcase" aria-hidden="true"></i>Hex
</a> </a>
</li> </li>
<li className={ this.state.activeTab === 3 ? 'active' : '' } role="presentation"> <li className={ this.state.activeTab === 3 ? 'active' : '' }>
<a <a onClick={ () => this.openTab(3) }>
data-toggle="tab" <i className="icon wb-file"></i>Raw info
aria-controls="KmdTxIDInfotab4"
role="tab"
onClick={ () => this.openTab(3) }>
<i className="icon wb-file" aria-hidden="true"></i>Raw info
</a> </a>
</li> </li>
</ul> </ul>
<div className="panel-body"> <div className="panel-body">
<div className="tab-content"> <div className="tab-content">
<div <div className={ this.state.activeTab === 0 ? 'tab-pane active' : 'tab-pane' }>
className={ this.state.activeTab === 0 ? 'tab-pane active' : 'tab-pane' }
id="KmdTxIDInfotab1"
role="tabpanel">
<table className="table table-striped"> <table className="table table-striped">
<tbody> <tbody>
<tr> <tr>
@ -152,10 +133,7 @@ class WalletsNativeTxInfo extends React.Component {
</tbody> </tbody>
</table> </table>
</div> </div>
<div <div className={ this.state.activeTab === 1 ? 'tab-pane active' : 'tab-pane' }>
className={ this.state.activeTab === 1 ? 'tab-pane active' : 'tab-pane' }
id="KmdTxIDInfotab2"
role="tabpanel">
<table className="table table-striped"> <table className="table table-striped">
<tbody> <tbody>
<tr> <tr>
@ -173,23 +151,15 @@ class WalletsNativeTxInfo extends React.Component {
</tbody> </tbody>
</table> </table>
</div> </div>
<div <div className={ this.state.activeTab === 2 ? 'tab-pane active' : 'tab-pane' }>
className={ this.state.activeTab === 2 ? 'tab-pane active' : 'tab-pane' }
id="KmdTxIDInfotab3"
role="tabpanel">
<textarea <textarea
id="kmd_txid_info_hex"
className="full-width height-170" className="full-width height-170"
rows="10" rows="10"
cols="80" cols="80"
defaultValue={ txInfo.hex } disabled></textarea> defaultValue={ txInfo.hex } disabled></textarea>
</div> </div>
<div <div className={ this.state.activeTab === 3 ? 'tab-pane active' : 'tab-pane' }>
className={ this.state.activeTab === 3 ? 'tab-pane active' : 'tab-pane' }
id="KmdTxIDInfotab4"
role="tabpanel">
<textarea <textarea
id="kmd_txid_info_hex"
className="full-width height-400" className="full-width height-400"
rows="40" rows="40"
cols="80" cols="80"
@ -204,7 +174,6 @@ class WalletsNativeTxInfo extends React.Component {
<button <button
type="button" type="button"
className="btn btn-default" className="btn btn-default"
data-dismiss="modal"
onClick={ this.toggleTxInfoModal }>{ translate('INDEX.CLOSE') }</button> onClick={ this.toggleTxInfoModal }>{ translate('INDEX.CLOSE') }</button>
</div> </div>
</div> </div>

21
react/src/components/dashboard/walletsNav.js
View File

@ -54,11 +54,11 @@ class WalletsNav extends React.Component {
!this.props.ActiveCoin.coin) { !this.props.ActiveCoin.coin) {
return ( return (
<div> <div>
<div className="col-xs-12 padding-top-20" id="no_wallet_selected"> <div className="col-xs-12 padding-top-20">
<div className="alert alert-info alert-dismissible" role="alert"> <div className="alert alert-info alert-dismissible">
<button type="button" className="close" data-dismiss="alert" aria-label="Close"></button> <button type="button" className="close"></button>
<span className="font-size-24 text-align-center"> <span className="font-size-24 text-align-center">
<i className="icon fa-paw" aria-hidden="true"></i> { translate('INDEX.NO_WALLET_CAPS') } <i className="icon fa-paw"></i> { translate('INDEX.NO_WALLET_CAPS') }
</span> </span>
<br/> <br/>
{ translate('INDEX.PLEASE_SELECT_A_WALLET') }. { translate('INDEX.PLEASE_SELECT_A_WALLET') }.
@ -74,30 +74,27 @@ class WalletsNav extends React.Component {
id="header-dashboard" id="header-dashboard"
style={{ marginBottom: this.props.ActiveCoin.mode === 'basilisk' ? '30px' : '0' }}> style={{ marginBottom: this.props.ActiveCoin.mode === 'basilisk' ? '30px' : '0' }}>
<ol className="breadcrumb"> <ol className="breadcrumb">
<strong>{ translate('INDEX.MY') } <span id="edexcoin-active">{ this.props && this.props.ActiveCoin ? this.props.ActiveCoin.coin : '-' }</span> { translate('INDEX.ADDRESS') }: </strong> <span id="edexcoin_active_addr">{ this.props && this.props.Dashboard && this.props.Dashboard.activeHandle ? this.props.Dashboard.activeHandle[this.props.ActiveCoin.coin] : '-' }</span> <button className="btn btn-default btn-xs clipboard-edexaddr" id="edexcoin_active_addr_clipboard" onClick={ () => this.copyMyAddress(this.props.Dashboard.activeHandle[this.props.ActiveCoin.coin]) }><i className="icon wb-copy" aria-hidden="true"></i> { translate('INDEX.COPY') }</button> <strong>{ translate('INDEX.MY') } { this.props && this.props.ActiveCoin ? this.props.ActiveCoin.coin : '-' } { translate('INDEX.ADDRESS') }: </strong> { this.props && this.props.Dashboard && this.props.Dashboard.activeHandle ? this.props.Dashboard.activeHandle[this.props.ActiveCoin.coin] : '-' } <button className="btn btn-default btn-xs clipboard-edexaddr" onClick={ () => this.copyMyAddress(this.props.Dashboard.activeHandle[this.props.ActiveCoin.coin]) }><i className="icon wb-copy"></i> { translate('INDEX.COPY') }</button>
</ol> </ol>
<div className="page-header-actions" id="edexcoin-actions"> <div className="page-header-actions">
<div id="kmd_header_button"> <div id="kmd_header_button">
<button <button
type="button" type="button"
className="btn btn-dark waves-effect waves-light" className="btn btn-dark waves-effect waves-light"
id="btn_edexcoin_dashboard"
onClick={ this.toggleSendReceiveCoinForms }> onClick={ this.toggleSendReceiveCoinForms }>
<i className="icon md-view-dashboard" aria-hidden="true"></i> { this.props.ActiveCoin.mode !== 'native' ? translate('INDEX.DASHBOARD') : translate('INDEX.WALLET_INFO') } <i className="icon md-view-dashboard"></i> { this.props.ActiveCoin.mode !== 'native' ? translate('INDEX.DASHBOARD') : translate('INDEX.WALLET_INFO') }
</button> </button>
<button <button
type="button" type="button"
className="btn btn-primary waves-effect waves-light" className="btn btn-primary waves-effect waves-light"
id="btn_edexcoin_send"
onClick={ () => this.toggleSendCoinForm(!this.props.ActiveCoin.send) }> onClick={ () => this.toggleSendCoinForm(!this.props.ActiveCoin.send) }>
<i className="icon fa-send" aria-hidden="true"></i> { translate('INDEX.SEND') } <i className="icon fa-send"></i> { translate('INDEX.SEND') }
</button> </button>
<button <button
type="button" type="button"
className="btn btn-info waves-effect waves-light" className="btn btn-info waves-effect waves-light"
id="btn_edexcoin_recieve"
onClick={ () => this.toggleReceiveCoinForm(!this.props.ActiveCoin.receive) }> onClick={ () => this.toggleReceiveCoinForm(!this.props.ActiveCoin.receive) }>
<i className="icon fa-inbox" aria-hidden="true"></i> { translate('INDEX.RECEIVE') } <i className="icon fa-inbox"></i> { translate('INDEX.RECEIVE') }
</button> </button>
</div> </div>
</div> </div>

4
react/src/components/dashboard/walletsNotariesList.js
View File

@ -57,14 +57,14 @@ class WalletsNotariesList extends React.Component {
return ( return (
<div onKeyDown={ (event) => this.handleKeydown(event) }> <div onKeyDown={ (event) => this.handleKeydown(event) }>
<div className="modal show" id="kmd_txid_info_mdl" aria-hidden="false" role="dialog"> <div className="modal show" id="kmd_txid_info_mdl">
<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-body modal-body-container"> <div className="modal-body modal-body-container">
<div className="panel nav-tabs-horizontal"> <div className="panel nav-tabs-horizontal">
<div className="panel-body"> <div className="panel-body">
<div className="tab-content"> <div className="tab-content">
<div className="tab-pane active" role="tabpanel"> <div className="tab-pane active">
{ this.renderNotariesFetching() } { this.renderNotariesFetching() }
<Tree defaultExpandAll={ false } openAnimation={ animation }> <Tree defaultExpandAll={ false } openAnimation={ animation }>
{ this.renderNotariesList() } { this.renderNotariesList() }

31
react/src/components/dashboard/walletsProgress.js
View File

@ -34,47 +34,36 @@ class WalletsProgress extends React.Component {
<div className="row no-space"> <div className="row no-space">
<div id="currency-progressbars"> <div id="currency-progressbars">
<div className="progress progress-sm"> <div className="progress progress-sm">
<div <div className={ 'full-width font-size-80-percent ' + (this.isFullySynced() ? 'progress-bar progress-bar-striped active progress-bar-indicating progress-bar-success' : 'hide') }>
className={'full-width font-size-80-percent ' + (this.isFullySynced() ? 'progress-bar progress-bar-striped active progress-bar-indicating progress-bar-success' : 'hide') }
role="progressbar"
id="currency-bundles">
{ translate('INDEX.BUNDLES') } <span id="currency-bundles-percent">({ this.props.ActiveCoin.coin }) 100.00% - ( { this.props.Dashboard.progress.blocks } / { this.props.Dashboard.progress.blocks } ) ==&gt;&gt; RT{ this.props.Dashboard.progress.RTheight }</span> { translate('INDEX.BUNDLES') } <span id="currency-bundles-percent">({ this.props.ActiveCoin.coin }) 100.00% - ( { this.props.Dashboard.progress.blocks } / { this.props.Dashboard.progress.blocks } ) ==&gt;&gt; RT{ this.props.Dashboard.progress.RTheight }</span>
</div> </div>
<div <div
className={ 'font-size-80-percent ' + (this.isFullySynced() ? 'hide' : 'progress-bar progress-bar-info progress-bar-striped active') } className={ 'font-size-80-percent ' + (this.isFullySynced() ? 'hide' : 'progress-bar progress-bar-info progress-bar-striped active') }
style={{ width: this.props.Dashboard.progress.bundles + '%' }} style={{ width: this.props.Dashboard.progress.bundles + '%' }}>
role="progressbar" { translate('INDEX.BUNDLES') } { this.props.Dashboard.progress.bundles }%
id="currency-bundles">
{ translate('INDEX.BUNDLES') } <span id="currency-bundles-percent">{ this.props.Dashboard.progress.bundles }%</span>
</div> </div>
</div> </div>
</div> </div>
<div id="additional-progress-bars" className={ this.isFullySynced() ? 'hide' : '' }> <div className={ this.isFullySynced() ? 'hide' : '' }>
<div className="progress progress-sm"> <div className="progress progress-sm">
<div <div
className="progress-bar progress-bar-warning progress-bar-striped active font-size-80-percent" className="progress-bar progress-bar-warning progress-bar-striped active font-size-80-percent"
style={{ width: this.props.Dashboard.progress.utxo + '%' }} style={{ width: this.props.Dashboard.progress.utxo + '%' }}>
role="progressbar" utxo { this.props.Dashboard.progress.utxo }%
id="currency-utxo">
utxo <span id="currency-utxo-percent">{ this.props.Dashboard.progress.utxo }%</span>
</div> </div>
</div> </div>
<div className="progress progress-sm"> <div className="progress progress-sm">
<div <div
className="progress-bar progress-bar-danger progress-bar-striped active font-size-80-percent" className="progress-bar progress-bar-danger progress-bar-striped active font-size-80-percent"
style={{ width: this.props.Dashboard.progress.balances + '%' }} style={{ width: this.props.Dashboard.progress.balances + '%' }}>
role="progressbar" { translate('INDEX.BALANCES') } { this.props.Dashboard.progress.balances }%
id="currency-balances">
{ translate('INDEX.BALANCES') } <span id="currency-balances-percent">{ this.props.Dashboard.progress.balances }%</span>
</div> </div>
</div> </div>
<div className="progress progress-sm"> <div className="progress progress-sm">
<div <div
className="progress-bar progress-bar-success progress-bar-striped active font-size-80-percent" className="progress-bar progress-bar-success progress-bar-striped active font-size-80-percent"
style={{ width: this.props.Dashboard.progress.validated + '%' }} style={{ width: this.props.Dashboard.progress.validated + '%' }}>
role="progressbar" { translate('INDEX.VALIDATED') } { this.props.Dashboard.progress.validated }%
id="currency-validated">
{ translate('INDEX.VALIDATED') } <span id="currency-validated-percent">{ this.props.Dashboard.progress.validated }%</span>
</div> </div>
</div> </div>
</div> </div>

35
react/src/components/dashboard/walletsTxInfo.js
View File

@ -37,37 +37,26 @@ class WalletsTxInfo extends React.Component {
return ( return (
<div onKeyDown={ (event) => this.handleKeydown(event) }> <div onKeyDown={ (event) => this.handleKeydown(event) }>
<div className="modal show" id="kmd_txid_info_mdl" aria-hidden="false" role="dialog"> <div className="modal show" id="kmd_txid_info_mdl">
<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-body modal-body-container"> <div className="modal-body modal-body-container">
<div className="panel nav-tabs-horizontal"> <div className="panel nav-tabs-horizontal">
<ul className="nav nav-tabs nav-tabs-line" role="tablist"> <ul className="nav nav-tabs nav-tabs-line">
<li className={ this.state.activeTab === 0 ? 'active' : '' } role="presentation"> <li className={ this.state.activeTab === 0 ? 'active' : '' }>
<a <a onClick={ () => this.openTab(0) }>
data-toggle="tab" <i className="icon md-balance-wallet"></i>TxID Info
aria-controls="KmdTxIDInfotab1"
role="tab"
onClick={ () => this.openTab(0) }>
<i className="icon md-balance-wallet" aria-hidden="true"></i>TxID Info
</a> </a>
</li> </li>
<li className={ this.state.activeTab === 1 ? 'active' : '' } role="presentation"> <li className={ this.state.activeTab === 1 ? 'active' : '' }>
<a <a onClick={ () => this.openTab(1) }>
data-toggle="tab" <i className="icon wb-file"></i>Raw info
aria-controls="KmdTxIDInfotab4"
role="tab"
onClick={ () => this.openTab(1) }>
<i className="icon wb-file" aria-hidden="true"></i>Raw info
</a> </a>
</li> </li>
</ul> </ul>
<div className="panel-body"> <div className="panel-body">
<div className="tab-content"> <div className="tab-content">
<div <div className={ this.state.activeTab === 0 ? 'tab-pane active' : 'tab-pane' }>
className={ this.state.activeTab === 0 ? 'tab-pane active' : 'tab-pane' }
id="KmdTxIDInfotab1"
role="tabpanel">
<table className="table table-striped"> <table className="table table-striped">
<tbody> <tbody>
<tr> <tr>
@ -115,11 +104,8 @@ class WalletsTxInfo extends React.Component {
</tbody> </tbody>
</table> </table>
</div> </div>
<div <div className={ this.state.activeTab === 1 ? 'tab-pane active' : 'tab-pane' }>
className={ this.state.activeTab === 1 ? 'tab-pane active' : 'tab-pane' }
id="KmdTxIDInfotab4" role="tabpanel">
<textarea <textarea
id="kmd_txid_info_hex"
className="full-width height-400" className="full-width height-400"
rows="40" rows="40"
cols="80" cols="80"
@ -133,7 +119,6 @@ class WalletsTxInfo extends React.Component {
<button <button
type="button" type="button"
className="btn btn-default" className="btn btn-default"
data-dismiss="modal"
onClick={ this.toggleTxInfoModal }>{ translate('INDEX.CLOSE') }</button> onClick={ this.toggleTxInfoModal }>{ translate('INDEX.CLOSE') }</button>
</div> </div>
</div> </div>

4
react/src/components/overrides.scss
View File

@ -550,3 +550,7 @@ input:checked + .slider:before {
.bootstrap-select > .dropdown-toggle { .bootstrap-select > .dropdown-toggle {
z-index: 0; z-index: 0;
} }
select.form-control.form-material {
color: #757575;
}

2
react/src/components/toaster/toaster-item.js
View File

@ -61,7 +61,7 @@ class ToasterItem extends React.Component {
return ( return (
<div className={ `toast toast-${this.state.type}` }> <div className={ `toast toast-${this.state.type}` }>
<button <button
className="toast-close-button" role="button" className="toast-close-button"
onClick={ () => this.dismissToast(this.state.toastId) }>× onClick={ () => this.dismissToast(this.state.toastId) }>×
</button> </button>
<div className="toast-title">{ this.state.title }</div> <div className="toast-title">{ this.state.title }</div>

4
react/src/components/toaster/toaster.js
View File

@ -54,9 +54,7 @@ class Toaster extends React.Component {
return ( return (
<div <div
id="toast-container" id="toast-container"
className="single-toast toast-bottom-right" className="single-toast toast-bottom-right">
aria-live="polite"
role="alert">
{ this.renderToasts() } { this.renderToasts() }
</div> </div>
); );

4
react/src/translate/en.js
View File

@ -1,6 +1,10 @@
export const _lang = { export const _lang = {
'EN': { 'EN': {
'INDEX': { 'INDEX': {
'IMPORT': 'Import',
'CHECK': 'Check',
'VALIDATE': 'Validate',
'COPY_TO_CLIPBOARD': 'Copy to clipboard',
'EMPTY_DEBUG_LOG': 'Debug.log is empty', 'EMPTY_DEBUG_LOG': 'Debug.log is empty',
'RESTART': 'Restart', 'RESTART': 'Restart',
'WALLET_INFO': 'Wallet Info', 'WALLET_INFO': 'Wallet Info',

Write Preview
Loading…
Cancel
Save