Merge pull request #88 from pbca26/redux

added dashboard components (wip)

react/src/actions/actionCreators.js

@@ -1,9 +1,42 @@
 import 'whatwg-fetch';
 import { startCurrencyAssetChain } from '../components/addcoin/payload';
+import { copyToClipboard } from '../util/copyToClipboard';
 import { translate } from '../translate/translate';
 
 export const TOASTER_MESSAGE = 'TOASTER_MESSAGE';
 export const DISPLAY_ADDCOIN_MODAL = 'DISPLAY_ADDCOIN_MODAL';
+export const GET_ACTIVE_COINS = 'GET_ACTIVE_COINS';
+export const LOGIN = 'LOGIN';
+export const ACTIVE_HANDLE = 'ACTIVE_HANDLE';
+export const DASHBOARD_SECTION_CHANGE = 'DASHBOARD_SECTION_CHANGE';
+export const DASHBOARD_ACTIVE_COIN_CHANGE = 'DASHBOARD_ACTIVE_COIN_CHANGE';
+export const GET_MAIN_ADDRESS = 'GET_MAIN_ADDRESS';
+export const DASHBOARD_ACTIVE_COIN_BALANCE = 'DASHBOARD_ACTIVE_COIN_BALANCE';
+export const DASHBOARD_ACTIVE_COIN_SEND_FORM = 'DASHBOARD_ACTIVE_COIN_SEND_FORM';
+export const DASHBOARD_ACTIVE_COIN_RECEIVE_FORM = 'DASHBOARD_ACTIVE_COIN_RECEIVE_FORM';
+export const DASHBOARD_ACTIVE_COIN_RESET_FORMS = 'DASHBOARD_ACTIVE_COIN_RESET_FORMS';
+
+function toggleSendCoinFormState(display) {
+  return {
+    type: DASHBOARD_ACTIVE_COIN_SEND_FORM,
+    send: display,
+  }
+}
+
+function toggleReceiveCoinFormState(display) {
+  return {
+    type: DASHBOARD_ACTIVE_COIN_SEND_FORM,
+    send: display,
+  }
+}
+
+function toggleSendReceiveCoinFormsState() {
+  return {
+    type: DASHBOARD_ACTIVE_COIN_RESET_FORMS,
+    send: false,
+    receive: false,
+  }
+}
 
 function triggerToaster(display, message, title, _type) {
   return {
@@ -23,12 +56,134 @@ function toggleAddcoinModalState(display, isLogin) {
   }
 }
 
+function dashboardCoinsState(json) {
+  return {
+    type: GET_ACTIVE_COINS,
+    coins: json,
+    activeCoins: Object.keys(json.native).length || Object.keys(json.basilisk).length || Object.keys(json.full).length ? true : false
+  }
+}
+
+function iguanaWalletPassphraseState(json, dispatch) {
+  console.log('passp', json);
+  sessionStorage.setItem('IguanaActiveAccount', JSON.stringify(json));
+  dispatch(triggerToaster(true, translate('TOASTR.LOGIN_SUCCESSFULL'), translate('TOASTR.ACCOUNT_NOTIFICATION'), 'success'));
+
+  return {
+    type: LOGIN,
+    isLoggedIn: json && json.pubkey ? true : false,
+  }
+}
+
+function iguanaActiveHandleState(json) {
+  return {
+    type: ACTIVE_HANDLE,
+    isLoggedIn: sessionStorage.getItem('IguanaActiveAccount') && JSON.parse(sessionStorage.getItem('IguanaActiveAccount')).pubkey === json.pubkey && json.status === 'unlocked' ? true : false,
+    handle: json,
+  }
+}
+
+function getMainAddressState(json) {
+  return {
+    type: GET_MAIN_ADDRESS,
+    activeHandle: json,
+  }
+}
+
+export function toggleSendCoinForm(display) {
+  return dispatch => {
+    dispatch(toggleSendCoinFormState(display));
+  }
+}
+
+export function toggleReceiveCoinForm(display) {
+  return dispatch => {
+    dispatch(toggleReceiveCoinFormState(display));
+  }
+}
+
+export function toggleSendReceiveCoinForms() {
+  return dispatch => {
+    dispatch(toggleSendReceiveCoinFormsState());
+  }
+}
+
+function logoutState(json, dispatch) {
+  console.log('passp', json);
+  sessionStorage.removeItem('IguanaActiveAccount');
+
+  return {
+    type: LOGIN,
+    isLoggedIn: false,
+  }
+}
+
+export function logout() {
+  return dispatch => {
+    dispatch(logoutState());
+  }
+}
+
+function dashboardChangeSectionState(sectionName) {
+  return {
+    type: DASHBOARD_SECTION_CHANGE,
+    activeSection: sectionName,
+  }
+}
+
+export function dashboardChangeSection(sectionName) {
+  return dispatch => {
+    dispatch(dashboardChangeSectionState(sectionName));
+  }
+}
+
+function dashboardChangeActiveCoinState(coin, mode) {
+  return {
+    type: DASHBOARD_ACTIVE_COIN_CHANGE,
+    coin: coin,
+    mode: mode,
+  }
+}
+
+function iguanaEdexBalanceState(json) {
+  return {
+    type: DASHBOARD_ACTIVE_COIN_BALANCE,
+    balance: json && json.result ? json.result : 0,
+  }
+}
+
+export function dashboardChangeActiveCoin(coin, mode) {
+  return dispatch => {
+    dispatch(dashboardChangeActiveCoinState(coin, mode));
+  }
+}
+
 export function toggleAddcoinModal(display, isLogin) {
   return dispatch => {
     dispatch(toggleAddcoinModalState(display, isLogin));
   }
 }
 
+export function copyCoinAddress(address) {
+  var _result = copyToClipboard(address);
+
+  if (_result) {
+    return dispatch => {
+      dispatch(triggerToaster(true, translate('DASHBOARD.ADDR_COPIED'), translate('TOASTR.COIN_NOTIFICATION'), 'success'))
+    }
+  } else {
+    return dispatch => {
+      dispatch(triggerToaster(true, 'Couldn\'t copy address to clipboard', translate('TOASTR.COIN_NOTIFICATION'), 'error'))
+    }
+  }
+}
+
+export function dismissToasterMessage() {
+  return dispatch => {
+    dispatch(triggerToaster(false))
+  }
+}
+
 export function addCoin(coin, mode) {
 	console.log('coin, mode', coin + ' ' + mode);
   return dispatch => {
@@ -87,14 +242,15 @@ export function shepherdHerd(coin, mode, path) {
 
 export function addCoinResult(coin, mode) {
   const modeToValue = {
-    'full': 1,
+    '1': 'full',
-    'basilisk': 0,
+    '0': 'basilisk',
-    'native': -1,
+    '-1': 'native'
   };
 
   return dispatch => {
-    //dispatch(shepherdGetConfig(coin, mode));
+    dispatch(triggerToaster(true, coin + ' ' + translate('TOASTR.STARTED_IN') + ' ' + modeToValue[mode] + ' ' + translate('TOASTR.MODE'), translate('TOASTR.COIN_NOTIFICATION'), 'success'));
-    dispatch(triggerToaster(true, coin + ' ' + translate('TOASTR.COIN_STARTED') + modeToValue[defaultMode] + ' ' + translate('TOASTR.MODE'), translate('TOASTR.COIN_NOTIFICATION'), 'success'));
+    dispatch(toggleAddcoinModal(false, false));
+    dispatch(getDexCoins());
   }
 }
 
@@ -115,3 +271,121 @@ export function shepherdGetConfig(coin, mode) {
     .then(json => dispatch(shepherdHerd(coin, mode, json)));
   }
 }
+
+export function getDexCoins() {
+  return dispatch => {
+    return fetch('http://127.0.0.1:7778', {
+      method: 'POST',
+      //mode: 'no-cors'
+      body: JSON.stringify({
+        'userpass': 'tmpIgRPCUser@' + sessionStorage.getItem('IguanaRPCAuth'),
+        'agent': 'InstantDEX',
+        'method': 'allcoins',
+      })
+    })
+    .catch(function(error) {
+      console.log(error);
+      dispatch(triggerToaster(true, 'Error getDexCoins', 'Error', 'error'))
+
+    })
+    .then(response => response.json())
+    .then(json => dispatch(dashboardCoinsState(json)));
+  }
+}
+
+function rpcErrorHandler(json, dispatch) {
+  console.log('json', json);
+  if (json && json.error) {
+    if (json.error === 'bitcoinrpc needs coin that is active') {
+      dispatch(triggerToaster(true, 'No active coin', translate('TOASTR.SERVICE_NOTIFICATION'), 'error'));
+    }
+  }
+}
+
+export function iguanaWalletPassphrase(_passphrase) {
+  return dispatch => {
+    return fetch('http://127.0.0.1:7778', {
+      method: 'POST',
+      body: JSON.stringify({
+        'userpass': 'tmpIgRPCUser@' + sessionStorage.getItem('IguanaRPCAuth'),
+        'handle': '',
+        'password': _passphrase,
+        'timeout': '2592000',
+        'agent': 'bitcoinrpc',
+        'method': 'walletpassphrase'
+      }),
+    })
+    .catch(function(error) {
+      console.log(error);
+      dispatch(triggerToaster(true, 'Error iguanaWalletPassphrase', 'Error', 'error'))
+    })
+    .then(response => response.json())
+    .then(json => dispatch(iguanaWalletPassphraseState(json, dispatch)));
+  }
+}
+
+export function iguanaActiveHandle(getMainAddress) {
+  return dispatch => {
+    return fetch('http://127.0.0.1:7778', {
+      method: 'POST',
+      body: JSON.stringify({
+        'userpass': 'tmpIgRPCUser@' + sessionStorage.getItem('IguanaRPCAuth'),
+        'agent': 'SuperNET',
+        'method': 'activehandle'
+      }),
+    })
+    .catch(function(error) {
+      console.log(error);
+      dispatch(triggerToaster(true, 'Error iguanaActiveHandle', 'Error', 'error'))
+    })
+    .then(response => response.json())
+    .then(json => dispatch(getMainAddress ? getMainAddressState(json) : iguanaActiveHandleState(json)));
+  }
+}
+
+export function iguanaEdexBalance(coin) {
+  return dispatch => {
+    return fetch('http://127.0.0.1:7778', {
+      method: 'POST',
+      body: JSON.stringify({
+        'userpass': 'tmpIgRPCUser@' + sessionStorage.getItem('IguanaRPCAuth'),
+        'agent': 'bitcoinrpc',
+        'method': 'getbalance',
+        'coin': coin
+      }),
+    })
+    .catch(function(error) {
+      console.log(error);
+      dispatch(triggerToaster(true, 'Error iguanaEdexBalance', 'Error', 'error'))
+    })
+    .then(response => response.json())
+    .then(json => dispatch(iguanaEdexBalanceState(json)));
+  }
+}
+
+/*function Shepherd_SysInfo() {
+  return new Promise((resolve) => {
+    $.ajax({
+      type: 'GET',
+      url: 'http://127.0.0.1:17777/shepherd/sysinfo',
+      contentType: 'application/json' // send as JSON
+    })
+    .done(function(data) {
+      resolve(data);
+    });
+  });
+}
+
+function Shepherd_SendPendValue() {
+  Shepherd_SysInfo().then(function(result){
+    var ram_data = formatBytes(result.totalmem_bytes)
+    var pend_val = null;
+    if (ram_data.size === 'GB') {
+      if (ram_data.ramsize >= '63' ) { pend_val = 16; }
+      if (ram_data.ramsize >= '31' ) { pend_val = 8; }
+      if (ram_data.ramsize >= '15' ) { pend_val = 4; }
+      if (ram_data.ramsize <= '15' ) { pend_val = 1; }
+    } else { pend_val = 1; }
+    sessionStorage.setItem('IguanaPendValue', pend_val);
+  })
+}*/

react/src/components/addcoin/payload.js

@@ -1,4 +1,4 @@
-function checkCoinType(coin) {
+export function checkCoinType(coin) {
 	if (coin === 'USD' ||
 			coin === 'RON' ||
 			coin === 'RUB' ||
@@ -59,494 +59,456 @@ export function startCurrencyAssetChain(confpath, coin, mode) {
 	var tmpPendValue = 4;
 	var tmpIguanaRPCAuth = 'tmpIgRPCUser@' + sessionStorage.getItem('IguanaRPCAuth');
 
-	if ( checkCoinType(coin) === 'currency_ac' ) {
+	var _payloadVar = {
-		var _payloadVar = {
+		'userpass': tmpIguanaRPCAuth,
-			'userpass': tmpIguanaRPCAuth,
+		'unitval': '20',
-			'unitval': '20',
+		'zcash': 1,
-			'zcash': 1,
+		'RELAY': mode,
-			'RELAY': mode,
+		'VALIDATE': mode,
-			'VALIDATE': mode,
+		'prefetchlag': -1,
-			'prefetchlag': -1,
+		'poll': 100,
-			'poll': 100,
+		'active': 1,
-			'active': 1,
+		'agent': 'iguana',
-			'agent': 'iguana',
+		'method': 'addcoin',
-			'method': 'addcoin',
+		'startpend': tmpPendValue,
-			'startpend': tmpPendValue,
+		'endpend': tmpPendValue,
-			'endpend': tmpPendValue,
+		'services': 129,
-			'services': 129,
+		'maxpeers': 8,
-			'maxpeers': 8,
+		'newcoin': coin,
-			'newcoin': coin,
+		'name': coin,
-			'name': coin,
+		'hasheaders': 1,
-			'hasheaders': 1,
+		'useaddmultisig': 0,
-			'useaddmultisig': 0,
+		'netmagic': '2d8e7803',
+		'p2p': 13966,
+		'rpc': 13967,
+		'pubval': 60,
+		'p2shval': 85,
+		'wifval': 188,
+		'txfee_satoshis': '10000',
+		'isPoS': 0,
+		'minoutput': 10000,
+		'minconfirms': 2,
+		'genesishash': '027e3758c3a65b12aa1046462b486d0a63bfa1beae327897f56c5cfb7daaae71',
+		'protover': 170002,
+		'genesisblock': '0100000000000000000000000000000000000000000000000000000000000000000000003ba3edfd7a7b12b27ac72c3e67768f617fc81bc3888a51323a9fb8aa4b1e5e4a000000000000000000000000000000000000000000000000000000000000000029ab5f490f0f0f200b00000000000000000000000000000000000000000000000000000000000000fd4005000d5ba7cda5d473947263bf194285317179d2b0d307119c2e7cc4bd8ac456f0774bd52b0cd9249be9d40718b6397a4c7bbd8f2b3272fed2823cd2af4bd1632200ba4bf796727d6347b225f670f292343274cc35099466f5fb5f0cd1c105121b28213d15db2ed7bdba490b4cedc69742a57b7c25af24485e523aadbb77a0144fc76f79ef73bd8530d42b9f3b9bed1c135ad1fe152923fafe98f95f76f1615e64c4abb1137f4c31b218ba2782bc15534788dda2cc08a0ee2987c8b27ff41bd4e31cd5fb5643dfe862c9a02ca9f90c8c51a6671d681d04ad47e4b53b1518d4befafefe8cadfb912f3d03051b1efbf1dfe37b56e93a741d8dfd80d576ca250bee55fab1311fc7b3255977558cdda6f7d6f875306e43a14413facdaed2f46093e0ef1e8f8a963e1632dcbeebd8e49fd16b57d49b08f9762de89157c65233f60c8e38a1f503a48c555f8ec45dedecd574a37601323c27be597b956343107f8bd80f3a925afaf30811df83c402116bb9c1e5231c70fff899a7c82f73c902ba54da53cc459b7bf1113db65cc8f6914d3618560ea69abd13658fa7b6af92d374d6eca9529f8bd565166e4fcbf2a8dfb3c9b69539d4d2ee2e9321b85b331925df195915f2757637c2805e1d4131e1ad9ef9bc1bb1c732d8dba4738716d351ab30c996c8657bab39567ee3b29c6d054b711495c0d52e1cd5d8e55b4f0f0325b97369280755b46a02afd54be4ddd9f77c22272b8bbb17ff5118fedbae2564524e797bd28b5f74f7079d532ccc059807989f94d267f47e724b3f1ecfe00ec9e6541c961080d8891251b84b4480bc292f6a180bea089fef5bbda56e1e41390d7c0e85ba0ef530f7177413481a226465a36ef6afe1e2bca69d2078712b3912bba1a99b1fbff0d355d6ffe726d2bb6fbc103c4ac5756e5bee6e47e17424ebcbf1b63d8cb90ce2e40198b4f4198689daea254307e52a25562f4c1455340f0ffeb10f9d8e914775e37d0edca019fb1b9c6ef81255ed86bc51c5391e0591480f66e2d88c5f4fd7277697968656a9b113ab97f874fdd5f2465e5559533e01ba13ef4a8f7a21d02c30c8ded68e8c54603ab9c8084ef6d9eb4e92c75b078539e2ae786ebab6dab73a09e0aa9ac575bcefb29e930ae656e58bcb513f7e3c17e079dce4f05b5dbc18c2a872b22509740ebe6a3903e00ad1abc55076441862643f93606e3dc35e8d9f2caef3ee6be14d513b2e062b21d0061de3bd56881713a1a5c17f5ace05e1ec09da53f99442df175a49bd154aa96e4949decd52fed79ccf7ccbce32941419c314e374e4a396ac553e17b5340336a1a25c22f9e42a243ba5404450b650acfc826a6e432971ace776e15719515e1634ceb9a4a35061b668c74998d3dfb5827f6238ec015377e6f9c94f38108768cf6e5c8b132e0303fb5a200368f845ad9d46343035a6ff94031df8d8309415bb3f6cd5ede9c135fdabcc030599858d803c0f85be7661c88984d88faa3d26fb0e9aac0056a53f1b5d0baed713c853c4a2726869a0a124a8a5bbc0fc0ef80c8ae4cb53636aa02503b86a1eb9836fcc259823e2692d921d88e1ffc1e6cb2bde43939ceb3f32a611686f539f8f7c9f0bf00381f743607d40960f06d347d1cd8ac8a51969c25e37150efdf7aa4c2037a2fd0516fb444525ab157a0ed0a7412b2fa69b217fe397263153782c0f64351fbdf2678fa0dc8569912dcd8e3ccad38f34f23bbbce14c6a26ac24911b308b82c7e43062d180baeac4ba7153858365c72c63dcf5f6a5b08070b730adb017aeae925b7d0439979e2679f45ed2f25a7edcfd2fb77a8794630285ccb0a071f5cce410b46dbf9750b0354aae8b65574501cc69efb5b6a43444074fee116641bb29da56c2b4a7f456991fc92b2',
+		'debug': 0,
+		'seedipaddr': '78.47.196.146'
+	};
+
+	if (mode === '-1') {
+		var _payloadVarRegular = Object.assign({}, _payloadVar);
+		delete _payloadVarRegular.userpass;
+		_payloadVarRegular.RELAY = -1;
+		_payloadVarRegular.VALIDATE = 1;
+		_payloadVarRegular.startpend = 4;
+		_payloadVarRegular.endpend = 4;
+		_payloadVarRegular.path = confpath;
+
+		const USDDiff = {
+			'coin': 'USD',
+			'conf': 'USD.conf'
+		};
+		AddCoinDataPayload.USD = Object.assign({}, _payloadVarRegular, USDDiff);
+
+		const RONDiff = {
+			'coin': 'RON',
+			'conf': 'RON.conf'
+		};
+		AddCoinDataPayload.RON = Object.assign({}, _payloadVarRegular, RONDiff);
+
+		const RUBDiff = {
+			'coin': 'RUB',
+			'conf': 'RUB.conf'
+		};
+		AddCoinDataPayload.RUB = Object.assign({}, _payloadVarRegular, RUBDiff);
+
+		const SEKDiff = {
+			'coin': 'SEK',
+			'conf': 'SEK.conf'
+		};
+		AddCoinDataPayload.SEK = Object.assign({}, _payloadVarRegular, SEKDiff);
+
+		const SGDDiff = {
+			'coin': 'SGD',
+			'conf': 'SGD.conf'
+		};
+		AddCoinDataPayload.SGD = Object.assign({}, _payloadVarRegular, SGDDiff);
+
+		const THBDiff = {
+			'coin': 'THB',
+			'conf': 'THB.conf'
+		};
+		AddCoinDataPayload.THB = Object.assign({}, _payloadVarRegular, THBDiff);
+
+		const TRYDiff = {
+			'coin': 'TRY',
+			'conf': 'TRY.conf'
+		};
+		AddCoinDataPayload.TRY = Object.assign({}, _payloadVarRegular, TRYDiff);
+
+		const ZARDiff = {
+			'coin': 'ZAR',
+			'conf': 'ZAR.conf'
+		};
+		AddCoinDataPayload.ZAR = Object.assign({}, _payloadVarRegular, ZARDiff);
+
+		const CNYDiff = {
+			'coin': 'CNY',
+			'conf': 'CNY.conf'
+		};
+		AddCoinDataPayload.CNY = Object.assign({}, _payloadVarRegular, CNYDiff);
+
+		const CZKDiff = {
+			'coin': 'CZK',
+			'conf': 'CZK.conf'
+		};
+		AddCoinDataPayload.CZK = Object.assign({}, _payloadVarRegular, CZKDiff);
+
+		const DKKDiff = {
+			'coin': 'DKK',
+			'conf': 'DKK.conf'
+		};
+		AddCoinDataPayload.DKK = Object.assign({}, _payloadVarRegular, DKKDiff);
+
+		const EURDiff = {
+			'coin': 'EUR',
+			'conf': 'EUR.conf'
+		};
+		AddCoinDataPayload.EUR = Object.assign({}, _payloadVarRegular, EURDiff);
+
+		const GBPDiff = {
+			'coin': 'GBP',
+			'conf': 'GBP.conf'
+		};
+		AddCoinDataPayload.GBP = Object.assign({}, _payloadVarRegular, GBPDiff);
+
+		const HKDDiff = {
+			'coin': 'HKD',
+			'conf': 'HKD.conf'
+		};
+		AddCoinDataPayload.HKD = Object.assign({}, _payloadVarRegular, HKDDiff);
+
+		const HUFDiff = {
+			'coin': 'HUF',
+			'conf': 'HUF.conf'
+		};
+		AddCoinDataPayload.HUF = Object.assign({}, _payloadVarRegular, HUFDiff);
+
+		const IDRDiff = {
+			'coin': 'IDR',
+			'conf': 'IDR.conf'
+		};
+		AddCoinDataPayload.IDR = Object.assign({}, _payloadVarRegular, IDRDiff);
+
+		const ILSDiff = {
+			'coin': 'ILS',
+			'conf': 'ILS.conf'
+		};
+		AddCoinDataPayload.ILS = Object.assign({}, _payloadVarRegular, ILSDiff);
+
+		const INRDiff = {
+			'coin': 'INR',
+			'conf': 'INR.conf'
+		};
+		AddCoinDataPayload.INR = Object.assign({}, _payloadVarRegular, INRDiff);
+
+		const JPYDiff = {
+			'coin': 'JPY',
+			'conf': 'JPY.conf'
+		};
+		AddCoinDataPayload.JPY = Object.assign({}, _payloadVarRegular, JPYDiff);
+
+		const KRWDiff = {
+			'coin': 'KRW',
+			'conf': 'KRW.conf'
+		};
+		AddCoinDataPayload.KRW = Object.assign({}, _payloadVarRegular, KRWDiff);
+
+		const MXNDiff = {
+			'coin': 'MXN',
+			'conf': 'MXN.conf'
+		};
+		AddCoinDataPayload.MXN = Object.assign({}, _payloadVarRegular, MXNDiff);
+
+		const MYRDiff = {
+			'coin': 'MYR',
+			'conf': 'MYR.conf'
+		};
+		AddCoinDataPayload.MYR = Object.assign({}, _payloadVarRegular, MYRDiff);
+
+		const NOKDiff = {
+			'coin': 'NOK',
+			'conf': 'NOK.conf'
+		};
+		AddCoinDataPayload.NOK = Object.assign({}, _payloadVarRegular, NOKDiff);
+
+		const NZDDiff = {
+			'coin': 'NZD',
+			'conf': 'NZD.conf'
+		};
+		AddCoinDataPayload.NZD = Object.assign({}, _payloadVarRegular, NZDDiff);
+
+		const PHPDiff = {
+			'coin': 'PHP',
+			'conf': 'PHP.conf'
+		};
+		AddCoinDataPayload.PHP = Object.assign({}, _payloadVarRegular, PHPDiff);
+
+		const PLNDiff = {
+			'coin': 'PLN',
+			'conf': 'PLN.conf'
+		};
+		AddCoinDataPayload.PLN = Object.assign({}, _payloadVarRegular, PLNDiff);
+
+		const AUDDiff = {
+			'coin': 'AUD',
+			'conf': 'AUD.conf'
+		};
+		AddCoinDataPayload.AUD = Object.assign({}, _payloadVarRegular, AUDDiff);
+
+		const BGNDiff = {
+			'coin': 'BGN',
+			'conf': 'BGN.conf'
+		};
+		AddCoinDataPayload.BGN = Object.assign({}, _payloadVarRegular, BGNDiff);
+
+		const BRLDiff = {
+			'coin': 'BRL',
+			'conf': 'BRL.conf'
+		};
+		AddCoinDataPayload.BRL = Object.assign({}, _payloadVarRegular, BRLDiff);
+
+		const CADDiff = {
+			'coin': 'CAD',
+			'conf': 'CAD.conf'
+		};
+		AddCoinDataPayload.CAD = Object.assign({}, _payloadVarRegular, CADDiff);
+
+		const CHFDiff = {
+			'coin': 'CHF',
+			'conf': 'CHF.conf'
+		};
+		AddCoinDataPayload.CHF = Object.assign({}, _payloadVarRegular, CHFDiff);
+
+		return AddCoinDataPayload[coin];
+	} else {
+		const USDDiff = {
 			'netmagic': '2d8e7803',
 			'p2p': 13966,
-			'rpc': 13967,
+			'rpc': 13967
-			'pubval': 60,
+		};
-			'p2shval': 85,
+		AddCoinDataPayload.USDVar = Object.assign({}, _payloadVar, USDDiff);
-			'wifval': 188,
+
-			'txfee_satoshis': '10000',
+		const CHFDiff = {
-			'isPoS': 0,
+			'netmagic': '59fbeb5c',
-			'minoutput': 10000,
+			'p2p': 15311,
-			'minconfirms': 2,
+			'rpc': 15312
-			'genesishash': '027e3758c3a65b12aa1046462b486d0a63bfa1beae327897f56c5cfb7daaae71',
+		};
-			'protover': 170002,
+		AddCoinDataPayload.CHFVar = Object.assign({}, _payloadVar, CHFDiff);
-			'genesisblock': '0100000000000000000000000000000000000000000000000000000000000000000000003ba3edfd7a7b12b27ac72c3e67768f617fc81bc3888a51323a9fb8aa4b1e5e4a000000000000000000000000000000000000000000000000000000000000000029ab5f490f0f0f200b00000000000000000000000000000000000000000000000000000000000000fd4005000d5ba7cda5d473947263bf194285317179d2b0d307119c2e7cc4bd8ac456f0774bd52b0cd9249be9d40718b6397a4c7bbd8f2b3272fed2823cd2af4bd1632200ba4bf796727d6347b225f670f292343274cc35099466f5fb5f0cd1c105121b28213d15db2ed7bdba490b4cedc69742a57b7c25af24485e523aadbb77a0144fc76f79ef73bd8530d42b9f3b9bed1c135ad1fe152923fafe98f95f76f1615e64c4abb1137f4c31b218ba2782bc15534788dda2cc08a0ee2987c8b27ff41bd4e31cd5fb5643dfe862c9a02ca9f90c8c51a6671d681d04ad47e4b53b1518d4befafefe8cadfb912f3d03051b1efbf1dfe37b56e93a741d8dfd80d576ca250bee55fab1311fc7b3255977558cdda6f7d6f875306e43a14413facdaed2f46093e0ef1e8f8a963e1632dcbeebd8e49fd16b57d49b08f9762de89157c65233f60c8e38a1f503a48c555f8ec45dedecd574a37601323c27be597b956343107f8bd80f3a925afaf30811df83c402116bb9c1e5231c70fff899a7c82f73c902ba54da53cc459b7bf1113db65cc8f6914d3618560ea69abd13658fa7b6af92d374d6eca9529f8bd565166e4fcbf2a8dfb3c9b69539d4d2ee2e9321b85b331925df195915f2757637c2805e1d4131e1ad9ef9bc1bb1c732d8dba4738716d351ab30c996c8657bab39567ee3b29c6d054b711495c0d52e1cd5d8e55b4f0f0325b97369280755b46a02afd54be4ddd9f77c22272b8bbb17ff5118fedbae2564524e797bd28b5f74f7079d532ccc059807989f94d267f47e724b3f1ecfe00ec9e6541c961080d8891251b84b4480bc292f6a180bea089fef5bbda56e1e41390d7c0e85ba0ef530f7177413481a226465a36ef6afe1e2bca69d2078712b3912bba1a99b1fbff0d355d6ffe726d2bb6fbc103c4ac5756e5bee6e47e17424ebcbf1b63d8cb90ce2e40198b4f4198689daea254307e52a25562f4c1455340f0ffeb10f9d8e914775e37d0edca019fb1b9c6ef81255ed86bc51c5391e0591480f66e2d88c5f4fd7277697968656a9b113ab97f874fdd5f2465e5559533e01ba13ef4a8f7a21d02c30c8ded68e8c54603ab9c8084ef6d9eb4e92c75b078539e2ae786ebab6dab73a09e0aa9ac575bcefb29e930ae656e58bcb513f7e3c17e079dce4f05b5dbc18c2a872b22509740ebe6a3903e00ad1abc55076441862643f93606e3dc35e8d9f2caef3ee6be14d513b2e062b21d0061de3bd56881713a1a5c17f5ace05e1ec09da53f99442df175a49bd154aa96e4949decd52fed79ccf7ccbce32941419c314e374e4a396ac553e17b5340336a1a25c22f9e42a243ba5404450b650acfc826a6e432971ace776e15719515e1634ceb9a4a35061b668c74998d3dfb5827f6238ec015377e6f9c94f38108768cf6e5c8b132e0303fb5a200368f845ad9d46343035a6ff94031df8d8309415bb3f6cd5ede9c135fdabcc030599858d803c0f85be7661c88984d88faa3d26fb0e9aac0056a53f1b5d0baed713c853c4a2726869a0a124a8a5bbc0fc0ef80c8ae4cb53636aa02503b86a1eb9836fcc259823e2692d921d88e1ffc1e6cb2bde43939ceb3f32a611686f539f8f7c9f0bf00381f743607d40960f06d347d1cd8ac8a51969c25e37150efdf7aa4c2037a2fd0516fb444525ab157a0ed0a7412b2fa69b217fe397263153782c0f64351fbdf2678fa0dc8569912dcd8e3ccad38f34f23bbbce14c6a26ac24911b308b82c7e43062d180baeac4ba7153858365c72c63dcf5f6a5b08070b730adb017aeae925b7d0439979e2679f45ed2f25a7edcfd2fb77a8794630285ccb0a071f5cce410b46dbf9750b0354aae8b65574501cc69efb5b6a43444074fee116641bb29da56c2b4a7f456991fc92b2',
+
-			'debug': 0,
+		const CADDiff = {
-			'seedipaddr': '78.47.196.146'
+			'netmagic': '3c212763',
-		};
+			'p2p': 8719,
-
+			'rpc': 8720
-	  /*if ( mode == '-1' ) {
+		};
-	  	console.log('native');
+		AddCoinDataPayload.CADVar = Object.assign({}, _payloadVar, CADDiff);
-	    logincoinmodeinfo = 'Native';
+
-	    var confpath = Shepherd_getConf(coin);
+		const BRLDiff = {
-	    console.log(confpath[0].path);
+			'netmagic': 'ab82d10d',
-
+			'p2p': 9913,
-	    var setconfig = function() {
+			'rpc': 9914
-	      return new Promise(function(resolve, reject) {
+		};
-	        Shepherd_setConf(coin);
+		AddCoinDataPayload.BRLVar = Object.assign({}, _payloadVar, BRLDiff);
-	        var result = 'setconfig: DONE';
+
-	        console.log(result);
+		const BGNDiff = {
-	        resolve(result);
+			'netmagic': '93056ad4',
-	      });
+			'p2p': 9109,
-	    }
+			'rpc': 9110
-
+		};
-	    var startcoin = function() {
+		AddCoinDataPayload.BGNVar = Object.assign({}, _payloadVar, BGNDiff);
-	      return new Promise(function(resolve, reject) {
+
-	        Shepherd_herd('komodod', {
+		const AUDDiff = {
-	          'ac_name': coin,
+			'netmagic': '07220d4e',
-	          'ac_options': [
+			'p2p': 8044,
-	            '-daemon=0',
+			'rpc': 8045
-	            '-server',
+		};
-	            '-ac_name=' + coin,
+		AddCoinDataPayload.AUDVar = Object.assign({}, _payloadVar, AUDDiff);
-	            '-addnode=78.47.196.146'
+
-	          ]
+		const PLNDiff = {
-	        });
+			'netmagic': '46ab3c28',
-
+			'p2p': 13492,
-	        var result = 'startcoin: DONE';
+			'rpc': 13493
-	        console.log(result);
+		};
-	        resolve(result);
+		AddCoinDataPayload.PLNVar = Object.assign({}, _payloadVar, PLNDiff);
-	      });
+
-	    }
+		const PHPDiff = {
-
+			'netmagic': '21535fb6',
-	    startcoin();*/
+			'p2p': 11180,
-		//var AddCoinData = AddCoinDataPayload[coin + 'Var'];
+			'rpc': 11181
-
+		};
-		if (mode === '-1') {
+		AddCoinDataPayload.PHPVar = Object.assign({}, _payloadVar, PHPDiff);
-			var _payloadVarRegular = Object.assign({}, _payloadVar);
+
-			delete _payloadVarRegular.userpass;
+		const NZDDiff = {
-			_payloadVarRegular.RELAY = -1;
+			'netmagic': 'f579c9c2',
-			_payloadVarRegular.VALIDATE = 1;
+			'p2p': 10914,
-			_payloadVarRegular.startpend = 4;
+			'rpc': 10915
-			_payloadVarRegular.endpend = 4;
+		};
-			_payloadVarRegular.path = confpath;
+		AddCoinDataPayload.NZDVar = Object.assign({}, _payloadVar, NZDDiff);
-
+
-			const USDDiff = {
+		const NOKDiff = {
-				'coin': 'USD',
+			'netmagic': '7082c365',
-				'conf': 'USD.conf'
+			'p2p': 11587,
-			};
+			'rpc': 11588
-			AddCoinDataPayload.USD = Object.assign({}, _payloadVarRegular, USDDiff);
+		};
-
+		AddCoinDataPayload.NOKVar = Object.assign({}, _payloadVar, NOKDiff);
-			const RONDiff = {
+
-				'coin': 'RON',
+		const MYRDiff = {
-				'conf': 'RON.conf'
+			'netmagic': '3e21761f',
-			};
+			'p2p': 10687,
-			AddCoinDataPayload.RON = Object.assign({}, _payloadVarRegular, RONDiff);
+			'rpc': 10688
-
+		};
-			const RUBDiff = {
+		AddCoinDataPayload.MYRVar = Object.assign({}, _payloadVar, MYRDiff);
-				'coin': 'RUB',
+
-				'conf': 'RUB.conf'
+		const MXNDiff = {
-			};
+			'netmagic': '304c6c12',
-			AddCoinDataPayload.RUB = Object.assign({}, _payloadVarRegular, RUBDiff);
+			'p2p': 13969,
-
+			'rpc': 13970
-			const SEKDiff = {
+		};
-				'coin': 'SEK',
+		AddCoinDataPayload.MXNVar = Object.assign({}, _payloadVar, MXNDiff);
-				'conf': 'SEK.conf'
+
-			};
+		const KRWDiff = {
-			AddCoinDataPayload.SEK = Object.assign({}, _payloadVarRegular, SEKDiff);
+			'netmagic': 'c8706588',
-
+			'p2p': 14019,
-			const SGDDiff = {
+			'rpc': 14020
-				'coin': 'SGD',
+		};
-				'conf': 'SGD.conf'
+		AddCoinDataPayload.KRWVar = Object.assign({}, _payloadVar, KRWDiff);
-			};
+
-			AddCoinDataPayload.SGD = Object.assign({}, _payloadVarRegular, SGDDiff);
+		const JPYDiff = {
-
+			'netmagic': '7a55295c',
-			const THBDiff = {
+			'p2p': 13144,
-				'coin': 'THB',
+			'rpc': 13145
-				'conf': 'THB.conf'
+		};
-			};
+		AddCoinDataPayload.JPYVar = Object.assign({}, _payloadVar, JPYDiff);
-			AddCoinDataPayload.THB = Object.assign({}, _payloadVarRegular, THBDiff);
+
-
+		const INRDiff = {
-			const TRYDiff = {
+			'netmagic': '740dfc1d',
-				'coin': 'TRY',
+			'p2p': 10535,
-				'conf': 'TRY.conf'
+			'rpc': 10536
-			};
+		};
-			AddCoinDataPayload.TRY = Object.assign({}, _payloadVarRegular, TRYDiff);
+		AddCoinDataPayload.INRVar = Object.assign({}, _payloadVar, INRDiff);
-
+
-			const ZARDiff = {
+		const ILSDiff = {
-				'coin': 'ZAR',
+			'netmagic': '605fcd58',
-				'conf': 'ZAR.conf'
+			'p2p': 14637,
-			};
+			'rpc': 14638
-			AddCoinDataPayload.ZAR = Object.assign({}, _payloadVarRegular, ZARDiff);
+		};
-
+		AddCoinDataPayload.ILSVar = Object.assign({}, _payloadVar, ILSDiff);
-			const CNYDiff = {
+
-				'coin': 'CNY',
+		const IDRDiff = {
-				'conf': 'CNY.conf'
+			'netmagic': 'fee513e7',
-			};
+			'p2p': 14458,
-			AddCoinDataPayload.CNY = Object.assign({}, _payloadVarRegular, CNYDiff);
+			'rpc': 14459
-
+		};
-			const CZKDiff = {
+		AddCoinDataPayload.IDRVar = Object.assign({}, _payloadVar, IDRDiff);
-				'coin': 'CZK',
+
-				'conf': 'CZK.conf'
+		const HKDDiff = {
-			};
+			'netmagic': '57269d95',
-			AddCoinDataPayload.CZK = Object.assign({}, _payloadVarRegular, CZKDiff);
+			'p2p': 15408,
-
+			'rpc': 15409
-			const DKKDiff = {
+		};
-				'coin': 'DKK',
+		AddCoinDataPayload.HKDVar = Object.assign({}, _payloadVar, HKDDiff);
-				'conf': 'DKK.conf'
+
-			};
+		const HUFDiff = {
-			AddCoinDataPayload.DKK = Object.assign({}, _payloadVarRegular, DKKDiff);
+			'netmagic': 'a478d2af',
-
+			'p2p': 13698,
-			const EURDiff = {
+			'rpc': 13699
-				'coin': 'EUR',
+		};
-				'conf': 'EUR.conf'
+		AddCoinDataPayload.HUFVar = Object.assign({}, _payloadVar, HUFDiff);
-			};
+
-			AddCoinDataPayload.EUR = Object.assign({}, _payloadVarRegular, EURDiff);
+		const GBPDiff = {
-
+			'netmagic': '5e0ed955',
-			const GBPDiff = {
+			'p2p': 11504,
-				'coin': 'GBP',
+			'rpc': 11505
-				'conf': 'GBP.conf'
+		};
-			};
+		AddCoinDataPayload.GBPVar = Object.assign({}, _payloadVar, GBPDiff);
-			AddCoinDataPayload.GBP = Object.assign({}, _payloadVarRegular, GBPDiff);
+
-
+		const EURDiff = {
-			const HKDDiff = {
+			'netmagic': '8a3fd0bd',
-				'coin': 'HKD',
+			'p2p': 8064,
-				'conf': 'HKD.conf'
+			'rpc': 8065
-			};
+		};
-			AddCoinDataPayload.HKD = Object.assign({}, _payloadVarRegular, HKDDiff);
+		AddCoinDataPayload.EURVar = Object.assign({}, _payloadVar, EURDiff);
-
+
-			const HUFDiff = {
+		const DKKDiff = {
-				'coin': 'HUF',
+			'netmagic': 'a2c2380c',
-				'conf': 'HUF.conf'
+			'p2p': 13829,
-			};
+			'rpc': 13830
-			AddCoinDataPayload.HUF = Object.assign({}, _payloadVarRegular, HUFDiff);
+		};
-
+		AddCoinDataPayload.DKKVar = Object.assign({}, _payloadVar, DKKDiff);
-			const IDRDiff = {
+
-				'coin': 'IDR',
+		const CNYDiff = {
-				'conf': 'IDR.conf'
+			'netmagic': '2a51b987',
-			};
+			'p2p': 10383,
-			AddCoinDataPayload.IDR = Object.assign({}, _payloadVarRegular, IDRDiff);
+			'rpc': 10384
-
+		};
-			const ILSDiff = {
+		AddCoinDataPayload.CNYVar = Object.assign({}, _payloadVar, CNYDiff);
-				'coin': 'ILS',
+
-				'conf': 'ILS.conf'
+		const ZARDiff = {
-			};
+			'netmagic': '920c0484',
-			AddCoinDataPayload.ILS = Object.assign({}, _payloadVarRegular, ILSDiff);
+			'p2p': 15159,
-
+			'rpc': 15160
-			const INRDiff = {
+		};
-				'coin': 'INR',
+		AddCoinDataPayload.ZARVar = Object.assign({}, _payloadVar, ZARDiff);
-				'conf': 'INR.conf'
+
-			};
+		const TRYDiff = {
-			AddCoinDataPayload.INR = Object.assign({}, _payloadVarRegular, INRDiff);
+			'netmagic': '82b9a778',
-
+			'p2p': 13923,
-			const JPYDiff = {
+			'rpc': 13924
-				'coin': 'JPY',
+		};
-				'conf': 'JPY.conf'
+		AddCoinDataPayload.TRYVar = Object.assign({}, _payloadVar, TRYDiff);
-			};
+
-			AddCoinDataPayload.JPY = Object.assign({}, _payloadVarRegular, JPYDiff);
+		const THBDiff = {
-
+			'netmagic': 'b58aef42',
-			const KRWDiff = {
+			'p2p': 11846,
-				'coin': 'KRW',
+			'rpc': 11847
-				'conf': 'KRW.conf'
+		};
-			};
+		AddCoinDataPayload.THBVar = Object.assign({}, _payloadVar, THBDiff);
-			AddCoinDataPayload.KRW = Object.assign({}, _payloadVarRegular, KRWDiff);
+
-
+		const SGDDiff = {
-			const MXNDiff = {
+			'netmagic': 'ca255b29',
-				'coin': 'MXN',
+			'p2p': 14474,
-				'conf': 'MXN.conf'
+			'rpc': 14475
-			};
+		};
-			AddCoinDataPayload.MXN = Object.assign({}, _payloadVarRegular, MXNDiff);
+		AddCoinDataPayload.SGDVar = Object.assign({}, _payloadVar, SGDDiff);
-
+
-			const MYRDiff = {
+		const SEKDiff = {
-				'coin': 'MYR',
+			'netmagic': 'd95ad28b',
-				'conf': 'MYR.conf'
+			'p2p': 11446,
-			};
+			'rpc': 11447
-			AddCoinDataPayload.MYR = Object.assign({}, _payloadVarRegular, MYRDiff);
+		};
-
+		AddCoinDataPayload.SEKVar = Object.assign({}, _payloadVar, SEKDiff);
-			const NOKDiff = {
+
-				'coin': 'NOK',
+		const RONDiff = {
-				'conf': 'NOK.conf'
+			'netmagic': 'eb2c9500',
-			};
+			'p2p': 8674,
-			AddCoinDataPayload.NOK = Object.assign({}, _payloadVarRegular, NOKDiff);
+			'rpc': 8675
-
+		};
-			const NZDDiff = {
+		AddCoinDataPayload.RONVar = Object.assign({}, _payloadVar, RONDiff);
-				'coin': 'NZD',
+
-				'conf': 'NZD.conf'
+		const RUBDiff = {
-			};
+			'netmagic': '1b9a0eb9',
-			AddCoinDataPayload.NZD = Object.assign({}, _payloadVarRegular, NZDDiff);
+			'p2p': 8198,
-
+			'rpc': 8199
-			const PHPDiff = {
+		};
-				'coin': 'PHP',
+		AddCoinDataPayload.RUBVar = Object.assign({}, _payloadVar, RUBDiff);
-				'conf': 'PHP.conf'
+
-			};
+		const CZKDiff = {
-			AddCoinDataPayload.PHP = Object.assign({}, _payloadVarRegular, PHPDiff);
+			'netmagic': '37f7ae5a',
-
+			'p2p': 9481,
-			const PLNDiff = {
+			'rpc': 9482
-				'coin': 'PLN',
+		};
-				'conf': 'PLN.conf'
+		AddCoinDataPayload.CZKVar = Object.assign({}, _payloadVar, CZKDiff);
-			};
+
-			AddCoinDataPayload.PLN = Object.assign({}, _payloadVarRegular, PLNDiff);
+		return AddCoinDataPayload[coin + 'Var'];
-
-			const AUDDiff = {
-				'coin': 'AUD',
-				'conf': 'AUD.conf'
-			};
-			AddCoinDataPayload.AUD = Object.assign({}, _payloadVarRegular, AUDDiff);
-
-			const BGNDiff = {
-				'coin': 'BGN',
-				'conf': 'BGN.conf'
-			};
-			AddCoinDataPayload.BGN = Object.assign({}, _payloadVarRegular, BGNDiff);
-
-			const BRLDiff = {
-				'coin': 'BRL',
-				'conf': 'BRL.conf'
-			};
-			AddCoinDataPayload.BRL = Object.assign({}, _payloadVarRegular, BRLDiff);
-
-			const CADDiff = {
-				'coin': 'CAD',
-				'conf': 'CAD.conf'
-			};
-			AddCoinDataPayload.CAD = Object.assign({}, _payloadVarRegular, CADDiff);
-
-			const CHFDiff = {
-				'coin': 'CHF',
-				'conf': 'CHF.conf'
-			};
-			AddCoinDataPayload.CHF = Object.assign({}, _payloadVarRegular, CHFDiff);
-
-			return AddCoinDataPayload[coin];
-		} else {
-			const USDDiff = {
-				'netmagic': '2d8e7803',
-				'p2p': 13966,
-				'rpc': 13967
-			};
-			AddCoinDataPayload.USDVar = Object.assign({}, _payloadVar, USDDiff);
-
-			const CHFDiff = {
-				'netmagic': '59fbeb5c',
-				'p2p': 15311,
-				'rpc': 15312
-			};
-			AddCoinDataPayload.CHFVar = Object.assign({}, _payloadVar, CHFDiff);
-
-			const CADDiff = {
-				'netmagic': '3c212763',
-				'p2p': 8719,
-				'rpc': 8720
-			};
-			AddCoinDataPayload.CADVar = Object.assign({}, _payloadVar, CADDiff);
-
-			const BRLDiff = {
-				'netmagic': 'ab82d10d',
-				'p2p': 9913,
-				'rpc': 9914
-			};
-			AddCoinDataPayload.BRLVar = Object.assign({}, _payloadVar, BRLDiff);
-
-			const BGNDiff = {
-				'netmagic': '93056ad4',
-				'p2p': 9109,
-				'rpc': 9110
-			};
-			AddCoinDataPayload.BGNVar = Object.assign({}, _payloadVar, BGNDiff);
-
-			const AUDDiff = {
-				'netmagic': '07220d4e',
-				'p2p': 8044,
-				'rpc': 8045
-			};
-			AddCoinDataPayload.AUDVar = Object.assign({}, _payloadVar, AUDDiff);
-
-			const PLNDiff = {
-				'netmagic': '46ab3c28',
-				'p2p': 13492,
-				'rpc': 13493
-			};
-			AddCoinDataPayload.PLNVar = Object.assign({}, _payloadVar, PLNDiff);
-
-			const PHPDiff = {
-				'netmagic': '21535fb6',
-				'p2p': 11180,
-				'rpc': 11181
-			};
-			AddCoinDataPayload.PHPVar = Object.assign({}, _payloadVar, PHPDiff);
-
-			const NZDDiff = {
-				'netmagic': 'f579c9c2',
-				'p2p': 10914,
-				'rpc': 10915
-			};
-			AddCoinDataPayload.NZDVar = Object.assign({}, _payloadVar, NZDDiff);
-
-			const NOKDiff = {
-				'netmagic': '7082c365',
-				'p2p': 11587,
-				'rpc': 11588
-			};
-			AddCoinDataPayload.NOKVar = Object.assign({}, _payloadVar, NOKDiff);
-
-			const MYRDiff = {
-				'netmagic': '3e21761f',
-				'p2p': 10687,
-				'rpc': 10688
-			};
-			AddCoinDataPayload.MYRVar = Object.assign({}, _payloadVar, MYRDiff);
-
-			const MXNDiff = {
-				'netmagic': '304c6c12',
-				'p2p': 13969,
-				'rpc': 13970
-			};
-			AddCoinDataPayload.MXNVar = Object.assign({}, _payloadVar, MXNDiff);
-
-			const KRWDiff = {
-				'netmagic': 'c8706588',
-				'p2p': 14019,
-				'rpc': 14020
-			};
-			AddCoinDataPayload.KRWVar = Object.assign({}, _payloadVar, KRWDiff);
-
-			const JPYDiff = {
-				'netmagic': '7a55295c',
-				'p2p': 13144,
-				'rpc': 13145
-			};
-			AddCoinDataPayload.JPYVar = Object.assign({}, _payloadVar, JPYDiff);
-
-			const INRDiff = {
-				'netmagic': '740dfc1d',
-				'p2p': 10535,
-				'rpc': 10536
-			};
-			AddCoinDataPayload.INRVar = Object.assign({}, _payloadVar, INRDiff);
-
-			const ILSDiff = {
-				'netmagic': '605fcd58',
-				'p2p': 14637,
-				'rpc': 14638
-			};
-			AddCoinDataPayload.ILSVar = Object.assign({}, _payloadVar, ILSDiff);
-
-			const IDRDiff = {
-				'netmagic': 'fee513e7',
-				'p2p': 14458,
-				'rpc': 14459
-			};
-			AddCoinDataPayload.IDRVar = Object.assign({}, _payloadVar, IDRDiff);
-
-			const HKDDiff = {
-				'netmagic': '57269d95',
-				'p2p': 15408,
-				'rpc': 15409
-			};
-			AddCoinDataPayload.HKDVar = Object.assign({}, _payloadVar, HKDDiff);
-
-			const HUFDiff = {
-				'netmagic': 'a478d2af',
-				'p2p': 13698,
-				'rpc': 13699
-			};
-			AddCoinDataPayload.HUFVar = Object.assign({}, _payloadVar, HUFDiff);
-
-			const GBPDiff = {
-				'netmagic': '5e0ed955',
-				'p2p': 11504,
-				'rpc': 11505
-			};
-			AddCoinDataPayload.GBPVar = Object.assign({}, _payloadVar, GBPDiff);
-
-			const EURDiff = {
-				'netmagic': '8a3fd0bd',
-				'p2p': 8064,
-				'rpc': 8065
-			};
-			AddCoinDataPayload.EURVar = Object.assign({}, _payloadVar, EURDiff);
-
-			const DKKDiff = {
-				'netmagic': 'a2c2380c',
-				'p2p': 13829,
-				'rpc': 13830
-			};
-			AddCoinDataPayload.DKKVar = Object.assign({}, _payloadVar, DKKDiff);
-
-			const CNYDiff = {
-				'netmagic': '2a51b987',
-				'p2p': 10383,
-				'rpc': 10384
-			};
-			AddCoinDataPayload.CNYVar = Object.assign({}, _payloadVar, CNYDiff);
-
-			const ZARDiff = {
-				'netmagic': '920c0484',
-				'p2p': 15159,
-				'rpc': 15160
-			};
-			AddCoinDataPayload.ZARVar = Object.assign({}, _payloadVar, ZARDiff);
-
-			const TRYDiff = {
-				'netmagic': '82b9a778',
-				'p2p': 13923,
-				'rpc': 13924
-			};
-			AddCoinDataPayload.TRYVar = Object.assign({}, _payloadVar, TRYDiff);
-
-			const THBDiff = {
-				'netmagic': 'b58aef42',
-				'p2p': 11846,
-				'rpc': 11847
-			};
-			AddCoinDataPayload.THBVar = Object.assign({}, _payloadVar, THBDiff);
-
-			const SGDDiff = {
-				'netmagic': 'ca255b29',
-				'p2p': 14474,
-				'rpc': 14475
-			};
-			AddCoinDataPayload.SGDVar = Object.assign({}, _payloadVar, SGDDiff);
-
-			const SEKDiff = {
-				'netmagic': 'd95ad28b',
-				'p2p': 11446,
-				'rpc': 11447
-			};
-			AddCoinDataPayload.SEKVar = Object.assign({}, _payloadVar, SEKDiff);
-
-			const RONDiff = {
-				'netmagic': 'eb2c9500',
-				'p2p': 8674,
-				'rpc': 8675
-			};
-			AddCoinDataPayload.RONVar = Object.assign({}, _payloadVar, RONDiff);
-
-			const RUBDiff = {
-				'netmagic': '1b9a0eb9',
-				'p2p': 8198,
-				'rpc': 8199
-			};
-			AddCoinDataPayload.RUBVar = Object.assign({}, _payloadVar, RUBDiff);
-
-			const CZKDiff = {
-				'netmagic': '37f7ae5a',
-				'p2p': 9481,
-				'rpc': 9482
-			};
-			AddCoinDataPayload.CZKVar = Object.assign({}, _payloadVar, CZKDiff);
-
-			return AddCoinDataPayload[coin + 'Var'];
-		}
 	}
 }

react/src/components/app/app.js

@@ -7,6 +7,9 @@ function mapStateToProps(state) {
   return {
     toaster: state.toaster,
     AddCoin: state.AddCoin,
+    Main: state.Main,
+    Dashboard: state.Dashboard,
+    ActiveCoin: state.ActiveCoin,
   };
 }
 

react/src/components/dashboard/atomic.js

@@ -0,0 +1,162 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+/*import { dashboardChangeSection, toggleAddcoinModal, logout } from '../../actions/actionCreators';
+import Store from '../../store';*/
+
+class Atomic extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+    };
+  }
+
+  render() {
+    return (
+      <div className="page" data-animsition-in="fade-in" data-animsition-out="fade-out" style={{marginLeft: '0'}}>
+        <div className="page-content" id="section-iguana-atomic-explorer">
+          <div className="row" id="atomic-explorer" data-plugin="masonry">
+            <div className="col-xlg-12 col-md-12">
+              <h4 className="font-size-14 text-uppercase">Atomic Explorer</h4>
+              <div className="panel panel-bordered">
+                <div className="panel-body">
+                  <div className="col-sm-4 col-xs-12">
+                    <div className="form-group">
+                      <select className="form-control form-material" id="atomic_explorer_select_coin_options">
+                        <option value="-">{translate('INDEX.SELECT_COIN')}</option>
+                        <optgroup label="Crypto Currencies">
+                          <option value="ANC|full" data-full-mode="true">AnonCoin (ANC)</option>
+                          <option value="BTC|full|basilisk">Bitcoin (BTC)</option>
+                          <option value="BTCD|full">BitcoinDark (BTCD)</option>
+                          <option value="BTM|full">Bitmark (BTM)</option>
+                          <option value="CARB|full">Carboncoin (CARB)</option>
+                          <option value="DGB|full">Digibyte (DGB)</option>
+                          <option value="DOGE|full">Dogecoin (DOGE)</option>
+                          <option value="FRK|full">Franko (FRK)</option>
+                          <option value="GMC|full">Gamerscoin (GMC)</option>
+                          <option value="KMD|basilisk|native">Komodo (KMD)</option>
+                          <option value="LTC|full">Litecoin (LTC)</option>
+                          <option value="MZC|full">MazaCoin (MZC)</option>
+                          <option value="SYS|full">SysCoin (SYS)</option>
+                          <option value="UNO|full">Unobtanium (UNO)</option>
+                          <option value="ZEC|full">Zcash (ZEC)</option>
+                          <option value="ZET|full">Zetacoin (ZET)</option>
+                        </optgroup>
+                        <optgroup label="Assetchains">
+                          <option value="BET|basilisk|native">BET (BET)</option>
+                          <option value="BOTS|basilisk|native">BOTS (BOTS)</option>
+                          <option value="CEAL|basilisk|native">CEAL NET (CEAL)</option>
+                          <option value="CRYPTO|basilisk|native">CRYPTO (CRYPTO)</option>
+                          <option value="HOD|basilisk|native">HODL (HODL)</option>
+                          <option value="DEX|basilisk|native">InstantDEX (DEX)</option>
+                          <option value="JUMBLR|basilisk|native">JUMBLR (JUMBLR)</option>
+                          <option value="KV|basilisk|native">KV (KV)</option>
+                          <option value="MGW|basilisk|native">MultiGateway (MGW)</option>
+                          <option value="MVP|basilisk|native">MVP Lineup (MVP)</option>
+                          <option value="PANGEA|basilisk|native">PANGEA (PANGEA)</option>
+                          <option value="REVS|basilisk|native">REVS (REVS)</option>
+                          <option value="SHARK|basilisk|native">SHARK (SHARK)</option>
+                          <option value="MESH|basilisk|native">SpaceMesh (MESH)</option>
+                          <option value="SUPERNET|basilisk|native">SUPERNET (SUPERNET)</option>
+                          <option value="WIRELESS|basilisk|native">WIRELESS (WIRELESS)</option>
+                        </optgroup>
+                        <optgroup label="Fiat Currencies">
+                          <option value="AUD|basilisk|native">Australian Dollar (AUD)</option>
+                          <option value="BRL|basilisk|native">Brazilian Real (BRL)</option>
+                          <option value="GBP|basilisk|native">British Pound (GBP)</option>
+                          <option value="BGN|basilisk|native">Bulgarian Lev (BGN)</option>
+                          <option value="CAD|basilisk|native">Canadian Dollar (CAD)</option>
+                          <option value="HRK|basilisk|native">Croatian Kuna (HRK)</option>
+                          <option value="CZK|basilisk|native">Czech Koruna (CZK)</option>
+                          <option value="CNY|basilisk|native">Chinese Yuan (CNY)</option>
+                          <option value="DKK|basilisk|native">Danish Krone (DKK)</option>
+                          <option value="EUR|basilisk|native">Euro (EUR)</option>
+                          <option value="HKD|basilisk|native">Hong Kong Dollar (HKD)</option>
+                          <option value="HUF|basilisk|native">Hungarian Forint (HUF)</option>
+                          <option value="INR|basilisk|native">Indian Rupee (INR)</option>
+                          <option value="IDR|basilisk|native">Indonesian Rupiah (IDR)</option>
+                          <option value="ILS|basilisk|native">Israeli Shekel (ILS)</option>
+                          <option value="JPY|basilisk|native">Japanese Yen (JPY)</option>
+                          <option value="KRW|basilisk|native">Korean Won (KRW)</option>
+                          <option value="MYR|basilisk|native">Malaysian Ringgit (MYR)</option>
+                          <option value="MXN|basilisk|native">Mexican peso (MXN)</option>
+                          <option value="NZD|basilisk|native">New Zealand Dollar (NZD)</option>
+                          <option value="NOK|basilisk|native">Norwegian Krone (NOK)</option>
+                          <option value="PHP|basilisk|native">Philippine Peso (PHP)</option>
+                          <option value="PLN|basilisk|native">Polish Zloty (PLN)</option>
+                          <option value="RON|basilisk|native">Romanian Leu (RON)</option>
+                          <option value="RUB|basilisk|native">Russian Ruble (RUB)</option>
+                          <option value="SGD|basilisk|native">Singapore Dollar (SGD)</option>
+                          <option value="ZAR|basilisk|native">South African Rand (ZAR)</option>
+                          <option value="SEK|basilisk|native">Swedish Krona (SEK)</option>
+                          <option value="CHF|basilisk|native">Swiss Franc (CHF)</option>
+                          <option value="THB|basilisk|native">Thai Baht (THB)</option>
+                          <option value="TRY|basilisk|native">Turkish Lira (TRY)</option>
+                          <option value="USD|basilisk|native">US Dollar (USD)</option>
+                        </optgroup>
+                      </select>
+                    </div>
+                  </div>
+                  <div className="col-sm-4 col-xs-12" style={{textAlign: 'center'}}>
+                    <select className="form-control form-material" id="atomic_explorer_select_command_options">
+                      <option value="">-Select Command-</option>
+                      <option value="history">Address History</option>
+                      <option value="getbalance">Get Balance</option>
+                      <option value="listunspent">List Unspent</option>
+                      <option value="txid">Transaction ID</option>
+                      <option value="blockash">Block Hash</option>
+                      <option value="chaintip">Chain Tip</option>
+                      <option value="activehandle">Active Handle</option>
+                      <option value="gettransaction">Get Transaction</option>
+                      <option value="dex_alladdresses">DEX All Addresses</option>
+                      <option value="dex_importaddress">DEX Import Address</option>
+                      <option value="dex_checkaddress">DEX Check Address</option>
+                      <option value="dex_validateaddress">DEX Validate Address</option>
+                      <option value="dex_getinfo">DEX Get Info</option>
+                      <option value="dex_getnotaries">DEX Get Notaries</option>
+                      <option value="dex_getbestblockhash">DEX Get Best Block Hash</option>
+                      <option value="dex_getblockhash">DEX Get Block Hash</option>
+                      <option value="dex_getblock">DEX Get Block</option>
+                      <option value="dex_gettxin">DEX Get txin</option>
+                      <option value="dex_gettxout">DEX Get txout</option>
+                      <option value="dex_gettransaction">DEX Get Transaction</option>
+                      <option value="dex_getbalance">DEX Get Balance</option>
+                      <option value="dex_getsupply">DEX Get Supply</option>
+                      <option value="dex_listtransactions">DEX List Transactions</option>
+                      <option value="dex_listtransactions2">DEX List Transactions 2</option>
+                      <option value="dex_listspent">DEX List Spent</option>
+                      <option value="dex_listunspent">DEX List Unspent</option>
+                      <option value="dex_listunspent2">DEX List Unspent 2</option>
+                      <option value="dex_sendrawtransaction">DEX Send Raw Transaction</option>
+                      <option value="basilisk_refresh">Basilisk Refresh</option>
+                      <option value="jumblr_status">Jumbler Status</option>
+                    </select>
+                  </div>
+                  <div className="col-sm-4 col-xs-12" style={{textAlign: 'center'}}>
+                    <input type="text" className="form-control" id="atomic_explorer_input_data" name="atomic_explorer_input_data" placeholder="addr, txid, blockash etc." />
+                  </div>
+                  <div className="col-sm-12 col-xs-12" style={{textAlign: 'center'}}>
+                    <button type="button" className="btn btn-primary waves-effect waves-light" data-toggle="modal" data-dismiss="modal" id="atomic_explorer_getcoinpeers_btn">Submit</button>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div className="col-xlg-4 col-md-12">
+              <div className="panel">
+                <div className="panel-heading">
+                  <h3 className="panel-title">Raw Output</h3>
+                </div>
+                <div className="panel-body">
+                  <div className="tab-content">
+                    <pre id="atomic-explorer-commands-output"></pre>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
+
+export default Atomic;

react/src/components/dashboard/coinTile.js

@@ -0,0 +1,383 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+import CoinTileItem from './coinTileItem';
+
+class CoinTile extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+    };
+    this.renderTiles = this.renderTiles.bind(this);
+  }
+
+  renderTiles() {
+    const modes = [
+      'native',
+      'basilisk',
+      'full'
+    ];
+    const allCoins = this.props.Main.coins;
+    var items = [];
+    console.log('tiles', this.props.Main.coins);
+
+    if (this.props.Main && this.props.Main.coins) {
+      modes.map(function(mode) {
+        allCoins[mode].map(function(coin) {
+          console.log(coin);
+          var coinlogo = '',
+              coinname = '',
+              modecode = '',
+              modetip = '',
+              modecolor = '';
+
+          switch (mode) {
+            case 'native':
+              modecode = 'Native';
+              modetip = 'Native';
+              modecolor = 'primary';
+              break;
+            case 'basilisk':
+              modecode = 'Basilisk';
+              modetip = 'Basilisk';
+              modecolor = 'info';
+              break;
+            case 'full':
+              modecode = 'Full';
+              modetip = 'Full';
+              modecolor = 'success';
+              break;
+            case 'virtual':
+              modecode = 'Virtual';
+              modetip = 'Virtual';
+              modecolor = 'danger';
+              break;
+            case 'notarychains':
+              modecode = 'Notarychains';
+              modetip = 'Notarychains';
+              modecolor = 'dark';
+              break;
+          }
+
+          switch (coin) {
+            case 'BTC':
+              coinlogo = 'bitcoin';
+              coinname = 'Bitcoin';
+              break;
+            case 'BTCD':
+              coinlogo = 'bitcoindark';
+              coinname = 'BitcoinDark';
+              break;
+            case 'LTC':
+              coinlogo = 'litecoin';
+              coinname = 'Litecoin';
+              break;
+            case 'VPN':
+              coinlogo = 'vpncoin';
+              coinname = 'VPNcoin';
+              break;
+            case 'SYS':
+              coinlogo = 'syscoin';
+              coinname = 'Syscoin';
+              break;
+            case 'ZEC':
+              coinlogo = 'zcash';
+              coinname = 'Zcash';
+              break;
+            case 'NMC':
+              coinlogo = 'namecoin';
+              coinname = 'Namecoin';
+              break;
+            case 'DEX':
+              coinlogo = 'dex';
+              coinname = 'InstantDEX';
+              break;
+            case 'DOGE':
+              coinlogo = 'dogecoin';
+              coinname = 'Dogecoin';
+              break;
+            case 'DGB':
+              coinlogo = 'digibyte';
+              coinname = 'Digibyte';
+              break;
+            case 'MZC':
+              coinlogo = 'mazacoin';
+              coinname = 'Mazacoin';
+              break;
+            case 'UNO':
+              coinlogo = 'unobtanium';
+              coinname = 'Unobtanium';
+              break;
+            case 'ZET':
+              coinlogo = 'zetacoin';
+              coinname = 'Zetacoin';
+              break;
+            case 'KMD':
+              coinlogo = 'komodo';
+              coinname = 'Komodo';
+              break;
+            case 'BTM':
+              coinlogo = 'bitmark';
+              coinname = 'Bitmark';
+              break;
+            case 'CARB':
+              coinlogo = 'carboncoin';
+              coinname = 'Carboncoin';
+              break;
+            case 'ANC':
+              coinlogo = 'anoncoin';
+              coinname = 'AnonCoin';
+              break;
+            case 'FRK':
+              coinlogo = 'franko';
+              coinname = 'Franko';
+              break;
+            case 'GAME':
+              coinlogo = 'GAME';
+              coinname = 'GameCredits';
+              break;
+            case 'SUPERNET':
+              coinlogo = 'SUPERNET';
+              coinname = 'SUPERNET';
+              break;
+            case 'REVS':
+              coinlogo = 'REVS';
+              coinname = 'REVS';
+              break;
+            case 'WLC':
+              coinlogo = 'WLC';
+              coinname = 'WIRELESS';
+              break;
+            case 'PANGEA':
+              coinlogo = 'PANGEA';
+              coinname = 'PANGEA';
+              break;
+            case 'JUMBLR':
+              coinlogo = 'JUMBLR';
+              coinname = 'JUMBLR';
+              break;
+            case 'BET':
+              coinlogo = 'BET';
+              coinname = 'BET';
+              break;
+            case 'CRYPTO':
+              coinlogo = 'CRYPTO';
+              coinname = 'CRYPTO';
+              break;
+            case 'HODL':
+              coinlogo = 'HODL';
+              coinname = 'HODL';
+              break;
+            case 'SHARK':
+              coinlogo = 'SHARK';
+              coinname = 'SHARK';
+              break;
+            case 'BOTS':
+              coinlogo = 'BOTS';
+              coinname = 'BOTS';
+              break;
+            case 'MGW':
+              coinlogo = 'MGW';
+              coinname = 'MultiGateway';
+              break;
+            case 'MVP':
+              coinlogo = 'MVP';
+              coinname = 'MVP Lineup';
+              break;
+            case 'KV':
+              coinlogo = 'KV';
+              coinname = 'KV';
+              break;
+            case 'CEAL':
+              coinlogo = 'CEAL';
+              coinname = 'CEAL NET';
+              break;
+            case 'MESH':
+              coinlogo = 'MESH';
+              coinname = 'SpaceMesh';
+              break;
+            case 'USD':
+              coinlogo = 'usd';
+              coinname = 'US Dollar';
+              break;
+            case 'RON':
+              coinlogo = 'RON';
+              coinname = 'Romanian Leu';
+              break;
+            case 'EUR':
+              coinlogo = 'EUR';
+              coinname = 'Euro';
+              break;
+            case 'JPY':
+              coinlogo = 'JPY';
+              coinname = 'Japanese Yen';
+              break;
+            case 'GBP':
+              coinlogo = 'GBP';
+              coinname = 'British Pound';
+              break;
+            case 'AUD':
+              coinlogo = 'AUD';
+              coinname = 'Australian Dollar';
+              break;
+            case 'CAD':
+              coinlogo = 'CAD';
+              coinname = 'Canadian Dollar';
+              break;
+            case 'CHF':
+              coinlogo = 'CHF';
+              coinname = 'Swiss Franc';
+              break;
+            case 'NZD':
+              coinlogo = 'NZD';
+              coinname = 'New Zealand Dollar';
+              break;
+            case 'CNY':
+              coinlogo = 'CNY';
+              coinname = 'Chinese Yuan';
+              break;
+            case 'RUB':
+              coinlogo = 'RUB';
+              coinname = 'Russian Ruble';
+              break;
+            case 'MXN':
+              coinlogo = 'MXN';
+              coinname = 'Mexican peso';
+              break;
+            case 'BRL':
+              coinlogo = 'BRL';
+              coinname = 'Brazilian Real';
+              break;
+            case 'INR':
+              coinlogo = 'INR';
+              coinname = 'Indian Rupee';
+              break;
+            case 'HKD':
+              coinlogo = 'HKD';
+              coinname = 'Hong Kong Dollar';
+              break;
+            case 'TRY':
+              coinlogo = 'TRY';
+              coinname = 'Turkish Lira';
+              break;
+            case 'ZAR':
+              coinlogo = 'ZAR';
+              coinname = 'South African Rand';
+              break;
+            case 'PLN':
+              coinlogo = 'PLN';
+              coinname = 'Polish Zloty';
+              break;
+            case 'NOK':
+              coinlogo = 'NOK';
+              coinname = 'Norwegian Krone';
+              break;
+            case 'SEK':
+              coinlogo = 'SEK';
+              coinname = 'Swedish Krona';
+              break;
+            case 'DKK':
+              coinlogo = 'DKK';
+              coinname = 'Danish Krone';
+              break;
+            case 'CZK':
+              coinlogo = 'CZK';
+              coinname = 'Czech Koruna';
+              break;
+            case 'HUF':
+              coinlogo = 'HUF';
+              coinname = 'Hungarian Forint';
+              break;
+            case 'ILS':
+              coinlogo = 'ILS';
+              coinname = 'Israeli Shekel';
+              break;
+            case 'KRW':
+              coinlogo = 'KRW';
+              coinname = 'Korean Won';
+              break;
+            case 'MYR':
+              coinlogo = 'MYR';
+              coinname = 'Malaysian Ringgit';
+              break;
+            case 'PHP':
+              coinlogo = 'PHP';
+              coinname = 'Philippine Peso';
+              break;
+            case 'SGD':
+              coinlogo = 'SGD';
+              coinname = 'Singapore Dollar';
+              break;
+            case 'THB':
+              coinlogo = 'THB';
+              coinname = 'Thai Baht';
+              break;
+            case 'BGN':
+              coinlogo = 'BGN';
+              coinname = 'Bulgarian Lev';
+              break;
+            case 'IDR':
+              coinlogo = 'IDR';
+              coinname = 'Indonesian Rupiah';
+              break;
+            case 'HRK':
+              coinlogo = 'HRK';
+              coinname = 'Croatian Kuna';
+              break;
+          }
+
+          items.push({
+            coinlogo,
+            coinname,
+            coin,
+            mode,
+            modecolor,
+            modetip,
+            modecode,
+          });
+        });
+      });
+    }
+
+    return (
+      items.map((item, i) =>
+        <CoinTileItem key={i} i={i} item={item} {...this.props} />)
+    );
+  }
+
+  render() {
+    return (
+      <div className="page-aside" style={{paddingTop: '80px'}}>
+        <div className="page-aside-switch">
+          <i className="icon md-chevron-left" aria-hidden="true"></i>
+          <i className="icon md-chevron-right" aria-hidden="true"></i>
+        </div>
+        <div className="page-aside-inner">
+          <div className="search-wallet-widgets panel" style={{display: 'none'}}>
+            <div className="panel-heading">
+              <div className="panel-actions">
+                <div className="input-search input-group-sm">
+                  <button type="submit" className="input-search-btn">
+                    <i className="icon md-search" aria-hidden="true"></i>
+                  </button>
+                  <input type="text" className="form-control" name="" placeholder="Search..." disabled />
+                </div>
+              </div>
+              <h3 className="panel-title">{translate('INDEX.ACTIVE_COINS')}</h3>
+            </div>
+          </div>
+          <div className="wallet-widgets-list" data-plugin="pageAsideScroll">
+            <div data-role="container">
+              <div data-role="content">
+                <div className="list-group row wallet-widgets-row">
+                  {this.renderTiles()}
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
+
+export default CoinTile;

react/src/components/dashboard/coinTileItem.js

@@ -0,0 +1,36 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+import { dashboardChangeActiveCoin, iguanaActiveHandle } from '../../actions/actionCreators';
+import Store from '../../store';
+
+class CoinTileItem extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+    };
+  }
+
+  dashboardChangeActiveCoin(coin, mode) {
+    Store.dispatch(dashboardChangeActiveCoin(coin, mode));
+    Store.dispatch(iguanaActiveHandle(true));
+  }
+
+  render() {
+    const { item } = this.props;
+    return (
+      <div className="list-group-item col-xlg-6 col-lg-12 wallet-widgets-info" data-edexcoincode="{item.coin}">
+        <div className={this.props.ActiveCoin.coin === item.coin ? 'widget widget-shadow active' : 'widget widget-shadow'}>
+          <div className="widget-content text-center bg-white padding-20 edexcoin-logo" data-edexcoincode="{item.coin}" data-edexcoinmodecode="{item.modecode}" data-edexcoinname="{item.coinname}" onClick={() => this.dashboardChangeActiveCoin(item.coin, item.mode)}>
+            <a className="avatar margin-bottom-5" href="javascript:void(0)" id="edexcoin-logo">
+              <img className="img-responsive" src={'assets/images/cryptologo/' + item.coinlogo + '.png'} alt="{item.coinname}"/>
+              <span className={'badge up badge-' + item.modecolor} id="basfull" data-edexcoincode="{item.coin}" data-toggle="tooltip" data-placement="top" data-original-title="{item.modetip}">{item.modecode}</span>
+            </a>
+            <div className="coin-name">{item.coinname} ({item.coinlogo})</div>
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
+
+export default CoinTileItem;

react/src/components/dashboard/dashboard.js

@@ -0,0 +1,56 @@
+import React from 'react';
+import Navbar from './navbar';
+import CoinTile from './coinTile';
+import EDEX from './edex';
+import WalletsBalance from './walletsBalance';
+import WalletsHeader from './walletsHeader';
+import WalletsProgress from './walletsProgress';
+import WalletsNav from './walletsNav';
+import SendCoin from './sendCoin';
+import WalletsData from './walletsData';
+import Atomic from './atomic';
+
+class Dashboard extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+    };
+    this.renderDashboard = this.renderDashboard.bind(this);
+  }
+
+  renderDashboard() {
+    document.body.className = 'page-login';
+    //            <WalletsHeader {...this.props.ActiveCoin} />
+    return (
+      <div style={{height: '100%'}}>
+        <div className={this.props.Dashboard.activeSection === 'wallets' ? 'page-main' : ''} id="section-dashboard" data-edexcoin="COIN">
+          <Navbar {...this.props} />
+          <div className={this.props.Dashboard.activeSection === 'wallets' ? 'show' : 'hide'}>
+            <CoinTile {...this.props} />
+            <WalletsNav {...this.props} />
+            <WalletsProgress {...this.props} />
+            <WalletsBalance {...this.props.ActiveCoin} />
+            <SendCoin {...this.props.ActiveCoin} />
+            <WalletsData {...this.props.ActiveCoin} />
+          </div>
+          <div className={this.props.Dashboard.activeSection === 'edex' ? 'show' : 'hide'}>
+            <EDEX {...this.props} />
+          </div>
+          <div className={this.props.Dashboard.activeSection === 'atomic' ? 'show' : 'hide'}>
+            <Atomic {...this.props} />
+          </div>
+        </div>
+      </div>
+    );
+  }
+
+  render() {
+    if (this.props && this.props.Main && this.props.Main.isLoggedIn) {
+      return this.renderDashboard();
+    } else {
+      return null;
+    }
+  }
+}
+
+export default Dashboard;

react/src/components/dashboard/dashboard.scss

@@ -0,0 +1,3 @@
+.dashboard {
+
+}

react/src/components/dashboard/edex.js

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

react/src/components/dashboard/navbar.js

@@ -0,0 +1,133 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+import { dashboardChangeSection, toggleAddcoinModal, logout } from '../../actions/actionCreators';
+import Store from '../../store';
+
+class Navbar extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      openDropMenu: false,
+    };
+    this.openDropMenu = this.openDropMenu.bind(this);
+    this.logout = this.logout.bind(this);
+  }
+
+  openDropMenu() {
+    this.setState(Object.assign({}, this.state, {
+      openDropMenu: !this.state.openDropMenu,
+    }));
+  }
+
+  toggleAddCoinModal() {
+    Store.dispatch(toggleAddcoinModal(true, false));
+  }
+
+  dashboardChangeSection(sectionName) {
+    Store.dispatch(dashboardChangeSection(sectionName));
+  }
+
+  logout() {
+    Store.dispatch(logout());
+  }
+
+  render() {
+    return (
+      <nav className="site-navbar navbar navbar-default navbar-fixed-top navbar-mega" role="navigation">
+        <div className="navbar-header">
+          <button type="button" className="navbar-toggle hamburger hamburger-close navbar-toggle-left hided"
+          data-toggle="menubar">
+            <span className="sr-only">{translate('INDEX.TOGGLE_NAV')}</span>
+            <span className="hamburger-bar"></span>
+          </button>
+          <button type="button" className="navbar-toggle collapsed" data-target="#site-navbar-collapse"
+          data-toggle="collapse">
+            <i className="icon md-more" aria-hidden="true"></i>
+          </button>
+          <div className="navbar-brand navbar-brand-center site-gridmenu-toggle" data-toggle="gridmenu">
+            <img className="navbar-brand-logo hidden-xs" src="assets/images/easydex-logo-dashboard.png" title="SuperNET Igauana" />
+            <img className="navbar-brand-logo hidden-md hidden-sm hidden-lg" src="assets/images/easydex-logo-dashboard-white.png" title="SuperNET Igauana white" />
+            <span className="navbar-brand-text hidden-xs"></span>
+          </div>
+          <button type="button" className="navbar-toggle collapsed" data-target="#site-navbar-search"
+          data-toggle="collapse">
+            <span className="sr-only">{translate('INDEX.TOGGLE_SEARCH')}</span>
+            <i className="icon md-search" aria-hidden="true"></i>
+          </button>
+        </div>
+        <div className="navbar-container container-fluid">
+          <div className="collapse navbar-collapse navbar-collapse-toolbar" id="site-navbar-collapse">
+            <ul className="nav navbar-toolbar">
+              <li className="hidden-float" id="toggleMenubar" style={{ display: 'none' }}>
+                <a data-toggle="menubar" href="#" role="button">
+                  <i className="icon hamburger hamburger-arrow-left">
+                    <span className="sr-only">{translate('INDEX.TOGGLE_MENUBAR')}</span>
+                    <span className="hamburger-bar"></span>
+                  </i>
+                </a>
+              </li>
+              <li className="active nav-top-menu">
+                <a href="javascript:void(0)" id="nav-dashboard" onClick={() => this.dashboardChangeSection('wallets')}>
+                  <i className="site-menu-icon" aria-hidden="true"></i> {translate('INDEX.WALLETS')}
+                </a>
+              </li>
+              <li className="nav-top-menu">
+                <a href="javascript:void(0)" id="nav-easydex" onClick={() => this.dashboardChangeSection('edex')}>
+                  <i className="site-menu-icon" aria-hidden="true"></i> EasyDEX
+                </a>
+              </li>
+              <li className="nav-top-menu">
+                <a href="javascript:void(0)" id="nav-jumblr" onClick={() => this.dashboardChangeSection('jumblr')}>
+                  <i className="site-menu-icon" aria-hidden="true"></i> Jumblr
+                </a>
+              </li>
+              <li className="nav-top-menu">
+                <a href="javascript:void(0)" id="nav-iguana-atomic-explorer" onClick={() => this.dashboardChangeSection('atomic')}>
+                  <i className="site-menu-icon" aria-hidden="true"></i> Atomic Explorer
+                </a>
+              </li>
+            </ul>
+            <ul className="nav navbar-toolbar navbar-right navbar-toolbar-right">
+              <li role="presentation">
+                <a href="javascript:void(0)" role="menuitem" data-edexcoinmenu="COIN" id="btn_edexcoin_addcoin" data-target="#AddCoinDilogModel" data-toggle="modal" style={{ paddingBottom: '10px', paddingTop: '16px' }}  onClick={this.toggleAddCoinModal}>
+                  <span>
+                    <img src="assets/images/icons/activatecoin.png" alt="Add Coin" />
+                  </span>
+                </a>
+              </li>
+              <li className={'dropdown' + (this.state.openDropMenu ? ' open' : '')} onClick={this.openDropMenu}>
+                <a className="navbar-avatar dropdown-toggle" data-toggle="dropdown" href="#" aria-expanded="false"
+                data-animation="scale-up" role="button">
+                  <span className="avatar avatar-online">
+                    <img src="assets/images/iguana_profile_02.jpg" alt="iguana profile pic" />
+                    <i></i>
+                  </span>
+                </a>
+                <ul className="dropdown-menu" role="menu">
+                  <li role="presentation">
+                    <a href="javascript:void(0)" role="menuitem" id="nav-iguana-wallet-settings" onClick={() => this.dashboardChangeSection('settings')}>
+                      <i className="icon md-settings" aria-hidden="true"></i> {translate('INDEX.SETTINGS')}
+                    </a>
+                  </li>
+                  <li role="presentation">
+                    <a href="javascript:void(0)" role="menuitem" id="nav-about-iguana" onClick={() => this.dashboardChangeSection('about')}>
+                      <i className="icon md-settings" aria-hidden="true"></i> {translate('INDEX.ABOUT_IGUANA')}
+                    </a>
+                  </li>
+                  <li className="divider" role="presentation"></li>
+                  <li role="presentation">
+                    <a href="javascript:void(0)" role="menuitem" id="logout-account" onClick={this.logout}>
+                      <i className="icon md-power" aria-hidden="true"></i> {translate('INDEX.LOGOUT')}
+                    </a>
+                  </li>
+                </ul>
+              </li>
+            </ul>
+          </div>
+        </div>
+      </nav>
+    );
+  }
+}
+
+export default Navbar;

react/src/components/dashboard/sendCoin.js

@@ -0,0 +1,173 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+//import { } from '../../actions/actionCreators';
+//import Store from '../../store';
+
+// TODO: implement logic
+
+class SendCoin extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      currentStep: 0,
+    };
+  }
+
+  changeSendCoinStep(step) {
+    this.setState(Object.assign({}, this.state, {
+      currentStep: step,
+    }));
+  }
+
+  render() {
+    console.log('sendcoin', this.props);
+    if (this.props && this.props.send) {
+      return (
+        <div className="col-sm-12 padding-top-10" data-edexcoin="COIN" id="edexcoin_send">
+          <div className="col-xlg-12 col-md-12 col-sm-12 col-xs-12">
+            <div className="steps row" style={{marginTop: '10px'}}>
+              <div className={this.state.currentStep === 0 ? 'step col-md-4 current' : 'step col-md-4'} id="edexcoin_send_step_1">
+                <span className="step-number">1</span>
+                <div className="step-desc">
+                  <span className="step-title">{translate('INDEX.FILL_SEND_FORM')}</span>
+                  <p>{translate('INDEX.FILL_SEND_DETAILS')}</p>
+                </div>
+              </div>
+              <div className={this.state.currentStep === 1 ? 'step col-md-4 current' : 'step col-md-4'} id="edexcoin_send_step_2">
+                <span className="step-number">2</span>
+                <div className="step-desc">
+                  <span className="step-title">{translate('INDEX.CONFIRMING')}</span>
+                  <p>{translate('INDEX.CONFIRM_DETAILS')}</p>
+                </div>
+              </div>
+              <div className={this.state.currentStep === 2 ? 'step col-md-4 current' : 'step col-md-4'} id="edexcoin_send_step_3">
+                <span className="step-number">3</span>
+                <div className="step-desc">
+                  <span className="step-title">{translate('INDEX.PROCESSING_TX')}</span>
+                  <p>{translate('INDEX.PROCESSING_DETAILS')}</p>
+                </div>
+              </div>
+            </div>
+
+            <div className={this.state.currentStep === 0 ? 'panel' : 'panel hide'} id="edexcoin-send-screen">
+              <div className="panel-heading">
+                <h3 data-edexcoin="COIN" className="panel-title">
+                  {translate('INDEX.SEND')} <span data-edexcoin="COIN"></span>
+                </h3>
+                <div className="panel-actions">
+                  <a href="javascript:void(0)" className="dropdown-toggle white btn-xs btn-info btn_refresh_edexcoin_send" data-edexcoin="COIN" aria-expanded="false" role="button">
+                    <i className="icon fa-refresh margin-right-10" aria-hidden="true"></i> {translate('INDEX.REFRESH_FUNDS')}
+                  </a>
+                </div>
+              </div>
+              <div className="panel-body container-fluid">
+                <form className="edexcoin-send-form" data-edexcoin="COIN" method="post" role="form" autoComplete="off">
+                  <div className="row">
+                    <div className="col-xlg-12 form-group form-material edexcoin_send_from_for_basilisk">
+                      <label className="control-label" data-edexcoin="COIN" htmlFor="edexcoin_send_from">{translate('INDEX.SEND_FROM')}</label>
+                      <select className="form-control form-material showedexcoinaddrs show-tick" data-edexcoin="COIN" id="edexcoin_send_from" title="Select Transparent or Private Address" data-size="5"></select>
+                    </div>
+                    <div className="col-xlg-12 form-group form-material">
+                      <label className="control-label" data-edexcoin="COIN" htmlFor="edexcoin_sendto">{translate('INDEX.SEND_TO')}</label>
+                      <input type="text" className="form-control" data-edexcoin="COIN" id="edexcoin_sendto" name="edexcoin_sendto" placeholder="Enter address" autoComplete="off" required />
+                    </div>
+                    <div className="col-lg-6 form-group form-material">
+                      <label className="control-label" htmlFor="edexcoin_amount" data-edexcoin="COIN" id="edexcoin_amount_label">
+                        <span data-edexcoin="COIN"></span>
+                      </label>
+                      <input type="text" className="form-control" data-edexcoin="COIN" id="edexcoin_amount" name="edexcoin_amount" placeholder="0.000" autoComplete="off" />
+                    </div>
+                    <div className="col-lg-6 form-group form-material">
+                      <label className="control-label" data-edexcoin="COIN" htmlFor="edexcoin_fee">{translate('INDEX.FEE')}</label>
+                      <input type="text" className="form-control" data-edexcoin="COIN" id="edexcoin_fee" name="edexcoin_fee" placeholder="0.000" autoComplete="off" />
+                    </div>
+                    <div className="col-lg-12">
+                      <span data-edexcoin="KMD">
+                        <b>{translate('INDEX.TOTAL')} (<span data-edexcoin="COIN">{translate('INDEX.AMOUNT_SM')}</span> - txfee):</b> <span data-edexcoin="COIN" id="edexcoin_total_value">0.000</span> <span data-edexcoin="COIN" id="edexcoin_total_coinname" data-edexcoin="COIN"></span>
+                      </span>
+                    </div>
+                    <div className="col-lg-10 margin-top-10">
+                      <div className="pull-left margin-right-10">
+                        <input type="checkbox" id="edexcoin_send_sig" name="edexcoin_send_sig" data-plugin="switchery" data-size="small" />
+                      </div>
+                      <label className="padding-top-3" htmlFor="edexcoin_send_sig">{translate('INDEX.DONT_SEND')}</label>
+                    </div>
+                    <div className="col-lg-2">
+                      <button type="button" className="btn btn-primary waves-effect waves-light pull-right edexcoin_send_coins_btn_step1" onClick={() => this.changeSendCoinStep(1)}>
+                        {translate('INDEX.SEND')} <span data-edexcoin="COIN"></span>
+                      </button>
+                    </div>
+                  </div>
+                </form>
+              </div>
+            </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="panel" id="edexcoin-send-confirm-screen">
+              <div className="panel-body">
+                <div className="row">
+                  <div className="col-xs-12">
+                    <b>{translate('INDEX.TO')}</b>
+                  </div>
+                  <div className="col-lg-6 col-sm-6 col-xs-12" id="mdl_confirm_currency_sendto_addr">[coin-address-goes-here]</div>
+                  <div className="col-lg-6 col-sm-6 col-xs-6">
+                    <span id="mdl_confirm_currency_send_amount">0.00000000</span> <span id="mdl_confirm_currency_coinname">[COIN]</span>
+                  </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">
+                    <span id="mdl_confirm_currency_send_fee">0.00000000</span> <span id="mdl_confirm_currency_coinname_fee">[COIN]</span>
+                  </div>
+                </div>
+                <br />
+
+                <div className="row">
+                  <div className="col-xs-12">
+                    <b>{translate('INDEX.FROM')}</b>
+                  </div>
+                  <div className="col-lg-6 col-sm-6 col-xs-12" id="mdl_confirm_currency_sendfrom_addr">[coin-address-goes-here]</div>
+                  <div className="col-lg-6 col-sm-6 col-xs-6" style={{color: '#f44336'}}>
+                    <span id="mdl_confirm_currency_sendfrom_total_dedcut">-0.00000000</span> <span id="mdl_confirm_currency_coinname_total">[COIN]</span>
+                  </div>
+                </div>
+                <div className="widget-body-footer">
+                  <a className="btn btn-default waves-effect waves-light" id="edexcoin_send_coins_back_btn" onClick={() => this.changeSendCoinStep(0)}>{translate('INDEX.BACK')}</a>
+                  <div className="widget-actions pull-right">
+                    <button type="button" className="btn btn-primary" id="edexcoin_send_coins_btn" onClick={() => this.changeSendCoinStep(2)}>{translate('INDEX.CONFIRM')}</button>
+                  </div>
+                </div>
+              </div>
+            </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="panel" id="edexcoin-send-txdetails-screen">
+              <div className="panel-heading">
+                <h4 className="panel-title">{translate('INDEX.TRANSACTION_RESULT')}</h4>
+                <table className="table table-hover table-striped edexcoin_sendto_result" data-edexcoin="COIN" id="edexcoin_sendto_result">
+                  <thead>
+                    <tr>
+                      <th>{translate('INDEX.KEY')}</th>
+                      <th>{translate('INDEX.INFO')}</th>
+                    </tr>
+                  </thead>
+                  <tbody>
+                  </tbody>
+                </table>
+                <div className="widget-body-footer">
+                  <div className="widget-actions margin-bottom-15 margin-right-15">
+                    <button type="button" className="btn btn-primary" id="edexcoin_send_coins_anothertx_btn" onClick={() => this.changeSendCoinStep(0)}>{translate('INDEX.MAKE_ANOTHER_TX')}</button>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      );
+    } else {
+      return null;
+    }
+  }
+}
+
+export default SendCoin;

