diff --git a/react/src/assets/images/bg/wlc_transparent_header_bg.png b/react/src/assets/images/bg/wlc_transparent_header_bg.png new file mode 100644 index 0000000..e901bd2 Binary files /dev/null and b/react/src/assets/images/bg/wlc_transparent_header_bg.png differ diff --git a/react/src/assets/images/cryptologo/WLC.png b/react/src/assets/images/cryptologo/WLC.png new file mode 100644 index 0000000..bd100c0 Binary files /dev/null and b/react/src/assets/images/cryptologo/WLC.png differ diff --git a/react/src/assets/images/native/wlc_header_title_logo.png b/react/src/assets/images/native/wlc_header_title_logo.png new file mode 100644 index 0000000..48ad71e Binary files /dev/null and b/react/src/assets/images/native/wlc_header_title_logo.png differ diff --git a/react/src/components/dashboard/walletsNativeAlert.js b/react/src/components/dashboard/walletsNativeAlert.js new file mode 100644 index 0000000..ec998a6 --- /dev/null +++ b/react/src/components/dashboard/walletsNativeAlert.js @@ -0,0 +1,28 @@ +import React from 'react'; +import { translate } from '../../translate/translate'; + +class WalletsNativeAlert extends React.Component { + render() { + if (this.props && this.props.Dashboard && !this.props.Dashboard.progress) { + return ( + + ); + } else { + return null; + } + } +} + +export default WalletsNativeAlert; diff --git a/react/src/components/dashboard/walletsNativeBalance.js b/react/src/components/dashboard/walletsNativeBalance.js new file mode 100644 index 0000000..3d23b32 --- /dev/null +++ b/react/src/components/dashboard/walletsNativeBalance.js @@ -0,0 +1,72 @@ +import React from 'react'; +import { translate } from '../../translate/translate'; + +class WalletsNativeBalance extends React.Component { + render() { + return ( +
+
+
+
+
+
+
+ {translate('INDEX.TRANSPARENT_BALANCE')} +
+ {this.props.ActiveCoin.balance.transparent ? this.props.ActiveCoin.balance.transparent : '-'} +
+
+
+
+
+ +
+
+
+
+
+
+ {translate('INDEX.Z_BALANCE')} +
+ {this.props.ActiveCoin.balance.private ? this.props.ActiveCoin.balance.private : '-'} +
+
+
+
+
+ +
+
+
+
+
+
+ {translate('INDEX.INTEREST_EARNED')} +
+ {this.props.ActiveCoin.balance.interest ? this.props.ActiveCoin.balance.interest : '-'} +
+
+
+
+
+ +
+
+
+
+
+
+ {translate('INDEX.ZT_BALANCE')} +
+ {this.props.ActiveCoin.balance.total ? this.props.ActiveCoin.balance.total : '-'} +
+
+
+
+
+
+ ); + } +} + +export default WalletsNativeBalance; diff --git a/react/src/components/dashboard/walletsNativeInfo.js b/react/src/components/dashboard/walletsNativeInfo.js new file mode 100644 index 0000000..3a3ed03 --- /dev/null +++ b/react/src/components/dashboard/walletsNativeInfo.js @@ -0,0 +1,161 @@ +import React from 'react'; +import { translate } from '../../translate/translate'; + +class WalletsNativeInfo extends React.Component { + constructor(props) { + super(props); + } + + render() { + if (this.props && this.props.Dashboard && this.props.Dashboard.progress) { + return ( +
+
+
+
+

{translate('INDEX.WALLET_INFO')}

+
+
+ + + + + + + + + + + + + + + + + + + + + + + +
{translate('INDEX.WALLET_VERSION')} + {this.props.Dashboard.progress.walletversion} +
{translate('INDEX.BALANCE')} + {this.props.Dashboard.progress.balance} +
{translate('INDEX.UNCONFIRMED_BALANCE')} + +
{translate('INDEX.IMMATURE_BALANCE')} + +
{translate('INDEX.TOTAL_TX_COUNT')} + +
+
+
+
+ +
+
+
+

+ Komodo {translate('INDEX.INFO')} +

+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
{translate('INDEX.VERSION')} + {this.props.Dashboard.progress.KMDversion} +
{translate('INDEX.PROTOCOL_VERSION')} + {this.props.Dashboard.progress.protocolversion} +
{translate('INDEX.NOTARIZED')} + {this.props.Dashboard.progress.notarized} +
+ {translate('INDEX.NOTARIZED')} Hash + + { this.props.Dashboard.progress.notarizedhash ? + this.props.Dashboard.progress.notarizedhash.substring(0, Math.floor(this.props.Dashboard.progress.notarizedhash.length / 2)) + + '\t' + + this.props.Dashboard.progress.notarizedhash.substring(Math.floor(this.props.Dashboard.progress.notarizedhash.length / 2), this.props.Dashboard.progress.notarizedhash.length) + : '' + } +
+ {translate('INDEX.NOTARIZED')} BTC + + +
{translate('INDEX.BLOCKS')} + {this.props.Dashboard.progress.blocks} +
{translate('INDEX.CONNECTIONS')} + {this.props.Dashboard.progress.connections} +
{translate('INDEX.DIFFICULTY')} + {this.props.Dashboard.progress.difficulty} +
Testnet + {this.props.Dashboard.progress.testnet} +
{translate('INDEX.PAY_TX_FEE')} + {this.props.Dashboard.progress.paytxfee} +
{translate('INDEX.RELAY_FEE')} + {this.props.Dashboard.progress.relayfee} +
{translate('INDEX.ERRORS')} + {this.props.Dashboard.progress.errors} +
+
+
+
+
+ ); + } else { + return null; + } + } +} + +export default WalletsNativeInfo; diff --git a/react/src/components/dashboard/walletsNativeReceive.js b/react/src/components/dashboard/walletsNativeReceive.js new file mode 100644 index 0000000..ab8f962 --- /dev/null +++ b/react/src/components/dashboard/walletsNativeReceive.js @@ -0,0 +1,65 @@ +import React from 'react'; +import { translate } from '../../translate/translate'; + +class WalletsNativeReceive extends React.Component { + render() { + if (this.props && this.props.ActiveCoin && this.props.ActiveCoin.receive) { + return ( +
+
+
+
+
+
+
+ +

{translate('INDEX.RECEIVING_ADDRESS')}

+
+
+ + + + + + + + + + + + + +
{translate('INDEX.TYPE')}{translate('INDEX.ADDRESS')}
{translate('INDEX.TYPE')}{translate('INDEX.ADDRESS')}
+
+
+
+
+
+
+
+ ); + } else { + return null; + } + } +} + +export default WalletsNativeReceive; diff --git a/react/src/components/dashboard/walletsNativeSend.js b/react/src/components/dashboard/walletsNativeSend.js new file mode 100644 index 0000000..abba5f3 --- /dev/null +++ b/react/src/components/dashboard/walletsNativeSend.js @@ -0,0 +1,101 @@ +import React from 'react'; +import { translate } from '../../translate/translate'; + +class WalletsNativeSend extends React.Component { + render() { + if (this.props && this.props.ActiveCoin && this.props.ActiveCoin.send) { + return ( +
+
+
+
+

+ {translate('INDEX.SEND')} +

+
+
+
+
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + {translate('INDEX.TOTAL')} ( - txfee): 0.000 + +
+
+ +
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+ +
+

{translate('INDEX.OPERATIONS_STATUSES')}

+
+
+ + + + + + + + + + + + + + + + + +
{translate('INDEX.STATUS')}ID{translate('INDEX.TIME')}{translate('INDEX.RESULT')}
{translate('INDEX.STATUS')}ID{translate('INDEX.TIME')}{translate('INDEX.RESULT')}
+
+
+
+
+
+
+
+
+ ); + } else { + return null; + } + } +} + +export default WalletsNativeSend; diff --git a/react/src/components/dashboard/walletsNativeSyncProgress.js b/react/src/components/dashboard/walletsNativeSyncProgress.js new file mode 100644 index 0000000..3af289c --- /dev/null +++ b/react/src/components/dashboard/walletsNativeSyncProgress.js @@ -0,0 +1,86 @@ +import React from 'react'; +import { translate } from '../../translate/translate'; + +class WalletsNativeSyncProgress extends React.Component { + renderSyncPercentagePlaceholder() { + if (this.props.Dashboard.progress.blocks > 0 && this.props.Dashboard.progress.longestchain === 0) { + return ( +
+ Unable to get current sync progress. Err: no longestchain param in response +
+ ); + } else if (this.props.Dashboard.progress.blocks === 0) { + return ( +
+ Unable to get current sync progress. Err: no blocks param in response +
+ ); + } else { + var syncPercentage = (parseFloat(parseInt(this.props.Dashboard.progress.blocks, 10) * 100 / parseInt(this.props.Dashboard.progress.longestchain, 10)).toFixed(2) + '%').replace('NaN', 0); + + return ( +
+ {syncPercentage} | {this.props.Dashboard.progress.blocks} / {this.props.Dashboard.progress.longestchain} | {translate('INDEX.CONNECTIONS')}: {this.props.Dashboard.progress.connections} +
+ ); + } + } + + renderActivatingBestChainProgress() { + if (this.props.Settings && this.props.Settings.debugLog && this.props.Dashboard.progress.remoteKMDNode) { + if (this.props.Settings.debugLog.indexOf('UpdateTip') > -1) { + var temp = this.props.Settings.debugLog.split(' '); + var currentBestChain; + + for (var i = 0; i < temp.length; i++) { + if (temp[i].indexOf('height=') > -1) { + currentBestChain = temp[i].replace('height=', ''); + } + } + + return(': ' + Math.floor(currentBestChain * 100 / this.props.Dashboard.progress.remoteKMDNode.blocks) + '% (blocks ' + currentBestChain + ' / ' + this.props.Dashboard.progress.remoteKMDNode.blocks + ')'); + } else { + return (...); + } + } + } + + renderChainActivationNotification() { + if ((this.props.Dashboard.progress.blocks < this.props.Dashboard.progress.longestchain) || this.props.Dashboard.progress.remoteKMDNode) { + return ( + + ); + } else { + return null; + } + } + + render() { + if (this.props && this.props.Dashboard && this.props.Dashboard.progress) { + return ( +
+ {this.renderChainActivationNotification()} +
+
+
+ {this.renderSyncPercentagePlaceholder()} +
+
+
+
+ ); + } else { + return null; + } + } +} + +export default WalletsNativeSyncProgress; diff --git a/react/src/components/dashboard/walletsNativeTxHistory.js b/react/src/components/dashboard/walletsNativeTxHistory.js new file mode 100644 index 0000000..4cff475 --- /dev/null +++ b/react/src/components/dashboard/walletsNativeTxHistory.js @@ -0,0 +1,52 @@ +import React from 'react'; +import { translate } from '../../translate/translate'; + +class WalletsNativeTxHistory extends React.Component { + render() { + return ( +
+
+
+
+
+
+
+

{translate('INDEX.TRANSACTION_HISTORY')}

+
+
+ + + + + + + + + + + + + + + + + + + + + + + +
{translate('INDEX.TYPE')}{translate('INDEX.DIRECTION')}{translate('INDEX.CONFIRMATIONS')}{translate('INDEX.AMOUNT')}{translate('INDEX.TIME')}{translate('INDEX.DEST_ADDRESS')}{translate('INDEX.TX_DETAIL')}
{translate('INDEX.TYPE')}{translate('INDEX.DIRECTION')}{translate('INDEX.CONFIRMATIONS')}{translate('INDEX.AMOUNT')}{translate('INDEX.TIME')}{translate('INDEX.DEST_ADDRESS')}{translate('INDEX.TX_DETAIL')}
+
+
+
+
+
+
+
+ ); + } +} + +export default WalletsNativeTxHistory; diff --git a/react/src/components/dashboard/walletsNativeTxInfo.js b/react/src/components/dashboard/walletsNativeTxInfo.js new file mode 100644 index 0000000..c9f4ab2 --- /dev/null +++ b/react/src/components/dashboard/walletsNativeTxInfo.js @@ -0,0 +1,139 @@ +import React from 'react'; +import { translate } from '../../translate/translate'; + +class WalletsNativeTxInfo extends React.Component { + render() { + if (this.props && this.props.ActiveCoin && this.props.ActiveCoin.showTransactionInfo) { + return ( +
+ +
+
+ ); + } else { + return null; + } + } +} + +export default WalletsNativeTxInfo; diff --git a/react/src/util/time.js b/react/src/util/time.js new file mode 100644 index 0000000..f1a8cf8 --- /dev/null +++ b/react/src/util/time.js @@ -0,0 +1,26 @@ +export function secondsToString(seconds) { + var a = new Date(seconds * 1000), + months = [ + 'Jan', + 'Feb', + 'Mar', + 'Apr', + 'May', + 'Jun', + 'Jul', + 'Aug', + 'Sep', + 'Oct', + 'Nov', + 'Dec' + ], + year = a.getFullYear(), + month = months[a.getMonth()], + date = a.getDate(), + hour = a.getHours(), + min = a.getMinutes(), + sec = a.getSeconds(), + time = date + ' ' + month + ' ' + year + ' ' + hour + ':' + min + ':' + sec; + + return time; +} \ No newline at end of file