react/src/components/dashboard/walletsBalance.js

@@ -0,0 +1,90 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+
+class WalletsBalance extends React.Component {
+  render() {
+    if (this.props && this.props.coin) {
+      return (
+        <div id="wallet-widgets" data-plugin="masonry" data-edexcoin="COIN">
+          <div className="col-xs-12">
+            <div className={this.props.coin.mode === 'native' || this.props.coin.mode === 'full' ? 'col-xs-12' : 'col-xs-12 hide'}>
+              <div role="alert" className="alert alert-info alert-dismissible" data-edexcoin="COIN" id="edexcoin-wallet-waitingrt-alert">
+                <button aria-label="Close" data-dismiss="alert" className="close" type="button">
+                  <span aria-hidden="true">×</span>
+                </button>
+                <h4>{translate('INDEX.ACTIVATING_WALLET_RT')}</h4>
+                <p data-edexcoin="COIN" id="edexcoin-wallet-waitingrt-alert-text">{translate('INDEX.IGUANA_FULL_MODE_SYNC_P1')}</p>
+                <p>{translate('INDEX.IGUANA_FULL_MODE_SYNC_P2')}</p>
+                <p style={{fontWeight: '600'}}>{translate('INDEX.IGUANA_FULL_MODE_SYNC_P3')}</p>
+              </div>
+
+              <div role="alert" className="alert alert-info alert-dismissible" data-edexcoin="COIN" id="edexcoin-wallet-waitingcache-alert">
+                <button aria-label="Close" data-dismiss="alert" className="close" type="button">
+                  <span aria-hidden="true">×</span>
+                </button>
+                <h4>{translate('INDEX.FETCHING_COIN_DATA')}</h4>
+                <p data-edexcoin="COIN" id="edexcoin-wallet-waitingcache-alert-text">{translate('INDEX.IGUANA_FULL_MODE_SYNC_P1')}</p>
+                <p>{translate('INDEX.IGUANA_FULL_MODE_SYNC_P2')}</p>
+                <p style={{fontWeight: '600'}}>{translate('INDEX.IGUANA_FULL_MODE_SYNC_P3')}</p>
+              </div>
+            </div>
+            <div className="col-lg-12 col-xs-12" data-edexcoin="COIN" id="edexcoin_getbalance_t">
+              <div className="widget widget-shadow" id="widgetLineareaOne">
+                <div className="widget-content">
+                  <div className="padding-20 padding-top-10">
+                    <div className="clearfix">
+                      <div className="pull-left padding-vertical-10">
+                        <i className="icon fa-eye font-size-24 vertical-align-bottom margin-right-5"></i>{translate('INDEX.BALANCE')}
+                      </div>
+                      <span className="pull-right padding-top-10" data-edexcoin="COIN" style={{fontSize: '22px'}}>
+                        <span data-edexcoin="COIN" id="edex_total_balance"></span> <span data-edexcoin="COIN" id="edex_total_balance_coincode">{this.props && this.props.ActiveCoin && this.props.ActiveCoin.balance ? this.props.ActiveCoin.balance : 0}</span>
+                      </span>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+
+            <div className={this.props.coin.mode === 'native' ? 'col-lg-4 col-xs-12' : 'col-lg-4 col-xs-12 hide'} data-edexcoin="COIN" id="edexcoin_getbalance_interest">
+              <div className="widget widget-shadow" id="widgetLineareaOne">
+                <div className="widget-content">
+                  <div className="padding-20 padding-top-10">
+                    <div className="clearfix">
+                      <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')}
+                      </div>
+                      <span className="pull-right padding-top-10" data-edexcoin="COIN" style={{fontSize: '22px'}}>
+                        <span data-edexcoin="COIN" id="edex_interest_balance"></span> <span data-edexcoin="COIN" id="edex_total_interest_coincode"></span>
+                      </span>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+
+            <div className={this.props.coin.mode === 'native' ? 'col-lg-4 col-xs-12' : 'col-lg-4 col-xs-12 hide'} data-edexcoin="COIN" id="edexcoin_getbalance_total_interest">
+              <div className="widget widget-shadow" id="widgetLineareaOne">
+                <div className="widget-content">
+                  <div className="padding-20 padding-top-10">
+                    <div className="clearfix">
+                      <div className="pull-left padding-vertical-10">
+                        <i className="icon fa-bullseye font-size-24 vertical-align-bottom margin-right-5"></i>{translate('INDEX.TOTAL_BALANCE')}
+                      </div>
+                      <span className="pull-right padding-top-10" data-edexcoin="COIN" style={{fontSize: '22px'}}>
+                        <span data-edexcoin="COIN" id="edex_total_balance_interest"></span> <span data-edexcoin="COIN" id="edex_total_balance_interest_coincode"></span>
+                      </span>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      );
+    } else {
+      return null;
+    }
+  }
+}
+
+export default WalletsBalance;

react/src/components/dashboard/walletsBasiliskRefresh.js

@@ -0,0 +1,39 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+
+classNameName WalletsBasiliskRefresh extends React.Component {
+  render() {
+    return (
+      <div data-edexcoin="COIN" id="edexcoin_dashboard_basilisk_refresh_status">
+        <div className="col-xs-12 margin-top-20">
+          <div className="col-xs-12">
+            <div className="panel">
+              <div className="panel-heading">
+                <h3 className="panel-title">{translate('INDEX.FETCHING_BASILISK_DATA')}</h3>
+                <div className="panel-actions">
+                  <a className="panel-action icon md-refresh-alt" data-toggle="panel-refresh" data-load-type="blue-only" aria-hidden="true"></a>
+                </div>
+              </div>
+              <div className="table-responsive">
+                <table className="table table-hover table-striped tbl_edexcoin_dashboard_basilisk_refresh_status">
+                  <thead>
+                    <tr>
+                      <th>{translate('INDEX.ADDRESS')}</th>
+                      <th>{translate('INDEX.LIST_UNSPENT')}</th>
+                      <th>{translate('INDEX.LIST_TRANSACTIONS')}</th>
+                      <th>{translate('INDEX.GET_BALANCE')}</th>
+                      <th>{translate('INDEX.REFRESH')}</th>
+                    </tr>
+                  </thead>
+                  <tbody></tbody>
+                </table>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
+
+export default WalletsBasiliskRefresh;

react/src/components/dashboard/walletsData.js

@@ -0,0 +1,104 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+/*import {  } from '../../actions/actionCreators';
+import Store from '../../store';*/
+
+class WalletsData extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      basiliskActionsMenu: false,
+    };
+    this.toggleBasiliskActionsMenu = this.toggleBasiliskActionsMenu.bind(this);
+  }
+
+  toggleBasiliskActionsMenu() {
+    this.setState(Object.assign({}, this.state, {
+      basiliskActionsMenu: !this.state.basiliskActionsMenu,
+    }));
+  }
+
+  render() {
+    if (this.props && this.props.coin) {
+      return (
+        <div data-edexcoin="COIN" id="edexcoin_dashboardinfo">
+          <div className="col-xs-12 margin-top-20">
+            <div className="panel nav-tabs-horizontal">
+              <div data-edexcoin="COIN" id="edexcoin_dashoard_section">
+                <div className="col-xlg-12 col-lg-12 col-sm-12 col-xs-12 edexcoin_dashoard_section_main_div">
+                  <div id="edexcoin_txhistory" className="panel">
+                    <header className="panel-heading" style={{zIndex: '10'}}>
+                      <div className="panel-actions">
+                        <a href="javascript:void(0)" className="dropdown-toggle white btn-xs btn-info btn_refresh_edexcoin_dashboard" data-edexcoin="COIN" aria-expanded="false" role="button">
+                          <i className="icon fa-refresh margin-right-10" aria-hidden="true"></i> {translate('INDEX.REFRESH')}
+                        </a>
+                        <div className={this.state.basiliskActionsMenu ? 'dropdown open' : 'dropdown'} onClick={this.toggleBasiliskActionsMenu}>
+                          <a className="dropdown-toggle btn-xs btn-default" data-edexcoin="COIN" id="btn_edexcoin_basilisk" data-toggle="dropdown" 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>
+                          <ul className="dropdown-menu dropdown-menu-right" aria-labelledby="btn_edexcoin_basilisk"
+                          role="menu">
+                            <li role="presentation">
+                              <a href="javascript:void(0)" className="btn_edexcoin_dashboard_getnotaries" data-edexcoin="COIN" id="btn_edexcoin_dashboard_getnotaries" role="menuitem">
+                                <i className="icon fa-sitemap" aria-hidden="true"></i> {translate('INDEX.GET_NOTARY_NODES_LIST')}
+                              </a>
+                            </li>
+                            <li role="presentation">
+                              <a href="javascript:void(0)" className="btn_edexcoin_dashboard_refresh_basilisk_conn" data-edexcoin="COIN" id="btn_edexcoin_dashboard_refresh_basilisk_conn" role="menuitem">
+                                <i className="icon wb-refresh" aria-hidden="true"></i> {translate('INDEX.REFRESH_BASILISK_CONNECTIONS')}
+                              </a>
+                            </li>
+                            <li data-edexcoin="COIN" role="presentation">
+                              <a href="javascript:void(0)" className="btn_edexcoin_dashboard_fetchdata" data-edexcoin="COIN" id="btn_edexcoin_dashboard_fetchdata" role="menuitem">
+                                <i className="icon fa-cloud-download" aria-hidden="true"></i> {translate('INDEX.FETCH_WALLET_DATA')}
+                              </a>
+                            </li>
+                            <li data-edexcoin="COIN" role="presentation">
+                              <a href="javascript:void(0)" className="btn_edexcoin_dashboard_refetchdata" data-edexcoin="COIN" id="btn_edexcoin_dashboard_refetchdata" role="menuitem">
+                                <i className="icon fa-cloud-download" aria-hidden="true"></i> {translate('INDEX.REFETCH_WALLET_DATA')}
+                              </a>
+                            </li>
+                          </ul>
+                        </div>
+                      </div>
+                      <h4 className="panel-title">{translate('INDEX.TRANSACTION_HISTORY')}</h4>
+                    </header>
+                    <div className="panel-body">
+                      <table className="table table-hover dataTable table-striped" data-edexcoin="COIN" id="edex-tx-history-tbl" width="100%">
+                        <thead>
+                          <tr>
+                            <th>{translate('INDEX.DIRECTION')}</th>
+                            <th className="hidden-xs hidden-sm">{translate('INDEX.CONFIRMATIONS')}</th>
+                            <th>{translate('INDEX.AMOUNT')}</th>
+                            <th>{translate('INDEX.TIME')}</th>
+                            <th>{translate('INDEX.DEST_ADDRESS')}</th>
+                            <th className="hidden-xs hidden-sm">{translate('INDEX.TX_DETAIL')}</th>
+                          </tr>
+                        </thead>
+                        <tfoot>
+                          <tr>
+                            <th>{translate('INDEX.DIRECTION')}</th>
+                            <th>{translate('INDEX.CONFIRMATIONS')}</th>
+                            <th>{translate('INDEX.AMOUNT')}</th>
+                            <th>{translate('INDEX.TIME')}</th>
+                            <th>{translate('INDEX.DEST_ADDRESS')}</th>
+                            <th className="hidden-xs hidden-sm">{translate('INDEX.TX_DETAIL')}</th>
+                          </tr>
+                        </tfoot>
+                      </table>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      );
+    } else {
+      return null;
+    }
+  }
+}
+
+export default WalletsData;

react/src/components/dashboard/walletsHeader.js

@@ -0,0 +1,108 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+//import { dashboardChangeSection, toggleAddcoinModal } from '../../actions/actionCreators';
+//import Store from '../../store';
+
+class WalletsHeader extends React.Component {
+  render() {
+    if (this.props && this.props.coin) {
+      return (
+        <div className="page-header page-header-bordered header-easydex margin-bottom-0" id="easydex-header-div">
+          <h1 className="page-title">EasyDEX</h1>
+          <ol className="breadcrumb">
+            <li className="header-easydex-section">{translate('INDEX.DASHBOARD')}</li>
+          </ol>
+          <div className="page-header-actions" style={{zIndex: '1'}}>
+            <div id="kmd_header_button">
+              <button type="button" id="easydex_kmd_wallet_actions_header" className="bg-teal-500 btn btn-floating white waves-effect waves-float waves-light" data-toggle="dropdown" aria-expanded="false">
+                <i className="icon md-plus" aria-hidden="true"></i>
+              </button>
+              <ul className="dropdown-menu animate dropdown-menu-right" aria-labelledby="easydex_kmd_wallet_actions_header" role="menu">
+                <li role="presentation">
+                  <a href="javascript:void(0)" role="menuitem" data-extcoin-menu="KMD" id="btn_kmd_wallet_dashboard">{translate('INDEX.DASHBOARD')}</a>
+                </li>
+                <li role="presentation">
+                  <a href="javascript:void(0)" role="menuitem" data-extcoin-menu="KMD" id="btn_kmd_wallet_send">{translate('INDEX.SEND')}</a>
+                </li>
+                <li role="presentation">
+                  <a href="javascript:void(0)" role="menuitem" data-extcoin-menu="KMD" id="btn_kmd_wallet_recieve">{translate('INDEX.RECEIVE')}</a>
+                </li>
+                <li className="divider" role="presentation"></li>
+                <li role="presentation">
+                  <a href="javascript:void(0)" role="menuitem" data-extcoin-menu="KMD" id="btn_kmd_wallet_settings">{translate('INDEX.SETTINGS')}</a>
+                </li>
+              </ul>
+            </div>
+
+            <div id="zec_header_button">
+              <button type="button" id="easydex_zec_wallet_actions_header" className="bg-yellow-600 btn btn-floating white waves-effect waves-float waves-light" data-toggle="dropdown" aria-expanded="false">
+                <i className="icon md-plus" aria-hidden="true"></i>
+              </button>
+              <ul className="dropdown-menu animate dropdown-menu-right" aria-labelledby="easydex_zec_wallet_actions_header" 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 role="presentation">
+                  <a href="javascript:void(0)" role="menuitem" data-extcoin-menu="ZEC" id="btn_zec_wallet_send">{translate('INDEX.SEND')}</a>
+                </li>
+                <li role="presentation">
+                  <a href="javascript:void(0)" role="menuitem" data-extcoin-menu="ZEC" id="btn_zec_wallet_recieve">{translate('INDEX.RECEIVE')}</a>
+                </li>
+                <li className="divider" role="presentation"></li>
+                <li role="presentation">
+                  <a href="javascript:void(0)" role="menuitem" data-extcoin-menu="ZEC" id="btn_zec_wallet_settings">{translate('INDEX.SETTINGS')}</a>
+                </li>
+              </ul>
+            </div>
+
+            <div id="kmd_header_button">
+              <button type="button" id="jumblr_actions_header" className="btn white waves-effect waves-light">
+                <i className="icon fa-refresh" aria-hidden="true"></i>{translate('INDEX.REFRESH')}
+              </button>
+            </div>
+
+            <div id="kmd_header_button">
+              <button type="button" id="easydex_acpax_wallet_actions_header" className="bg-teal-500 btn btn-floating white waves-effect waves-float waves-light" data-toggle="dropdown" aria-expanded="false">
+                <i className="icon md-plus" aria-hidden="true"></i>
+              </button>
+              <ul className="dropdown-menu animate dropdown-menu-right" aria-labelledby="easydex_acpax_wallet_actions_header" 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 role="presentation">
+                  <a href="javascript:void(0)" role="menuitem" data-extcoin-menu="KMD" id="btn_acpax_wallet_send">{translate('INDEX.SEND')}</a>
+                </li>
+                <li role="presentation">
+                  <a href="javascript:void(0)" role="menuitem" data-extcoin-menu="KMD" id="btn_acpax_wallet_recieve">{translate('INDEX.RECEIVE')}</a>
+                </li>
+                <li className="divider" role="presentation"></li>
+                <li role="presentation">
+                  <a href="javascript:void(0)" role="menuitem" data-extcoin-menu="KMD" id="btn_acpax_wallet_settings">{translate('INDEX.SETTINGS')}</a>
+                </li>
+              </ul>
+            </div>
+
+            <div className="row no-space width-350 hidden-xs" id="easydex_btc_btcd_balances_header">
+              <div className="col-xs-6">
+                <div className="counter">
+                  <span className="font-weight-medium" data-currency="BTC" id="header_coinname_balance"> - BTC</span>
+                  <span className="counter-label small" data-currency="BTC" id="header_coinfiatbalance"> - USD</span>
+                </div>
+              </div>
+              <div className="col-xs-6">
+                <div className="counter">
+                  <span className="font-weight-medium" data-currency="BTCD" id="header_coinname_balance"> - BTCD</span>
+                  <span className="counter-label small" data-currency="BTCD" id="header_coinfiatbalance"> - USD</span>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      );
+    } else {
+      return null;
+    }
+  }
+}
+
+export default WalletsHeader;

react/src/components/dashboard/walletsNav.js

@@ -0,0 +1,73 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+import { copyCoinAddress, iguanaEdexBalance, toggleSendCoinForm, toggleReceiveCoinForm, toggleSendReceiveCoinForms } from '../../actions/actionCreators';
+import Store from '../../store';
+
+class WalletsNav extends React.Component {
+  constructor(props) {
+    super(props);
+    this.toggleSendReceiveCoinForms = this.toggleSendReceiveCoinForms.bind(this);
+  }
+
+  componentWillMount() {
+    Store.dispatch(iguanaEdexBalance(this.props.ActiveCoin.coin));
+  }
+
+  copyMyAddress(address) {
+    Store.dispatch(copyCoinAddress(address));
+  }
+
+  toggleSendReceiveCoinForms() {
+    Store.dispatch(toggleSendReceiveCoinForms());
+  }
+
+  toggleSendCoinForm(display) {
+    console.log(display);
+    Store.dispatch(toggleSendCoinForm(display));
+  }
+
+  render() {
+    if (this.props && this.props.ActiveCoin && !this.props.ActiveCoin.coin) {
+      return (
+        <div>
+          <div className="col-xs-12 padding-top-20" id="no_wallet_selected">
+            <div className="alert alert-info alert-dismissible" role="alert">
+              <button type="button" className="close" data-dismiss="alert" aria-label="Close">
+              </button>
+              <span style={{fontSize: '24px', textAlign: 'center'}}>
+                <i className="icon fa-paw" aria-hidden="true"></i> {translate('INDEX.NO_WALLET_CAPS')}
+              </span>
+              <br/>
+              {translate('INDEX.PLEASE_SELECT_A_WALLET')}.
+            </div>
+          </div>
+        </div>
+      );
+    } else {
+      return (
+        <div>
+          <div className="page-header page-header-bordered header-easydex" id="header-dashboard" data-edexcoin="COIN">
+            <ol className="breadcrumb" data-edexcoin="COIN">
+              <b>{translate('INDEX.MY')} <span data-edexcoin="COIN" id="edexcoin-active">{this.props && this.props.ActiveCoin ? this.props.ActiveCoin.coin : '-'}</span> {translate('INDEX.ADDRESS')}: </b> <span data-edexcoin="COIN" 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" data-edexcoin="COIN" id="edexcoin_active_addr_clipboard" data-clipboard-text="" onClick={() => this.copyMyAddress(this.props.Dashboard.activeHandle[this.props.ActiveCoin.coin])}><i className="icon wb-copy" aria-hidden="true"></i> {translate('INDEX.COPY')}</button>
+            </ol>
+            <div className="page-header-actions" data-edexcoin="COIN" id="edexcoin-actions">
+              <div id="kmd_header_button">
+                <button type="button" className="btn btn-dark waves-effect waves-light" data-edexcoinmenu="COIN" id="btn_edexcoin_dashboard" onClick={this.toggleSendReceiveCoinForms}>
+                  <i className="icon md-view-dashboard" aria-hidden="true"></i> {translate('INDEX.DASHBOARD')}
+                </button>
+                <button type="button" className="btn btn-primary waves-effect waves-light" data-edexcoinmenu="COIN" id="btn_edexcoin_send" onClick={() => this.toggleSendCoinForm(!this.props.ActiveCoin.send)}>
+                  <i className="icon fa-send" aria-hidden="true"></i> {translate('INDEX.SEND')}
+                </button>
+                <button type="button" className="btn btn-info waves-effect waves-light" data-edexcoinmenu="COIN" id="btn_edexcoin_recieve">
+                  <i className="icon fa-inbox" aria-hidden="true"></i> {translate('INDEX.RECEIVE')}
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+      );
+    }
+  }
+}
+
+export default WalletsNav;

react/src/components/dashboard/walletsProgress.js

@@ -0,0 +1,43 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+
+class WalletsProgress extends React.Component {
+  render() {
+    if (this.props && this.props.ActiveCoin && this.props.ActiveCoin.mode === 'full') {
+      return (
+        <div id="edex-footer" data-edexcoin="COIN">
+          <div className="row no-space" data-edexcoin="COIN">
+            <div data-edexcoin="COIN" id="currency-progressbars">
+              <div className="progress progress-sm">
+                <div className="progress-bar progress-bar-info progress-bar-striped active" style={{width: '10%', fontSize: '80%'}} role="progressbar" data-edexcoin="COIN" id="currency-bundles">
+                  <span data-lang="INDEX.BUNDLES"></span> <span data-edexcoin="COIN" id="currency-bundles-percent">0%</span>
+                </div>
+              </div>
+            </div>
+            <div data-edexcoin="COIN" id="additional-progress-bars">
+              <div className="progress progress-sm">
+                <div className="progress-bar progress-bar-warning progress-bar-striped active" style={{width: '20%', fontSize: '80%'}} role="progressbar" data-edexcoin="COIN" id="currency-utxo">
+                  utxo <span data-edexcoin="COIN" id="currency-utxo-percent">0%</span>
+                </div>
+              </div>
+              <div className="progress progress-sm">
+                <div className="progress-bar progress-bar-danger progress-bar-striped active" style={{width: '20%', fontSize: '80%'}} role="progressbar" data-edexcoin="COIN" id="currency-balances">
+                  <span data-lang="INDEX.BALANCES"></span> <span data-edexcoin="COIN" id="currency-balances-percent">0%</span>
+                </div>
+              </div>
+              <div className="progress progress-sm">
+                <div className="progress-bar progress-bar-success progress-bar-striped active" style={{width: '20%', fontSize: '80%'}} role="progressbar" data-edexcoin="COIN" id="currency-validated">
+                  <span data-lang="INDEX.VALIDATED"></span> <span data-edexcoin="COIN" id="currency-validated-percent">0%</span>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      );
+    } else {
+      return null;
+    }
+  }
+}
+
+export default WalletsProgress;

react/src/components/dummy/dummy.js

@@ -1,6 +1,6 @@
 import React from 'react';
 
-function Dummy() {
+class Dummy extends React.Component () {
   return (
   );
 }

react/src/components/login/login.js

@@ -1,119 +1,158 @@
 import React from 'react';
 import { translate } from '../../translate/translate';
-import { toggleAddcoinModal } from '../../actions/actionCreators';
+import { toggleAddcoinModal, iguanaWalletPassphrase } from '../../actions/actionCreators';
 import Store from '../../store';
 
 class Login extends React.Component {
   constructor(props) {
     super(props);
     this.state = {
-      display: true,
+      display: false,
-      ieWarning: false,
+      activeLoginSection: 'activateCoin',
-      login: false,
+      loginPassphrase: null,
-      signup: false,
-      activateCoin: true,
     };
     this.toggleActivateCoinForm = this.toggleActivateCoinForm.bind(this);
+    this.updatePassphraseLoginInput = this.updatePassphraseLoginInput.bind(this);
+    this.loginSeed = this.loginSeed.bind(this);
+  }
+
+  componentWillReceiveProps(props) {
+    console.log('loginprops', props.Main);
+    if (props && props.Main && props.Main.isLoggedIn) {
+      this.setState({
+        display: false,
+      });
+      console.log(this.state);
+    }
+    if (props && props.Main && !props.Main.isLoggedIn) {
+      this.setState({
+        display: true,
+      });
+    }
+    if (props && props.Main && props.Main.activeCoins) {
+      this.setState({
+        activeLoginSection: 'login',
+      });
+    } else {
+      this.setState({
+        activeLoginSection: 'activateCoin',
+      });
+    }
   }
 
   toggleActivateCoinForm() {
     Store.dispatch(toggleAddcoinModal(true, false));
   }
 
+  updatePassphraseLoginInput(e) {
+    this.setState({
+      [e.target.name]: e.target.value,
+    });
+  }
+
+  loginSeed() {
+    Store.dispatch(iguanaWalletPassphrase(this.state.loginPassphrase));
+    console.log(this.state);
+  }
+
   render() {
-    return (
+    if (this.state && this.state.display) {
-      <div id="wallet-login" className={this.state.display ? 'show' : 'hide'}>
+      return (
-        <div className="page animsition vertical-align text-center fade-in" data-animsition-in="fade-in" data-animsition-out="fade-out">
+        <div id="wallet-login">
-          <div className="page-content vertical-align-middle">
+          <div className="page animsition vertical-align text-center fade-in" data-animsition-in="fade-in" data-animsition-out="fade-out">
-            <div className="brand">
+            <div className="page-content vertical-align-middle">
-              <img className="brand-img" src="assets/images/easydex-logo-big.png" alt="SuperNET Iguana" />
+              <div className="brand">
-            </div>
+                <img className="brand-img" src="assets/images/easydex-logo-big.png" alt="SuperNET Iguana" />
+              </div>
 
-            <div id="section-ie-warning" className={this.state.ieWarning ? 'show' : 'hide'}>
+              <div id="section-ie-warning" className={this.state.activeLoginSection === 'ieWarning' ? 'show' : 'hide'}>
-              <div className="panel">
+                <div className="panel">
-                <div className="panel-heading">
+                  <div className="panel-heading">
-                  <h3 className="panel-title">{translate('INDEX.UNSUPPORTED_BROWSER')}</h3>
+                    <h3 className="panel-title">{translate('INDEX.UNSUPPORTED_BROWSER')}</h3>
-                </div>
-                <div className="alert alert-danger alert-dismissible" role="alert">
-                  <button type="button" className="close" data-dismiss="alert" aria-label="Close">
-                    <span aria-hidden="true">&times;</span>
-                    <span className="sr-only">{translate('INDEX.CLOSE')}</span>
-                  </button>
-                  {translate('INDEX.IE_UNSUPPORTED')}
-                </div>
-                <div className="panel-body">
-                  <p style={{ color: '#424242' }}>
-                    {translate('INDEX.PLEASE_USE')} <a href="https://www.google.com/chrome/">Google Chrome</a> {translate('INDEX.OR')} <a href="https://www.firefox.com">Mozilla FireFox</a> {translate('INDEX.TO_USE')} EasyDEX-GUI. {translate('INDEX.PLEASE_CLICK_ON')}.
-                  </p>
-                  <div className="col-sm-6 col-xs-6">
-                    <a href="https://www.google.com/chrome/"><img className="brand-img" src="assets/images/browsers/chrome.png" alt="Google Chrome" /></a>
                   </div>
-                  <div className="col-sm-6 col-xs-6">
+                  <div className="alert alert-danger alert-dismissible" role="alert">
-                    <a href="https://www.firefox.com"><img className="brand-img" src="assets/images/browsers/firefox.png" alt="Mozilla FireFox" /></a>
+                    <button type="button" className="close" data-dismiss="alert" aria-label="Close">
+                      <span aria-hidden="true">&times;</span>
+                      <span className="sr-only">{translate('INDEX.CLOSE')}</span>
+                    </button>
+                    {translate('INDEX.IE_UNSUPPORTED')}
+                  </div>
+                  <div className="panel-body">
+                    <p style={{ color: '#424242' }}>
+                      {translate('INDEX.PLEASE_USE')} <a href="https://www.google.com/chrome/">Google Chrome</a> {translate('INDEX.OR')} <a href="https://www.firefox.com">Mozilla FireFox</a> {translate('INDEX.TO_USE')} EasyDEX-GUI. {translate('INDEX.PLEASE_CLICK_ON')}.
+                    </p>
+                    <div className="col-sm-6 col-xs-6">
+                      <a href="https://www.google.com/chrome/"><img className="brand-img" src="assets/images/browsers/chrome.png" alt="Google Chrome" /></a>
+                    </div>
+                    <div className="col-sm-6 col-xs-6">
+                      <a href="https://www.firefox.com"><img className="brand-img" src="assets/images/browsers/firefox.png" alt="Mozilla FireFox" /></a>
+                    </div>
                   </div>
                 </div>
               </div>
-            </div>
 
-            <div id="section-login" className={this.state.login ? 'show' : 'hide'}>
+              <div id="section-login" className={this.state.activeLoginSection === 'login' ? 'show' : 'hide'}>
-              <h4 style={{ color: '#fff' }} id="login-welcome">{translate('INDEX.WELCOME_LOGIN')}</h4>
+                <h4 style={{ color: '#fff' }} id="login-welcome">{translate('INDEX.WELCOME_LOGIN')}</h4>
-              <form className="login-form" autoComplete="off">
+                <form className="login-form" autoComplete="off">
-                <div className="form-group form-material floating">
+                  <div className="form-group form-material floating">
-                  <input type="password" className="form-control" name="password" id="password" />
+                    <input type="password" className="form-control" name="loginPassphrase" id="password" onChange={this.updatePassphraseLoginInput} />
-                  <label className="floating-label" htmlFor="inputPassword">{translate('INDEX.WALLET_SEED')}</label>
+                    <label className="floating-label" htmlFor="inputPassword">{translate('INDEX.WALLET_SEED')}</label>
-                </div>
+                  </div>
-                <button type="submit" className="btn btn-primary btn-block" id="loginbtn">{translate('INDEX.SIGN_IN')}</button>
+                  <button type="button" className="btn btn-primary btn-block" id="loginbtn" onClick={this.loginSeed} disabled={!this.state.loginPassphrase || !this.state.loginPassphrase.length}>{translate('INDEX.SIGN_IN')}</button>
-                <div className="form-group form-material floating">
+                  <div className="form-group form-material floating">
-                  <button className="btn btn-lg btn-flat btn-block waves-effect" id="register-btn">{translate('INDEX.CREATE_WALLET')}</button>
+                    <button className="btn btn-lg btn-flat btn-block waves-effect" id="register-btn">{translate('INDEX.CREATE_WALLET')}</button>
-                  <button className="btn btn-lg btn-flat btn-block waves-effect" id="logint-another-wallet">{translate('INDEX.LOGIN_ANOTHER_WALLET')}</button>
+                    <button className="btn btn-lg btn-flat btn-block waves-effect" id="logint-another-wallet">{translate('INDEX.LOGIN_ANOTHER_WALLET')}</button>
-                </div>
+                  </div>
-              </form>
+                </form>
-            </div>
+              </div>
 
-            <div id="section-login-addcoin-btn" className={this.state.activateCoin ? 'show' : 'hide'}>
+              <div id="section-login-addcoin-btn" className={this.state.activeLoginSection === 'activateCoin' ? 'show' : 'hide'}>
-              <h4 style={{ color: '#fff' }} id="login-welcome">{translate('INDEX.WELCOME_PLEASE_ADD')}</h4>
+                <h4 style={{ color: '#fff' }} id="login-welcome">{translate('INDEX.WELCOME_PLEASE_ADD')}</h4>
-              <div className="form-group form-material floating" style={{width: '540px', margin: '30px 0'}}>
+                <div className="form-group form-material floating" style={{width: '540px', margin: '30px 0'}}>
-                <button className="btn btn-lg btn-primary btn-block ladda-button" id="start-coin-login" role="menuitem" data-edexcoinmenu="COIN" data-target="#AddCoinDilogModel-login" data-toggle="modal" data-style="expand-left" data-plugin="ladda" onClick={this.toggleActivateCoinForm}><span className="ladda-label">{translate('INDEX.ACTIVATE_COIN')}</span></button>
+                  <button className="btn btn-lg btn-primary btn-block ladda-button" id="start-coin-login" role="menuitem" data-edexcoinmenu="COIN" data-target="#AddCoinDilogModel-login" data-toggle="modal" data-style="expand-left" data-plugin="ladda" onClick={this.toggleActivateCoinForm}><span className="ladda-label">{translate('INDEX.ACTIVATE_COIN')}</span></button>
+                </div>
               </div>
-            </div>
 
-            <div id="section-register" className={this.state.signup ? 'show' : 'hide'}>
+              <div id="section-register" className={this.state.activeLoginSection === 'signup' ? 'show' : 'hide'}>
-              <form className="register-form" role="form" autoComplete="off">
+                <form className="register-form" role="form" autoComplete="off">
-                <h4 className="hint" style={{ color: '#fff' }}>
+                  <h4 className="hint" style={{ color: '#fff' }}>
-                  {translate('INDEX.SELECT_SEED_TYPE')}:
+                    {translate('INDEX.SELECT_SEED_TYPE')}:
-                </h4>
+                  </h4>
-                <div className="form-group form-material floating">
+                  <div className="form-group form-material floating">
-                  <div className="radio-custom radio-default radio-inline">
+                    <div className="radio-custom radio-default radio-inline">
-                    <input type="radio" id="PassPhraseOptionsIguana" value="PassPhraseOptionsIguana" name="PassPhraseOptions" checked="" />
+                      <input type="radio" id="PassPhraseOptionsIguana" value="PassPhraseOptionsIguana" name="PassPhraseOptions" checked="" />
-                    <label htmlFor="PassPhraseOptionsIguana">Iguana (256 bits)</label>
+                      <label htmlFor="PassPhraseOptionsIguana">Iguana (256 bits)</label>
+                    </div>
+                    <div className="radio-custom radio-default radio-inline">
+                      <input type="radio" id="PassPhraseOptionsWaves" value="PassPhraseOptionsWaves" name="PassPhraseOptions" />
+                      <label htmlFor="PassPhraseOptionsWaves">Waves</label>
+                    </div>
+                    <div className="radio-custom radio-default radio-inline">
+                      <input type="radio" id="PassPhraseOptionsNXT" value="PassPhraseOptionsNXT" name="PassPhraseOptions" />
+                      <label htmlFor="PassPhraseOptionsNXT">NXT</label>
+                    </div>
                   </div>
-                  <div className="radio-custom radio-default radio-inline">
+                  <div className="form-group form-material floating">
-                    <input type="radio" id="PassPhraseOptionsWaves" value="PassPhraseOptionsWaves" name="PassPhraseOptions" />
+                    <textarea className="form-control placeholder-no-fix" type="text" placeholder="" name="walletseed" id="walletseed" style={{ height: '100px' }}></textarea>
-                    <label htmlFor="PassPhraseOptionsWaves">Waves</label>
+                    <label className="floating-label" htmlFor="walletseed">{translate('INDEX.WALLET_SEED')}</label>
                   </div>
-                  <div className="radio-custom radio-default radio-inline">
+                  <div className="form-group form-material floating">
-                    <input type="radio" id="PassPhraseOptionsNXT" value="PassPhraseOptionsNXT" name="PassPhraseOptions" />
+                    <textarea className="form-control placeholder-no-fix" type="text" placeholder="" name="rwalletseed" id="rwalletseed" style={{ height: '100px' }}></textarea>
-                    <label htmlFor="PassPhraseOptionsNXT">NXT</label>
+                    <label className="floating-label" htmlFor="rwalletseed">{translate('INDEX.CONFIRM_SEED')}</label>
                   </div>
-                </div>
+                  <button type="submit" id="register-submit-btn" className="btn btn-primary btn-block">{translate('INDEX.REGISTER')}</button>
-                <div className="form-group form-material floating">
+                  <div className="form-group form-material floating">
-                  <textarea className="form-control placeholder-no-fix" type="text" placeholder="" name="walletseed" id="walletseed" style={{ height: '100px' }}></textarea>
+                    <button className="btn btn-lg btn-flat btn-block waves-effect" id="register-back-btn">{translate('INDEX.BACK_TO_LOGIN')}</button>
-                  <label className="floating-label" htmlFor="walletseed">{translate('INDEX.WALLET_SEED')}</label>
+                  </div>
-                </div>
+                </form>
-                <div className="form-group form-material floating">
+              </div>
-                  <textarea className="form-control placeholder-no-fix" type="text" placeholder="" name="rwalletseed" id="rwalletseed" style={{ height: '100px' }}></textarea>
-                  <label className="floating-label" htmlFor="rwalletseed">{translate('INDEX.CONFIRM_SEED')}</label>
-                </div>
-                <button type="submit" id="register-submit-btn" className="btn btn-primary btn-block">{translate('INDEX.REGISTER')}</button>
-                <div className="form-group form-material floating">
-                  <button className="btn btn-lg btn-flat btn-block waves-effect" id="register-back-btn">{translate('INDEX.BACK_TO_LOGIN')}</button>
-                </div>
-              </form>
             </div>
           </div>
         </div>
-      </div>
+      );
-    );
+    } else {
+      return null;
+    }
   }
 }
 

react/src/components/main/main.js

@@ -2,6 +2,8 @@ import React from 'react';
 import Config from '../../config';
 import WalletMain from './walletMain';
 import { iguanaSetRPCAuth } from '../../util/auth';
+import Store from '../../store';
+import { getDexCoins, iguanaActiveHandle } from '../../actions/actionCreators';
 
 class Main extends React.Component {
   constructor(props) {
@@ -11,13 +13,28 @@ class Main extends React.Component {
     this.loading = this.loading.bind(this);
     this.isWalletUnlocked = this.isWalletUnlocked.bind(this);
     this.state = {
-      user: false,
+      isLoggedIn: false,
+      coins: null,
+      activeCoins: false,
+      activeHandleInterval: null,
     };
   }
 
+  componentDidMount() {
+    Store.dispatch(iguanaActiveHandle());
+    var _iguanaActiveHandle = setInterval(function() {
+      Store.dispatch(iguanaActiveHandle());
+    }, 30000);
+
+    this.setState(Object.assign({}, this.state, {
+      activeHandleInterval: _iguanaActiveHandle,
+    }));
+  }
+
   componentWillMount() {
     console.log('mounting main component');
     // set userpass param
+    Store.dispatch(getDexCoins());
     iguanaSetRPCAuth();
     if (sessionStorage.getItem('session')) {
       this.setState({

react/src/components/main/walletMain.js

@@ -2,11 +2,13 @@ import React from 'react';
 import Toaster from '../toaster/toaster';
 import AddCoin from '../addcoin/addcoin';
 import Login from '../login/login';
+import Dashboard from '../dashboard/dashboard';
 
 class WalletMain extends React.Component {
   render() {
     return (
-      <div>
+      <div style={{height: '100%'}}>
+        <Dashboard {...this.props} />
         <AddCoin {...this.props.AddCoin} />
         <Login {...this.props} />
         <Toaster {...this.props.toaster} />

react/src/components/toaster/toaster.js

@@ -1,4 +1,6 @@
 import React from 'react';
+import { dismissToasterMessage } from '../../actions/actionCreators';
+import Store from '../../store';
 
 class Toaster extends React.Component {
   constructor(props) {
@@ -20,26 +22,24 @@ class Toaster extends React.Component {
         type: props.type,
         title: props.title,
       });
+    } else {
+      this.setState({
+        display: false,
+        message: null,
+        type: null,
+        title: null,
+      });
     }
   }
 
-  setInitialState() {
-    this.setState({
-      display: false,
-      message: null,
-      type: null,
-      title: null,
-    });
-  }
-
   dismissToast() {
-    this.setInitialState();
+    Store.dispatch(dismissToasterMessage());
   }
 
   // TODO: multiple toasts
   renderToast() {
     setTimeout(() => {
-      this.setInitialState();
+      Store.dispatch(dismissToasterMessage());
     }, 5000);
 
     return (

react/src/reducers/activeCoin.js

@@ -0,0 +1,40 @@
+import { DASHBOARD_ACTIVE_COIN_CHANGE, DASHBOARD_ACTIVE_COIN_BALANCE, DASHBOARD_ACTIVE_COIN_SEND_FORM, DASHBOARD_ACTIVE_COIN_RECEIVE_FORM, DASHBOARD_ACTIVE_COIN_RESET_FORMS } from '../actions/actionCreators';
+
+export function ActiveCoin(state = {
+  coin: null,
+  mode: null,
+  send: false,
+  receive: false,
+  balance: 0,
+}, action) {
+  switch (action.type) {
+    case DASHBOARD_ACTIVE_COIN_CHANGE:
+      return Object.assign({}, state, {
+        coin: action.coin,
+        mode: action.mode,
+      });
+    case DASHBOARD_ACTIVE_COIN_BALANCE:
+      return Object.assign({}, state, {
+        balance: action.balance,
+      });
+    case DASHBOARD_ACTIVE_COIN_SEND_FORM:
+      return Object.assign({}, state, {
+        send: action.send,
+        receive: false,
+      });
+    case DASHBOARD_ACTIVE_COIN_RECEIVE_FORM:
+      return Object.assign({}, state, {
+        send: false,
+        receive: action.receive,
+      });
+    case DASHBOARD_ACTIVE_COIN_RESET_FORMS:
+      return Object.assign({}, state, {
+        send: false,
+        receive: false,
+      });
+    default:
+      return state;
+  }
+}
+
+export default ActiveCoin;

react/src/reducers/dashboard.js

@@ -0,0 +1,21 @@
+import { DASHBOARD_SECTION_CHANGE, GET_MAIN_ADDRESS } from '../actions/actionCreators';
+
+export function Dashboard(state = {
+  activeSection: 'wallets',
+  activeHandle: null,
+}, action) {
+  switch (action.type) {
+    case DASHBOARD_SECTION_CHANGE:
+      return Object.assign({}, state, {
+        activeSection: action.activeSection,
+      });
+    case GET_MAIN_ADDRESS:
+      return Object.assign({}, state, {
+        activeHandle: action.activeHandle,
+      });
+    default:
+      return state;
+  }
+}
+
+export default Dashboard;

react/src/reducers/index.js

@@ -3,12 +3,16 @@ import { routerReducer } from 'react-router-redux';
 
 import { AddCoin } from './addcoin';
 import { toaster } from './toaster';
-//import { loader } from './loader';
+import { Main } from './main';
+import { Dashboard } from './dashboard';
+import { ActiveCoin } from './activeCoin';
 
 const rootReducer = combineReducers({
   AddCoin,
   toaster,
-  //loader,
+  Main,
+  Dashboard,
+  ActiveCoin,
   routing: routerReducer,
 });
 

react/src/reducers/main.js

@@ -0,0 +1,26 @@
+import { GET_ACTIVE_COINS, LOGIN, ACTIVE_HANDLE } from '../actions/actionCreators'
+
+export function Main(state = {
+  isLoggedIn: false,
+  activeCoins: [],
+}, action) {
+  switch (action.type) {
+    case GET_ACTIVE_COINS:
+      return Object.assign({}, state, {
+        activeCoins: action.activeCoins,
+        coins: action.coins,
+      });
+    case LOGIN:
+      return Object.assign({}, state, {
+        isLoggedIn: action.isLoggedIn,
+      });
+    case ACTIVE_HANDLE:
+      return Object.assign({}, state, {
+        isLoggedIn: action.isLoggedIn,
+      });
+    default:
+      return state;
+  }
+}
+
+export default Main;

react/src/store.js

@@ -11,6 +11,7 @@ const loggerMiddleware = createLogger();
 const defaultState = {
   toaster: null,
   AddCoin: null,
+  Main: null,
 };
 
 const enhancers = compose(window.devToolsExtension ? window.devToolsExtension() : f => f);

react/src/styles/index.scss

@@ -31,6 +31,26 @@
 @import '../assets/global/fonts/brand-icons/brand-icons.min.css';
 @import '../assets/skins/orange.min.css';
 
+#app > div {
+  height: 100%;
+}
+
+.page-main {
+  background: #f3f4f5;
+}
+
+#kmd_header_button button {
+  margin-right: 5px;
+}
+
+.widget.active .bg-white {
+  box-shadow: inset 1px 1px 10px #ccc;
+}
+
+body {
+  padding-top: 44px;
+}
+
 /*.toaster .single-toast:nth-child(0) {
   bottom: 12px;
 }

react/src/util/copyToClipboard.js

@@ -0,0 +1,16 @@
+export function copyToClipboard(value) {
+  var result;
+  var copyTextarea = document.querySelector('#js-copytextarea');
+
+  document.getElementById('js-copytextarea').value = value;
+  copyTextarea.select();
+
+  try {
+    var successful = document.execCommand('copy');
+    result = 1;
+  } catch (err) {
+    result = 0;
+  }
+
+  return result;
+};

react/www/index.html

@@ -14,7 +14,9 @@
     <link rel="icon" type="image/png" href="assets/images/android-chrome-192x192.png" sizes="192x192">
     <link rel="icon" type="image/png" href="assets/images/favicon-16x16.png" sizes="16x16">
 	</head>
-	<body class="page-login layout-full page-dark">
+	<body id="body" class="page-login layout-full page-dark">
-		<div id="app"></div>
+        <!-- style="opacity: 0; height: 1px; width: 1px" -->
+        <input type="text" id="js-copytextarea" style="opacity: 0; height: 10px; width: 200px" />
+		<div id="app" style="height: 100%"></div>
 	</body>
 </html>