From 3b0292455348414c62a21c223bc5ee3a19ca82cb Mon Sep 17 00:00:00 2001 From: Petr Balashov Date: Mon, 29 May 2017 19:15:53 +0200 Subject: [PATCH 01/17] es6 string literals (wip) --- react/src/actions/addCoin.js | 16 +++---- react/src/components/toaster/toaster-item.js | 14 +++--- react/src/components/toaster/toaster.js | 49 ++++++++++++-------- 3 files changed, 44 insertions(+), 35 deletions(-) diff --git a/react/src/actions/addCoin.js b/react/src/actions/addCoin.js index dfa13a0..2b5f5c7 100644 --- a/react/src/actions/addCoin.js +++ b/react/src/actions/addCoin.js @@ -49,10 +49,10 @@ export function addCoin(coin, mode, syncOnly, port) { }; return dispatch => { - startIguanaInstance(modeToValue[mode] + '/sync', coin) + startIguanaInstance(`${modeToValue[mode]}/sync`, coin) .then(function(json) { setTimeout(function() { - console.log('started ' + coin + ' / ' + modeToValue[mode] + ' fork', json); + console.log(`started ${coin} / ${modeToValue[mode]} fork`, json); dispatch(iguanaAddCoin(coin, mode, _acData, json.result)); }, 2000); }); @@ -79,12 +79,12 @@ export function iguanaAddCoin(coin, mode, acData, port) { 'timestamp': _timestamp, 'function': 'iguanaAddCoin', 'type': 'post', - 'url': 'http://127.0.0.1:' + (port ? port : Config.iguanaCorePort), + 'url': `http://127.0.0.1:${(port ? port : Config.iguanaCorePort)}`, 'payload': acData, 'status': 'pending', })); - return fetch('http://127.0.0.1:' + (port ? port : Config.iguanaCorePort), { + return fetch(`http://127.0.0.1:${(port ? port : Config.iguanaCorePort)}`, { method: 'POST', body: JSON.stringify(acData), }) @@ -160,12 +160,12 @@ export function shepherdHerd(coin, mode, path) { if (checkCoinType(coin) === 'ac') { acData = startAssetChain(path.result, coin, mode); const supply = startAssetChain(path.result, coin, mode, true); - herdData.ac_options.push('-ac_supply=' + supply); + herdData.ac_options.push(`-ac_supply=${supply}`); } console.log('herdData', herdData); return dispatch => { - return fetch('http://127.0.0.1:' + Config.agamaPort + '/shepherd/herd', { + return fetch(`http://127.0.0.1:${Config.agamaPort}/shepherd/herd`, { method: 'POST', headers: { 'Content-Type': 'application/json', @@ -192,7 +192,7 @@ export function addCoinResult(coin, mode) { }; return dispatch => { - dispatch(triggerToaster(true, coin + ' ' + translate('TOASTR.STARTED_IN') + ' ' + modeToValue[mode] + ' ' + translate('TOASTR.MODE'), translate('TOASTR.COIN_NOTIFICATION'), 'success')); + dispatch(triggerToaster(true, `${coin} ${translate('TOASTR.STARTED_IN')} ${modeToValue[mode]} ${translate('TOASTR.MODE')}`, translate('TOASTR.COIN_NOTIFICATION'), 'success')); dispatch(toggleAddcoinModal(false, false)); dispatch(getDexCoins()); } @@ -200,7 +200,7 @@ export function addCoinResult(coin, mode) { export function _shepherdGetConfig(coin, mode) { return dispatch => { - return fetch('http://127.0.0.1:' + Config.agamaPort + '/shepherd/getconf', { + return fetch(`http://127.0.0.1:${Config.agamaPort}/shepherd/getconf`, { method: 'POST', headers: { 'Content-Type': 'application/json', diff --git a/react/src/components/toaster/toaster-item.js b/react/src/components/toaster/toaster-item.js index 94904d7..b422710 100644 --- a/react/src/components/toaster/toaster-item.js +++ b/react/src/components/toaster/toaster-item.js @@ -1,6 +1,6 @@ -import React from "react"; -import {dismissToasterMessage} from "../../actions/actionCreators"; -import Store from "../../store"; +import React from 'react'; +import { dismissToasterMessage } from '../../actions/actionCreators'; +import Store from '../../store'; // each toast will be displayed for 5 seconds const DISPLAY_LENGTH_MILLIS = 5000; @@ -10,7 +10,6 @@ const DISPLAY_LENGTH_MILLIS = 5000; * each messages has a type, title and a content message */ class ToasterItem extends React.Component { - constructor(props) { super(props); this.state = { @@ -60,9 +59,10 @@ class ToasterItem extends React.Component { } return ( -
-
{ this.state.title }
{ this.state.message }
diff --git a/react/src/components/toaster/toaster.js b/react/src/components/toaster/toaster.js index d8fdf6d..5fa72fa 100644 --- a/react/src/components/toaster/toaster.js +++ b/react/src/components/toaster/toaster.js @@ -1,7 +1,7 @@ -import React from "react"; -import {dismissToasterMessage} from "../../actions/actionCreators"; -import Store from "../../store"; -import ToasterItem from "./toaster-item"; +import React from 'react'; +import { dismissToasterMessage } from '../../actions/actionCreators'; +import Store from '../../store'; +import ToasterItem from './toaster-item'; /** * Container component used for creating multiple toasts @@ -17,7 +17,7 @@ class Toaster extends React.Component { componentWillReceiveProps(props) { if (props && - props.toasts) { + props.toasts) { this.setState({ toasts: props.toasts, toastId: props.toasts.length @@ -34,24 +34,33 @@ class Toaster extends React.Component { Store.dispatch(dismissToasterMessage(toastId)); } + renderToasts() { + if (this.state.toasts && + this.state.toasts.length) { + this.state.toasts.map((toast) => { + // sets the toastId for all new toasts + if (!toast.toastId) { + toast.toastId = this.toastId++; + } + + return ( + + ); + }); + } else { + return null; + } + } + // render all current toasts render() { return ( -
diff --git a/react/src/components/dashboard/walletsData.js b/react/src/components/dashboard/walletsData.js index 592960c..1b551ad 100644 --- a/react/src/components/dashboard/walletsData.js +++ b/react/src/components/dashboard/walletsData.js @@ -82,6 +82,7 @@ class WalletsData extends React.Component { } } + // deprecated toggleCacheApi() { const _useCache = !this.state.useCache; @@ -463,6 +464,7 @@ class WalletsData extends React.Component { } }*/ + // deprecated renderUseCacheToggle() { if (this.props.ActiveCoin.mode === 'basilisk') { return ( @@ -548,11 +550,11 @@ class WalletsData extends React.Component { this.props.Dashboard.activeHandle[this.props.ActiveCoin.coin] && this.props.ActiveCoin.mode === 'basilisk') { return ( -
+
-
+
+ style={{ backgroundImage: `url("assets/images/bg/${this.props.activeSection}_transparent_header_bg.png")`, backgroundRepeat: 'no-repeat', backgroundPosition: '0%' }}>

EasyDEX

  1. { translate('INDEX.DASHBOARD') }
    2. diff --git a/react/src/components/dashboard/walletsNative.js b/react/src/components/dashboard/walletsNative.js index 9951832..1e2d5ef 100644 --- a/react/src/components/dashboard/walletsNative.js +++ b/react/src/components/dashboard/walletsNative.js @@ -29,10 +29,10 @@ class WalletsNative extends React.Component { return (
    -
    +
    1. - { this.props.ActiveCoin.coin } + { this.props.ActiveCoin.coin }
    diff --git a/react/src/components/dashboard/walletsNativeSend.js b/react/src/components/dashboard/walletsNativeSend.js index 69884ef..52e3e00 100644 --- a/react/src/components/dashboard/walletsNativeSend.js +++ b/react/src/components/dashboard/walletsNativeSend.js @@ -80,7 +80,7 @@ class WalletsNativeSend extends React.Component { renderAddressList() { return ( -
    +
    - + +
    ); diff --git a/react/src/components/main/main.js b/react/src/components/main/main.js index 9eebbd9..461ae17 100644 --- a/react/src/components/main/main.js +++ b/react/src/components/main/main.js @@ -8,6 +8,8 @@ import { iguanaActiveHandle } from '../../actions/actionCreators'; +const IGUANA_ACTIVE_HANDLE_TIMEOUT = 30000; + class Main extends React.Component { constructor(props) { super(props); @@ -24,7 +26,7 @@ class Main extends React.Component { Store.dispatch(iguanaActiveHandle()); const _iguanaActiveHandle = setInterval(function() { Store.dispatch(iguanaActiveHandle()); - }, 30000); + }, IGUANA_ACTIVE_HANDLE_TIMEOUT); this.setState(Object.assign({}, this.state, { activeHandleInterval: _iguanaActiveHandle, From 9e0b2c3e0d6f462055eaa5da5139c6a62d2df8c5 Mon Sep 17 00:00:00 2001 From: pbca26 Date: Wed, 31 May 2017 20:58:56 +0300 Subject: [PATCH 06/17] merge fix --- react/src/styles/index.scss | 15 +-------------- 1 file changed, 1 insertion(+), 14 deletions(-) diff --git a/react/src/styles/index.scss b/react/src/styles/index.scss index 7eceb0c..ff355cf 100644 --- a/react/src/styles/index.scss +++ b/react/src/styles/index.scss @@ -501,17 +501,4 @@ input:checked + .slider:before { #app { height: 100%; -} - -/*.toaster .single-toast:nth-child(0) { - bottom: 12px; -} -.toaster .single-toast:nth-child(1) { - bottom: 102px; -} -.toaster .single-toast:nth-child(2) { - bottom: 192px; -} -.toaster .single-toast:nth-child(3) { - bottom: 282px; -}*/ \ No newline at end of file +} \ No newline at end of file From 8563d273d25a2f1e4dea6701194150d066c7074a Mon Sep 17 00:00:00 2001 From: pbca26 Date: Wed, 31 May 2017 21:33:50 +0300 Subject: [PATCH 07/17] remaining es6 fat arrows --- react/src/components/addcoin/addcoin.js | 8 +++---- .../src/components/dashboard/coinTileItem.js | 24 ++++++++++++------- react/src/components/login/login.js | 7 ++++-- 3 files changed, 24 insertions(+), 15 deletions(-) diff --git a/react/src/components/addcoin/addcoin.js b/react/src/components/addcoin/addcoin.js index be16812..4309a62 100644 --- a/react/src/components/addcoin/addcoin.js +++ b/react/src/components/addcoin/addcoin.js @@ -97,12 +97,12 @@ class AddCoin extends React.Component { modalClassName: props.display ? 'show fade' : 'show fade', })); - setTimeout(function() { + setTimeout(() => { this.setState(Object.assign({}, this.state, { display: props.display, modalClassName: props.display ? 'show in' : 'hide', })); - }.bind(this), 100); + }, 100); } } @@ -216,7 +216,7 @@ class AddCoin extends React.Component { for (let i = 1; i < this.state.coins.length; i++) { const _item = this.state.coins[i]; - setTimeout(function() { + setTimeout(() => { Store.dispatch(addCoin( _item.selectedCoin.split('|')[0], _item.mode, @@ -233,7 +233,7 @@ class AddCoin extends React.Component { Store.dispatch(toggleAddcoinModal(false, false)); } - }.bind(this), 2000 * i); + }, 2000 * i); } } diff --git a/react/src/components/dashboard/coinTileItem.js b/react/src/components/dashboard/coinTileItem.js index 23607a7..5b5a40e 100644 --- a/react/src/components/dashboard/coinTileItem.js +++ b/react/src/components/dashboard/coinTileItem.js @@ -22,6 +22,9 @@ import { import Store from '../../store'; const BASILISK_CACHE_UPDATE_TIMEOUT = 240000; +const IGUNA_ACTIVE_HANDLE_TIMEOUT = 3000; +const IGUNA_ACTIVE_HANDLE_TIMEOUT_KMD_NATIVE = 15000; +const NATIVE_MIN_SYNC_PERCENTAGE_THRESHOLD = 90; class CoinTileItem extends React.Component { constructor(props) { @@ -41,10 +44,13 @@ class CoinTileItem extends React.Component { dispatchCoinActions(coin, mode) { if (mode === 'native') { Store.dispatch(iguanaActiveHandle(true)); + const syncPercentage = this.props.Dashboard && this.props.Dashboard.progress && (parseFloat(parseInt(this.props.Dashboard.progress.blocks, 10) * 100 / parseInt(this.props.Dashboard.progress.longestchain, 10)).toFixed(2)).replace('NaN', 0); + if (this.props.Dashboard.progress && this.props.Dashboard.progress.blocks && this.props.Dashboard.progress.longestchain && - this.props.Dashboard.progress.blocks === this.props.Dashboard.progress.longestchain) { + syncPercentage && + syncPercentage >= NATIVE_MIN_SYNC_PERCENTAGE_THRESHOLD) { Store.dispatch(getSyncInfoNative(coin, true)); Store.dispatch(getKMDBalanceTotal(coin)); Store.dispatch(getNativeTxHistory(coin)); @@ -63,6 +69,7 @@ class CoinTileItem extends React.Component { } if (mode === 'basilisk') { const useAddress = this.props.ActiveCoin.mainBasiliskAddress ? this.props.ActiveCoin.mainBasiliskAddress : this.props.Dashboard.activeHandle[coin]; + Store.dispatch(iguanaActiveHandle(true)); Store.dispatch(getKMDAddressesNative(coin, mode, useAddress)); Store.dispatch(getShepherdCache(JSON.parse(sessionStorage.getItem('IguanaActiveAccount')).pubkey, coin)); @@ -74,8 +81,8 @@ class CoinTileItem extends React.Component { if (!this.props.ActiveCoin.addresses) { Store.dispatch(getAddressesByAccount(coin, mode)); } + Store.dispatch(getBasiliskTransactionsList(coin, useAddress)); - //Store.dispatch(iguanaEdexBalance(coin, mode)); } } } @@ -89,15 +96,15 @@ class CoinTileItem extends React.Component { this.dispatchCoinActions(coin, mode); if (mode === 'full') { - const _iguanaActiveHandle = setInterval(function() { + const _iguanaActiveHandle = setInterval(() => { this.dispatchCoinActions(coin, mode); - }.bind(this), 3000); + }, IGUNA_ACTIVE_HANDLE_TIMEOUT); Store.dispatch(startInterval('sync', _iguanaActiveHandle)); } if (mode === 'native') { - const _iguanaActiveHandle = setInterval(function() { + const _iguanaActiveHandle = setInterval(() => { this.dispatchCoinActions(coin, mode); - }.bind(this), coin === 'KMD' ? 15000 : 3000); + }, coin === 'KMD' ? IGUNA_ACTIVE_HANDLE_TIMEOUT_KMD_NATIVE : IGUNA_ACTIVE_HANDLE_TIMEOUT); Store.dispatch(startInterval('sync', _iguanaActiveHandle)); } if (mode === 'basilisk') { @@ -113,9 +120,9 @@ class CoinTileItem extends React.Component { 'address': _basiliskMainAddress, })); - const _iguanaActiveHandle = setInterval(function() { + const _iguanaActiveHandle = setInterval(() => { this.dispatchCoinActions(coin, mode); - }.bind(this), 3000); + }, IGUNA_ACTIVE_HANDLE_TIMEOUT); const _basiliskCache = setInterval(() => { Store.dispatch(fetchNewCacheData({ @@ -128,7 +135,6 @@ class CoinTileItem extends React.Component { }, BASILISK_CACHE_UPDATE_TIMEOUT); Store.dispatch(startInterval('sync', _iguanaActiveHandle)); Store.dispatch(startInterval('basilisk', _basiliskCache)); - // basilisk } } } diff --git a/react/src/components/login/login.js b/react/src/components/login/login.js index 4e70ca3..30f8593 100644 --- a/react/src/components/login/login.js +++ b/react/src/components/login/login.js @@ -14,6 +14,9 @@ import { import Store from '../../store'; import { PassPhraseGenerator } from '../../util/crypto/passphrasegenerator'; +const IGUNA_ACTIVE_HANDLE_TIMEOUT = 3000; +const IGUNA_ACTIVE_COINS_TIMEOUT = 10000; + class Login extends React.Component { constructor(props) { super(props); @@ -43,7 +46,7 @@ class Login extends React.Component { const _iguanaActiveHandle = setInterval(() => { Store.dispatch(getSyncOnlyForks()); - }, 3000); + }, IGUNA_ACTIVE_HANDLE_TIMEOUT); Store.dispatch(startInterval('syncOnly', _iguanaActiveHandle)); Store.dispatch(toggleSyncOnlyModal(true)); @@ -85,7 +88,7 @@ class Login extends React.Component { if (!this.props.Interval.interval.activeCoins) { const _iguanaActiveCoins = setInterval(() => { Store.dispatch(getDexCoins()); - }, 10000); + }, IGUNA_ACTIVE_COINS_TIMEOUT); Store.dispatch(startInterval('activeCoins', _iguanaActiveCoins)); } From e02a01cf5b7b1fcef89e2b57d0ce12a90aba3586 Mon Sep 17 00:00:00 2001 From: pbca26 Date: Thu, 1 Jun 2017 11:54:20 +0300 Subject: [PATCH 08/17] settings tabs height fix --- react/src/components/dashboard/settings.js | 94 +++++++++++++++------- 1 file changed, 66 insertions(+), 28 deletions(-) diff --git a/react/src/components/dashboard/settings.js b/react/src/components/dashboard/settings.js index a7f183b..c87e18d 100644 --- a/react/src/components/dashboard/settings.js +++ b/react/src/components/dashboard/settings.js @@ -23,6 +23,7 @@ import AddCoinOptionsACFiat from '../addcoin/addcoinOptionsACFiat'; 2) add fiat section 3) kickstart section 4) batch export/import wallet addresses + 5) export keys, add coin selector */ class Settings extends React.Component { constructor(props) { @@ -33,6 +34,7 @@ class Settings extends React.Component { debugTarget: 'iguana', activeTabHeight: '10px', appSettings: {}, + tabElId: null, }; this.exportWifKeys = this.exportWifKeys.bind(this); this.updateInput = this.updateInput.bind(this); @@ -52,14 +54,29 @@ class Settings extends React.Component { Store.dispatch(getAppInfo()); } - openTab(elemId, tab) { - console.log(`#${elemId}.panel-collapse .panel-body`); - const _height = document.querySelector(`#${elemId} .panel-collapse .panel-body`).offsetHeight; + componentWillReceiveProps(props) { + if (this.state.tabElId) { + console.log('rerender opened tab'); + const _height = document.querySelector(`#${this.state.tabElId} .panel-collapse .panel-body`).offsetHeight; + + this.setState(Object.assign({}, this.state, { + activeTab: this.state.activeTab, + activeTabHeight: _height, + tabElId: this.state.tabElId, + })); + } + } - this.setState(Object.assign({}, this.state, { - activeTab: tab, - activeTabHeight: _height, - })); + openTab(elemId, tab) { + setTimeout(() => { + const _height = document.querySelector(`#${elemId} .panel-collapse .panel-body`).offsetHeight; + + this.setState(Object.assign({}, this.state, { + activeTab: tab, + activeTabHeight: _height, + tabElId: elemId, + })); + }, 100); } exportWifKeys() { @@ -109,8 +126,8 @@ class Settings extends React.Component { if (releaseInfo) { return ( -
    -
    this.openTab('AppInfo', 8) }> +
    this.openTab('AppInfo', 8) }> +
    { translate('SETTINGS.APP_INFO') } @@ -315,8 +332,11 @@ class Settings extends React.Component {

    { translate('INDEX.WALLET_SETTINGS') }

    -
    -
    this.openTab('WalletInfo', 0) }> +
    this.openTab('WalletInfo', 0) }> +
    { translate('INDEX.WALLET_INFO') } @@ -378,8 +398,11 @@ class Settings extends React.Component {
    -
    -
    this.openTab('AddNodeforCoin', 1) }> +
    this.openTab('AddNodeforCoin', 1) }> +
    { translate('INDEX.ADD_NODE') } @@ -469,8 +492,11 @@ class Settings extends React.Component {
    -
    -
    this.openTab('DumpWallet', 2) }> +
    this.openTab('DumpWallet', 2) }> +
    { translate('INDEX.WALLET_BACKUP') } @@ -485,11 +511,11 @@ class Settings extends React.Component {
    -
    -
    this.openTab('FiatCurrencySettings', 3) }> +
    this.openTab('FiatCurrencySettings', 3) }> +
    { translate('INDEX.FIAT_CURRENCY') } @@ -504,8 +530,11 @@ class Settings extends React.Component {
    -
    -
    this.openTab('ExportKeys', 4) }> +
    this.openTab('ExportKeys', 4) }> +
    { translate('INDEX.EXPORT_KEYS') } @@ -565,8 +594,11 @@ class Settings extends React.Component {
    -
    -
    this.openTab('ImportKeys', 5) }> +
    this.openTab('ImportKeys', 5) }> +
    { translate('INDEX.IMPORT_KEYS') } @@ -611,8 +643,11 @@ class Settings extends React.Component {
    -
    -
    this.openTab('DebugLog', 6) }> +
    this.openTab('DebugLog', 6) }> +
    { translate('INDEX.DEBUG_LOG') } @@ -669,8 +704,11 @@ class Settings extends React.Component {
    -
    -
    this.openTab('AppSettings', 7) }> +
    this.openTab('AppSettings', 7) }> +
    { translate('SETTINGS.APP_CONFIG') } (config.json) From 54733ca6b45dd517a3519ab9aea81d2da845e960 Mon Sep 17 00:00:00 2001 From: pbca26 Date: Thu, 1 Jun 2017 12:41:21 +0300 Subject: [PATCH 09/17] settings debug log render --- react/src/components/dashboard/settings.js | 24 ++++++++++++++++++++-- react/src/translate/en.js | 1 + 2 files changed, 23 insertions(+), 2 deletions(-) diff --git a/react/src/components/dashboard/settings.js b/react/src/components/dashboard/settings.js index c87e18d..77096ed 100644 --- a/react/src/components/dashboard/settings.js +++ b/react/src/components/dashboard/settings.js @@ -56,7 +56,6 @@ class Settings extends React.Component { componentWillReceiveProps(props) { if (this.state.tabElId) { - console.log('rerender opened tab'); const _height = document.querySelector(`#${this.state.tabElId} .panel-collapse .panel-body`).offsetHeight; this.setState(Object.assign({}, this.state, { @@ -311,6 +310,27 @@ class Settings extends React.Component { }); } + renderDebugLogData() { + if (this.props.Settings.debugLog) { + const _debugLogDataRows = this.props.Settings.debugLog.split('\n'); + + if (_debugLogDataRows && + _debugLogDataRows.length) { + return _debugLogDataRows.map((_row) => +
    { _row }
    + ); + } else { + return ( + { translate('INDEX.EMPTY_DEBUG_LOG') } + ); + } + } else { + return null; + } + } + renderLB(_translationID) { const _translationComponents = translate(_translationID).split('
    '); @@ -697,7 +717,7 @@ class Settings extends React.Component { onClick={ this.readDebugLog }>{ translate('INDEX.LOAD_DEBUG_LOG') }
    -
    { this.props.Settings.debugLog }
    +
    { this.renderDebugLogData() }
    diff --git a/react/src/translate/en.js b/react/src/translate/en.js index d88b85b..8cf346d 100644 --- a/react/src/translate/en.js +++ b/react/src/translate/en.js @@ -1,6 +1,7 @@ export const _lang = { 'EN': { 'INDEX': { + 'EMPTY_DEBUG_LOG': 'Debug.log is empty', 'RESTART': 'Restart', 'WALLET_INFO': 'Wallet Info', 'ADD_COIN': 'Add Coin', From 71a4d23434fbfa300ce71510049e048cd7bfc797 Mon Sep 17 00:00:00 2001 From: pbca26 Date: Thu, 1 Jun 2017 12:45:45 +0300 Subject: [PATCH 10/17] settings tab content collapsed height fix --- react/src/components/dashboard/settings.js | 20 ++++++++++---------- react/src/styles/index.scss | 2 +- 2 files changed, 11 insertions(+), 11 deletions(-) diff --git a/react/src/components/dashboard/settings.js b/react/src/components/dashboard/settings.js index 77096ed..c4e23e7 100644 --- a/react/src/components/dashboard/settings.js +++ b/react/src/components/dashboard/settings.js @@ -32,7 +32,7 @@ class Settings extends React.Component { activeTab: 0, debugLinesCount: 10, debugTarget: 'iguana', - activeTabHeight: '10px', + activeTabHeight: '0', appSettings: {}, tabElId: null, }; @@ -133,7 +133,7 @@ class Settings extends React.Component {
    @@ -363,7 +363,7 @@ class Settings extends React.Component {
    @@ -429,7 +429,7 @@ class Settings extends React.Component {
    @@ -523,7 +523,7 @@ class Settings extends React.Component {
    @@ -542,7 +542,7 @@ class Settings extends React.Component {
    @@ -561,7 +561,7 @@ class Settings extends React.Component {
    @@ -625,7 +625,7 @@ class Settings extends React.Component {
    @@ -674,7 +674,7 @@ class Settings extends React.Component {

    { translate('INDEX.DEBUG_LOG_DESC') }

    @@ -735,7 +735,7 @@ class Settings extends React.Component {

    diff --git a/react/src/styles/index.scss b/react/src/styles/index.scss index ff355cf..1e201b9 100644 --- a/react/src/styles/index.scss +++ b/react/src/styles/index.scss @@ -272,7 +272,7 @@ body { transition: all .3s; &.collapse { - height: 10px; + height: 0; } } } From 4868b29bb893af809c2dd5a85a1a2986162e2f96 Mon Sep 17 00:00:00 2001 From: pbca26 Date: Thu, 1 Jun 2017 20:39:56 +0300 Subject: [PATCH 11/17] navbar profile menu outside click handler --- react/src/components/dashboard/navbar.js | 23 +++++++++++++++++++++++ 1 file changed, 23 insertions(+) diff --git a/react/src/components/dashboard/navbar.js b/react/src/components/dashboard/navbar.js index 6572b2b..407baa2 100755 --- a/react/src/components/dashboard/navbar.js +++ b/react/src/components/dashboard/navbar.js @@ -19,6 +19,29 @@ class Navbar extends React.Component { }; this.openDropMenu = this.openDropMenu.bind(this); this.logout = this.logout.bind(this); + this.handleClickOutside = this.handleClickOutside.bind(this); + } + + componentWillMount() { + document.addEventListener('click', this.handleClickOutside, false); + } + + componentWillUnmount() { + document.removeEventListener('click', this.handleClickOutside, false); + } + + handleClickOutside(e) { + console.log(e); + + if (e.srcElement.className !== 'dropdown-menu' && + e.srcElement.alt !== 'iguana profile pic' && + e.srcElement.offsetParent.className !== 'avatar avatar-online' && + e.srcElement.className.indexOf('navbar-avatar') === -1 && + (e.path && e.path[4] && e.path[4].className.indexOf('dropdown-menu') === -1)) { + this.setState({ + openDropMenu: false, + }); + } } openDropMenu() { From 3e81b97637d99f906b3145294ce416d4507f4de1 Mon Sep 17 00:00:00 2001 From: pbca26 Date: Fri, 2 Jun 2017 09:50:23 +0300 Subject: [PATCH 12/17] limit http stack log max length --- react/src/reducers/dashboard.js | 31 ++++++++++++++++++++++++++++++- 1 file changed, 30 insertions(+), 1 deletion(-) diff --git a/react/src/reducers/dashboard.js b/react/src/reducers/dashboard.js index cf0923f..ac64a60 100644 --- a/react/src/reducers/dashboard.js +++ b/react/src/reducers/dashboard.js @@ -11,6 +11,8 @@ import { TOGGLE_NOTIFICATIONS_MODAL } from '../actions/storeType'; +const HTTP_STACK_MAX_ENTRIES = 150; // limit stack mem length to N records per type + export function Dashboard(state = { activeSection: 'wallets', activeHandle: null, @@ -69,6 +71,11 @@ export function Dashboard(state = { }); case LOG_GUI_HTTP: let _guiLogState = state.guiLog; + let _guiLogStateTrim = { + error: [], + success: [], + pending: [] + }; if (_guiLogState[action.timestamp]) { _guiLogState[action.timestamp].status = action.log.status; @@ -77,8 +84,30 @@ export function Dashboard(state = { _guiLogState[action.timestamp] = action.log; } + for (let timestamp in _guiLogState) { + if (_guiLogState[timestamp].status === 'error') { + _guiLogStateTrim.error.push(_guiLogState[timestamp]); + } + if (_guiLogState[timestamp].status === 'success') { + _guiLogStateTrim.success.push(_guiLogState[timestamp]); + } + if (_guiLogState[timestamp].status === 'pending') { + _guiLogStateTrim.pending.push(_guiLogState[timestamp]); + } + } + + let _guiLogStateNew = {}; + for (let _key in _guiLogStateTrim) { + if (_guiLogStateTrim[_key].length > HTTP_STACK_MAX_ENTRIES) { + _guiLogStateTrim[_key].shift(); + } + for (let i = 0; i < _guiLogStateTrim[_key].length; i++) { + _guiLogStateNew[_guiLogStateTrim[_key][i].timestamp] = _guiLogStateTrim[_key][i]; + } + } + return Object.assign({}, state, { - guiLog: _guiLogState, + guiLog: _guiLogStateNew, }); default: return state; From 3bda1e58647200bbdd991341ad1ca98b8a596378 Mon Sep 17 00:00:00 2001 From: pbca26 Date: Fri, 2 Jun 2017 10:17:35 +0300 Subject: [PATCH 13/17] pending requests spinner --- react/src/components/dashboard/navbar.js | 15 +-- .../src/components/dashboard/notifications.js | 7 ++ react/src/styles/index.scss | 100 ++++++++++++++++-- 3 files changed, 104 insertions(+), 18 deletions(-) diff --git a/react/src/components/dashboard/navbar.js b/react/src/components/dashboard/navbar.js index 407baa2..dc278d6 100755 --- a/react/src/components/dashboard/navbar.js +++ b/react/src/components/dashboard/navbar.js @@ -31,8 +31,6 @@ class Navbar extends React.Component { } handleClickOutside(e) { - console.log(e); - if (e.srcElement.className !== 'dropdown-menu' && e.srcElement.alt !== 'iguana profile pic' && e.srcElement.offsetParent.className !== 'avatar avatar-online' && @@ -133,11 +131,6 @@ class Navbar extends React.Component { Atomic Explorer -

  2. - this.openSyncOnlyModal() }> - { translate('ADD_COIN.SYNC_ONLY') } - -
    3. { this.renderNotificationsModal() }
    diff --git a/react/src/styles/index.scss b/react/src/styles/index.scss index 1e201b9..4d3038d 100644 --- a/react/src/styles/index.scss +++ b/react/src/styles/index.scss @@ -381,10 +381,6 @@ input:checked + .slider:before { text-align: center; } -#section-dashboard .navbar-brand { - padding: 10px 20px; -} - .breadcrumb > li + li:before { display: none; } @@ -457,12 +453,6 @@ input:checked + .slider:before { } } -.notifications-badge.stick-to-top { - top: 38px; - left: 30px; - z-index: 1500; -} - .notifications-badge { position: fixed; bottom: 10px; @@ -475,7 +465,6 @@ input:checked + .slider:before { margin-left: 2px; font-weight: bold; } - .badge.success { color: #3c763d; background-color: #dff0d8; @@ -491,6 +480,43 @@ input:checked + .slider:before { background-color: #f2dede; border-color: #ebccd1; } + + .spinner-hide { + >div { + display: none; + } + } + + .spinner { + position: absolute; + left: 60px; + bottom: -12px; + + >div { + background-color: #fff; + margin-right: 1px; + width: 3px; + } + } + + &.stick-to-top { + top: -3px; + left: 470px; + z-index: 1500; + + .spinner { + display: inline-block; + position: relative; + left: -4px; + bottom: -16px; + + >div { + background-color: #00bcd4; + margin-right: 1px; + width: 3px; + } + } + } } #js-copytextarea { @@ -501,4 +527,56 @@ input:checked + .slider:before { #app { height: 100%; +} + +.spinner { + width: 50px; + height: 40px; + text-align: center; + font-size: 10px; +} + +.spinner > div { + background-color: #333; + height: 100%; + width: 6px; + display: inline-block; + + -webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out; + animation: sk-stretchdelay 1.2s infinite ease-in-out; +} + +.spinner .rect2 { + -webkit-animation-delay: -1.1s; + animation-delay: -1.1s; +} + +.spinner .rect3 { + -webkit-animation-delay: -1.0s; + animation-delay: -1.0s; +} + +.spinner .rect4 { + -webkit-animation-delay: -0.9s; + animation-delay: -0.9s; +} + +.spinner .rect5 { + -webkit-animation-delay: -0.8s; + animation-delay: -0.8s; +} + +@-webkit-keyframes sk-stretchdelay { + 0%, 40%, 100% { -webkit-transform: scaleY(0.4) } + 20% { -webkit-transform: scaleY(1.0) } +} + +@keyframes sk-stretchdelay { + 0%, 40%, 100% { + transform: scaleY(0.4); + -webkit-transform: scaleY(0.4); + } 20% { + transform: scaleY(1.0); + -webkit-transform: scaleY(1.0); + } } \ No newline at end of file From 5aae4cddc447b04f74e2232476494739f0fac0a1 Mon Sep 17 00:00:00 2001 From: pbca26 Date: Fri, 2 Jun 2017 10:58:28 +0300 Subject: [PATCH 14/17] moved actions to a separate folder --- react/src/actions/actionCreators.js | 64 +++++++++---------- react/src/actions/{ => actions}/addCoin.js | 8 +-- .../actions/{ => actions}/addressBalance.js | 18 ++++-- react/src/actions/{ => actions}/atomic.js | 6 +- .../actions/{ => actions}/basiliskCache.js | 6 +- .../{ => actions}/basiliskProcessAddress.js | 5 +- .../{ => actions}/basiliskTxHistory.js | 3 +- react/src/actions/{ => actions}/coinList.js | 3 +- .../src/actions/{ => actions}/copyAddress.js | 10 +-- .../src/actions/{ => actions}/createWallet.js | 5 +- react/src/actions/{ => actions}/dexCoins.js | 3 +- .../src/actions/{ => actions}/edexBalance.js | 6 +- react/src/actions/{ => actions}/edexGetTx.js | 3 +- .../actions/{ => actions}/fullTxHistory.js | 3 +- .../actions/{ => actions}/getAddrByAccount.js | 6 +- .../actions/{ => actions}/iguanaHelpers.js | 5 +- .../actions/{ => actions}/iguanaInstance.js | 3 +- react/src/actions/{ => actions}/log.js | 6 +- react/src/actions/{ => actions}/logout.js | 6 +- .../actions/{ => actions}/nativeBalance.js | 6 +- .../actions/{ => actions}/nativeNewAddress.js | 5 +- react/src/actions/{ => actions}/nativeSend.js | 10 +-- .../actions/{ => actions}/nativeSyncInfo.js | 6 +- .../actions/{ => actions}/nativeTxHistory.js | 3 +- react/src/actions/{ => actions}/notary.js | 17 +++-- react/src/actions/{ => actions}/openAlias.js | 6 +- .../actions/{ => actions}/sendFullBasilisk.js | 15 ++--- react/src/actions/{ => actions}/settings.js | 22 ++++--- react/src/actions/{ => actions}/syncInfo.js | 6 +- react/src/actions/{ => actions}/syncOnly.js | 13 ++-- react/src/actions/{ => actions}/sysInfo.js | 3 +- react/src/actions/{ => actions}/walletAuth.js | 13 ++-- 32 files changed, 145 insertions(+), 149 deletions(-) rename react/src/actions/{ => actions}/addCoin.js (97%) rename react/src/actions/{ => actions}/addressBalance.js (97%) rename react/src/actions/{ => actions}/atomic.js (91%) rename react/src/actions/{ => actions}/basiliskCache.js (97%) rename react/src/actions/{ => actions}/basiliskProcessAddress.js (96%) rename react/src/actions/{ => actions}/basiliskTxHistory.js (93%) rename react/src/actions/{ => actions}/coinList.js (93%) rename react/src/actions/{ => actions}/copyAddress.js (66%) rename react/src/actions/{ => actions}/createWallet.js (93%) rename react/src/actions/{ => actions}/dexCoins.js (94%) rename react/src/actions/{ => actions}/edexBalance.js (95%) rename react/src/actions/{ => actions}/edexGetTx.js (94%) rename react/src/actions/{ => actions}/fullTxHistory.js (94%) rename react/src/actions/{ => actions}/getAddrByAccount.js (93%) rename react/src/actions/{ => actions}/iguanaHelpers.js (92%) rename react/src/actions/{ => actions}/iguanaInstance.js (96%) rename react/src/actions/{ => actions}/log.js (92%) rename react/src/actions/{ => actions}/logout.js (93%) rename react/src/actions/{ => actions}/nativeBalance.js (92%) rename react/src/actions/{ => actions}/nativeNewAddress.js (94%) rename react/src/actions/{ => actions}/nativeSend.js (96%) rename react/src/actions/{ => actions}/nativeSyncInfo.js (96%) rename react/src/actions/{ => actions}/nativeTxHistory.js (95%) rename react/src/actions/{ => actions}/notary.js (93%) rename react/src/actions/{ => actions}/openAlias.js (82%) rename react/src/actions/{ => actions}/sendFullBasilisk.js (94%) rename react/src/actions/{ => actions}/settings.js (96%) rename react/src/actions/{ => actions}/syncInfo.js (93%) rename react/src/actions/{ => actions}/syncOnly.js (85%) rename react/src/actions/{ => actions}/sysInfo.js (88%) rename react/src/actions/{ => actions}/walletAuth.js (96%) diff --git a/react/src/actions/actionCreators.js b/react/src/actions/actionCreators.js index 94da256..ea03f1b 100644 --- a/react/src/actions/actionCreators.js +++ b/react/src/actions/actionCreators.js @@ -8,38 +8,38 @@ import { logGuiHttp, getAgamaLog, guiLogState -} from './log'; - -export * from './nativeSyncInfo'; -export * from './basiliskCache'; -export * from './nativeSend'; -export * from './coinList'; -export * from './createWallet'; -export * from './nativeTxHistory'; -export * from './nativeBalance'; -export * from './nativeNewAddress'; -export * from './logout'; -export * from './basiliskProcessAddress'; -export * from './edexGetTx'; -export * from './sendFullBasilisk'; -export * from './settings'; -export * from './syncOnly'; -export * from './iguanaInstance'; -export * from './notary'; -export * from './edexBalance'; -export * from './addCoin'; -export * from './addressBalance'; -export * from './syncInfo'; -export * from './getAddrByAccount'; -export * from './atomic'; -export * from './walletAuth'; -export * from './openAlias'; -export * from './copyAddress'; -export * from './sysInfo'; -export * from './dexCoins'; -export * from './fullTxHistory'; -export * from './basiliskTxHistory'; -export * from './iguanaHelpers'; +} from './actions/log'; + +export * from './actions/nativeSyncInfo'; +export * from './actions/basiliskCache'; +export * from './actions/nativeSend'; +export * from './actions/coinList'; +export * from './actions/createWallet'; +export * from './actions/nativeTxHistory'; +export * from './actions/nativeBalance'; +export * from './actions/nativeNewAddress'; +export * from './actions/logout'; +export * from './actions/basiliskProcessAddress'; +export * from './actions/edexGetTx'; +export * from './actions/sendFullBasilisk'; +export * from './actions/settings'; +export * from './actions/syncOnly'; +export * from './actions/iguanaInstance'; +export * from './actions/notary'; +export * from './actions/edexBalance'; +export * from './actions/addCoin'; +export * from './actions/addressBalance'; +export * from './actions/syncInfo'; +export * from './actions/getAddrByAccount'; +export * from './actions/atomic'; +export * from './actions/walletAuth'; +export * from './actions/openAlias'; +export * from './actions/copyAddress'; +export * from './actions/sysInfo'; +export * from './actions/dexCoins'; +export * from './actions/fullTxHistory'; +export * from './actions/basiliskTxHistory'; +export * from './actions/iguanaHelpers'; export let Config; diff --git a/react/src/actions/addCoin.js b/react/src/actions/actions/addCoin.js similarity index 97% rename from react/src/actions/addCoin.js rename to react/src/actions/actions/addCoin.js index 7fd8e06..de68e0a 100644 --- a/react/src/actions/addCoin.js +++ b/react/src/actions/actions/addCoin.js @@ -1,12 +1,11 @@ -import * as storeType from './storeType'; -import { translate } from '../translate/translate'; +import { translate } from '../../translate/translate'; import { triggerToaster, Config, toggleAddcoinModal, getDexCoins, startIguanaInstance -} from './actionCreators'; +} from '../actionCreators'; import { logGuiHttp, guiLogState @@ -17,7 +16,7 @@ import { startCrypto, checkCoinType, checkAC -} from '../components/addcoin/payload'; +} from '../../components/addcoin/payload'; export function addCoin(coin, mode, syncOnly, port) { if (mode === '-1') { @@ -164,7 +163,6 @@ export function shepherdHerd(coin, mode, path) { herdData.ac_options.push(`-ac_supply=${supply}`); } - console.log('herdData', herdData); return dispatch => { return fetch(`http://127.0.0.1:${Config.agamaPort}/shepherd/herd`, { method: 'POST', diff --git a/react/src/actions/addressBalance.js b/react/src/actions/actions/addressBalance.js similarity index 97% rename from react/src/actions/addressBalance.js rename to react/src/actions/actions/addressBalance.js index 63150d0..3713e34 100644 --- a/react/src/actions/addressBalance.js +++ b/react/src/actions/actions/addressBalance.js @@ -1,10 +1,12 @@ -import * as storeType from './storeType'; +import { + ACTIVE_COIN_GET_ADDRESSES +} from '../storeType'; import { triggerToaster, Config, shepherdGroomPost, getPassthruAgent -} from './actionCreators'; +} from '../actionCreators'; import { logGuiHttp, guiLogState @@ -12,13 +14,16 @@ import { function getKMDAddressesNativeState(json) { return { - type: storeType.ACTIVE_COIN_GET_ADDRESSES, + type: ACTIVE_COIN_GET_ADDRESSES, addresses: json, } } export function getKMDAddressesNative(coin, mode, currentAddress) { - const type = ['public', 'private']; + const type = [ + 'public', + 'private' + ]; if (mode !== 'native') { type.pop(); @@ -217,7 +222,7 @@ export function getKMDAddressesNative(coin, mode, currentAddress) { newAddressArray[a] = []; for (let b = 0; b < result[a].length; b++) { - var filteredArray; + let filteredArray; if (mode === 'basilisk') { filteredArray = json.map(res => res.amount); @@ -226,8 +231,7 @@ export function getKMDAddressesNative(coin, mode, currentAddress) { } let sum = 0; - - for (let i=0; i < filteredArray.length; i++) { + for (let i = 0; i < filteredArray.length; i++) { sum += filteredArray[i]; } diff --git a/react/src/actions/atomic.js b/react/src/actions/actions/atomic.js similarity index 91% rename from react/src/actions/atomic.js rename to react/src/actions/actions/atomic.js index 6faf20f..7330d1e 100644 --- a/react/src/actions/atomic.js +++ b/react/src/actions/actions/atomic.js @@ -1,8 +1,8 @@ -import * as storeType from './storeType'; +import { ATOMIC } from '../storeType'; import { triggerToaster, Config -} from './actionCreators'; +} from '../actionCreators'; import { logGuiHttp, guiLogState @@ -47,7 +47,7 @@ export function atomic(payload) { function atomicState(json) { return { - type: storeType.ATOMIC, + type: ATOMIC, response: json, } } \ No newline at end of file diff --git a/react/src/actions/basiliskCache.js b/react/src/actions/actions/basiliskCache.js similarity index 97% rename from react/src/actions/basiliskCache.js rename to react/src/actions/actions/basiliskCache.js index f225e08..05834b2 100644 --- a/react/src/actions/basiliskCache.js +++ b/react/src/actions/actions/basiliskCache.js @@ -1,8 +1,8 @@ -import * as storeType from './storeType'; +import { DASHBOARD_ACTIVE_COIN_GET_CACHE } from '../storeType'; import { triggerToaster, Config -} from './actionCreators'; +} from '../actionCreators'; import { logGuiHttp, guiLogState @@ -101,7 +101,7 @@ function getShepherdCacheState(json, pubkey, coin) { } } else { return { - type: storeType.DASHBOARD_ACTIVE_COIN_GET_CACHE, + type: DASHBOARD_ACTIVE_COIN_GET_CACHE, cache: json && json.result && json.result.basilisk ? json.result.basilisk : null, } } diff --git a/react/src/actions/basiliskProcessAddress.js b/react/src/actions/actions/basiliskProcessAddress.js similarity index 96% rename from react/src/actions/basiliskProcessAddress.js rename to react/src/actions/actions/basiliskProcessAddress.js index 7ca0707..320296f 100644 --- a/react/src/actions/basiliskProcessAddress.js +++ b/react/src/actions/actions/basiliskProcessAddress.js @@ -1,9 +1,8 @@ -import * as storeType from './storeType'; -import { translate } from '../translate/translate'; +import { translate } from '../../translate/translate'; import { triggerToaster, Config -} from './actionCreators'; +} from '../actionCreators'; import { logGuiHttp, guiLogState diff --git a/react/src/actions/basiliskTxHistory.js b/react/src/actions/actions/basiliskTxHistory.js similarity index 93% rename from react/src/actions/basiliskTxHistory.js rename to react/src/actions/actions/basiliskTxHistory.js index cb12126..8edcbe1 100644 --- a/react/src/actions/basiliskTxHistory.js +++ b/react/src/actions/actions/basiliskTxHistory.js @@ -1,9 +1,8 @@ -import * as storeType from './storeType'; import { triggerToaster, Config, getNativeTxHistoryState -} from './actionCreators'; +} from '../actionCreators'; import { logGuiHttp, guiLogState diff --git a/react/src/actions/coinList.js b/react/src/actions/actions/coinList.js similarity index 93% rename from react/src/actions/coinList.js rename to react/src/actions/actions/coinList.js index cf1f4d4..c17a072 100644 --- a/react/src/actions/coinList.js +++ b/react/src/actions/actions/coinList.js @@ -1,8 +1,7 @@ -import * as storeType from './storeType'; import { triggerToaster, Config -} from './actionCreators'; +} from '../actionCreators'; import { logGuiHttp, guiLogState diff --git a/react/src/actions/copyAddress.js b/react/src/actions/actions/copyAddress.js similarity index 66% rename from react/src/actions/copyAddress.js rename to react/src/actions/actions/copyAddress.js index 3b4dd3d..7f3f9d3 100644 --- a/react/src/actions/copyAddress.js +++ b/react/src/actions/actions/copyAddress.js @@ -1,10 +1,6 @@ -import { copyToClipboard } from '../util/copyToClipboard'; -import { translate } from '../translate/translate'; -import * as storeType from './storeType'; -import { - triggerToaster, - Config -} from './actionCreators'; +import { copyToClipboard } from '../../util/copyToClipboard'; +import { translate } from '../../translate/translate'; +import { triggerToaster } from '../actionCreators'; export function copyCoinAddress(address) { const _result = copyToClipboard(address); diff --git a/react/src/actions/createWallet.js b/react/src/actions/actions/createWallet.js similarity index 93% rename from react/src/actions/createWallet.js rename to react/src/actions/actions/createWallet.js index 9c16144..29b2796 100644 --- a/react/src/actions/createWallet.js +++ b/react/src/actions/actions/createWallet.js @@ -1,9 +1,8 @@ -import * as storeType from './storeType'; -import { translate } from '../translate/translate'; +import { translate } from '../../translate/translate'; import { triggerToaster, Config -} from './actionCreators'; +} from '../actionCreators'; import { logGuiHttp, guiLogState diff --git a/react/src/actions/dexCoins.js b/react/src/actions/actions/dexCoins.js similarity index 94% rename from react/src/actions/dexCoins.js rename to react/src/actions/actions/dexCoins.js index e69dc7d..eaf13c8 100644 --- a/react/src/actions/dexCoins.js +++ b/react/src/actions/actions/dexCoins.js @@ -1,9 +1,8 @@ -import * as storeType from './storeType'; import { triggerToaster, Config, dashboardCoinsState -} from './actionCreators'; +} from '../actionCreators'; import { logGuiHttp, guiLogState diff --git a/react/src/actions/edexBalance.js b/react/src/actions/actions/edexBalance.js similarity index 95% rename from react/src/actions/edexBalance.js rename to react/src/actions/actions/edexBalance.js index ecc96e2..87f7aaa 100644 --- a/react/src/actions/edexBalance.js +++ b/react/src/actions/actions/edexBalance.js @@ -1,8 +1,8 @@ -import * as storeType from './storeType'; +import { DASHBOARD_ACTIVE_COIN_BALANCE } from '../storeType'; import { triggerToaster, Config -} from './actionCreators'; +} from '../actionCreators'; import { logGuiHttp, guiLogState @@ -49,7 +49,7 @@ export function iguanaEdexBalance(coin) { function iguanaEdexBalanceState(json) { return { - type: storeType.DASHBOARD_ACTIVE_COIN_BALANCE, + type: DASHBOARD_ACTIVE_COIN_BALANCE, balance: json && json.result ? json.result : 0, } } diff --git a/react/src/actions/edexGetTx.js b/react/src/actions/actions/edexGetTx.js similarity index 94% rename from react/src/actions/edexGetTx.js rename to react/src/actions/actions/edexGetTx.js index eb5d3b7..21336cc 100644 --- a/react/src/actions/edexGetTx.js +++ b/react/src/actions/actions/edexGetTx.js @@ -1,8 +1,7 @@ -import * as storeType from './storeType'; import { triggerToaster, Config -} from './actionCreators'; +} from '../actionCreators'; import { logGuiHttp, guiLogState diff --git a/react/src/actions/fullTxHistory.js b/react/src/actions/actions/fullTxHistory.js similarity index 94% rename from react/src/actions/fullTxHistory.js rename to react/src/actions/actions/fullTxHistory.js index 19120ee..bfc266f 100644 --- a/react/src/actions/fullTxHistory.js +++ b/react/src/actions/actions/fullTxHistory.js @@ -1,9 +1,8 @@ -import * as storeType from './storeType'; import { triggerToaster, Config, getNativeTxHistoryState -} from './actionCreators'; +} from '../actionCreators'; import { logGuiHttp, guiLogState diff --git a/react/src/actions/getAddrByAccount.js b/react/src/actions/actions/getAddrByAccount.js similarity index 93% rename from react/src/actions/getAddrByAccount.js rename to react/src/actions/actions/getAddrByAccount.js index 653d038..4e4cfb1 100644 --- a/react/src/actions/getAddrByAccount.js +++ b/react/src/actions/actions/getAddrByAccount.js @@ -1,8 +1,8 @@ -import * as storeType from './storeType'; +import { ACTIVE_COIN_GET_ADDRESSES } from '../storeType'; import { triggerToaster, Config -} from './actionCreators'; +} from '../actionCreators'; import { logGuiHttp, guiLogState @@ -24,7 +24,7 @@ export function getAddressesByAccountState(json, coin, mode) { } return { - type: storeType.ACTIVE_COIN_GET_ADDRESSES, + type: ACTIVE_COIN_GET_ADDRESSES, addresses: { 'public': json.result }, } } diff --git a/react/src/actions/iguanaHelpers.js b/react/src/actions/actions/iguanaHelpers.js similarity index 92% rename from react/src/actions/iguanaHelpers.js rename to react/src/actions/actions/iguanaHelpers.js index e2f6704..3f36266 100644 --- a/react/src/actions/iguanaHelpers.js +++ b/react/src/actions/actions/iguanaHelpers.js @@ -1,13 +1,12 @@ -import * as storeType from './storeType'; import { triggerToaster, Config -} from './actionCreators'; +} from '../actionCreators'; import { logGuiHttp, guiLogState } from './log'; -import { checkAC } from '../components/addcoin/payload'; +import { checkAC } from '../../components/addcoin/payload'; export function getPassthruAgent(coin) { let passthruAgent; diff --git a/react/src/actions/iguanaInstance.js b/react/src/actions/actions/iguanaInstance.js similarity index 96% rename from react/src/actions/iguanaInstance.js rename to react/src/actions/actions/iguanaInstance.js index cd5be58..04c817b 100644 --- a/react/src/actions/iguanaInstance.js +++ b/react/src/actions/actions/iguanaInstance.js @@ -1,8 +1,7 @@ -import * as storeType from './storeType'; import { triggerToaster, Config -} from './actionCreators'; +} from '../actionCreators'; import { logGuiHttp, guiLogState diff --git a/react/src/actions/log.js b/react/src/actions/actions/log.js similarity index 92% rename from react/src/actions/log.js rename to react/src/actions/actions/log.js index 8fad44c..eda0db6 100644 --- a/react/src/actions/log.js +++ b/react/src/actions/actions/log.js @@ -1,8 +1,8 @@ -import * as storeType from './storeType'; +import { LOG_GUI_HTTP } from '../storeType'; import { triggerToaster, Config -} from './actionCreators'; +} from '../actionCreators'; export function logGuiHttp(payload) { return dispatch => { @@ -43,7 +43,7 @@ export function getAgamaLog(type) { export function guiLogState(logData) { return { - type: storeType.LOG_GUI_HTTP, + type: LOG_GUI_HTTP, timestamp: logData.timestamp, log: { timestamp: logData.timestamp, diff --git a/react/src/actions/logout.js b/react/src/actions/actions/logout.js similarity index 93% rename from react/src/actions/logout.js rename to react/src/actions/actions/logout.js index 5c8affa..d391b89 100644 --- a/react/src/actions/logout.js +++ b/react/src/actions/actions/logout.js @@ -1,8 +1,8 @@ -import * as storeType from './storeType'; +import { LOGIN } from '../storeType'; import { triggerToaster, Config -} from './actionCreators'; +} from '../actionCreators'; import { logGuiHttp, guiLogState @@ -12,7 +12,7 @@ function logoutState(json, dispatch) { sessionStorage.removeItem('IguanaActiveAccount'); return { - type: storeType.LOGIN, + type: LOGIN, isLoggedIn: false, } } diff --git a/react/src/actions/nativeBalance.js b/react/src/actions/actions/nativeBalance.js similarity index 92% rename from react/src/actions/nativeBalance.js rename to react/src/actions/actions/nativeBalance.js index cd13543..2819d52 100644 --- a/react/src/actions/nativeBalance.js +++ b/react/src/actions/actions/nativeBalance.js @@ -1,9 +1,9 @@ -import * as storeType from './storeType'; +import { DASHBOARD_ACTIVE_COIN_NATIVE_BALANCE } from '../storeType'; import { triggerToaster, Config, getPassthruAgent -} from './actionCreators'; +} from '../actionCreators'; import { logGuiHttp, guiLogState @@ -73,7 +73,7 @@ export function getKMDBalanceTotal(coin) { export function getNativeBalancesState(json) { return { - type: storeType.DASHBOARD_ACTIVE_COIN_NATIVE_BALANCE, + type: DASHBOARD_ACTIVE_COIN_NATIVE_BALANCE, balance: json && !json.error ? json : 0, } } \ No newline at end of file diff --git a/react/src/actions/nativeNewAddress.js b/react/src/actions/actions/nativeNewAddress.js similarity index 94% rename from react/src/actions/nativeNewAddress.js rename to react/src/actions/actions/nativeNewAddress.js index f47a058..965fb9a 100644 --- a/react/src/actions/nativeNewAddress.js +++ b/react/src/actions/actions/nativeNewAddress.js @@ -1,10 +1,9 @@ -import * as storeType from './storeType'; -import { translate } from '../translate/translate'; +import { translate } from '../../translate/translate'; import { triggerToaster, Config, getPassthruAgent -} from './actionCreators'; +} from '../actionCreators'; import { logGuiHttp, guiLogState diff --git a/react/src/actions/nativeSend.js b/react/src/actions/actions/nativeSend.js similarity index 96% rename from react/src/actions/nativeSend.js rename to react/src/actions/actions/nativeSend.js index 3bd6a95..51bd2fd 100644 --- a/react/src/actions/nativeSend.js +++ b/react/src/actions/actions/nativeSend.js @@ -1,11 +1,11 @@ -import * as storeType from './storeType'; -import { translate } from '../translate/translate'; +import { DASHBOARD_ACTIVE_COIN_NATIVE_OPIDS } from '../storeType'; +import { translate } from '../../translate/translate'; import { triggerToaster, Config, getPassthruAgent, iguanaHashHex -} from './actionCreators'; +} from '../actionCreators'; import { logGuiHttp, guiLogState @@ -71,7 +71,7 @@ export function sendNativeTx(coin, _payload) { .then(function(response) { if (_apiMethod === 'sendtoaddress') { const _response = response.text().then(function(text) { return text; }); - + console.log('native sendtoaddress', _response); return _response; } else { @@ -98,7 +98,7 @@ export function sendNativeTx(coin, _payload) { export function getKMDOPIDState(json) { return { - type: storeType.DASHBOARD_ACTIVE_COIN_NATIVE_OPIDS, + type: DASHBOARD_ACTIVE_COIN_NATIVE_OPIDS, opids: json, } } diff --git a/react/src/actions/nativeSyncInfo.js b/react/src/actions/actions/nativeSyncInfo.js similarity index 96% rename from react/src/actions/nativeSyncInfo.js rename to react/src/actions/actions/nativeSyncInfo.js index d73e4d1..042842a 100644 --- a/react/src/actions/nativeSyncInfo.js +++ b/react/src/actions/actions/nativeSyncInfo.js @@ -1,10 +1,10 @@ -import * as storeType from './storeType'; +import { SYNCING_NATIVE_MODE } from '../storeType'; import { triggerToaster, Config, getPassthruAgent, getDebugLog -} from './actionCreators'; +} from '../actionCreators'; import { logGuiHttp, guiLogState @@ -60,7 +60,7 @@ function getSyncInfoNativeState(json, coin, skipDebug) { return getSyncInfoNativeKMD(skipDebug); } else { return { - type: storeType.SYNCING_NATIVE_MODE, + type: SYNCING_NATIVE_MODE, progress: json, } } diff --git a/react/src/actions/nativeTxHistory.js b/react/src/actions/actions/nativeTxHistory.js similarity index 95% rename from react/src/actions/nativeTxHistory.js rename to react/src/actions/actions/nativeTxHistory.js index e38ea18..5e86753 100644 --- a/react/src/actions/nativeTxHistory.js +++ b/react/src/actions/actions/nativeTxHistory.js @@ -1,10 +1,9 @@ -import * as storeType from './storeType'; import { triggerToaster, Config, getPassthruAgent, getNativeTxHistoryState -} from './actionCreators'; +} from '../actionCreators'; import { logGuiHttp, guiLogState diff --git a/react/src/actions/notary.js b/react/src/actions/actions/notary.js similarity index 93% rename from react/src/actions/notary.js rename to react/src/actions/actions/notary.js index 72874fa..591df50 100644 --- a/react/src/actions/notary.js +++ b/react/src/actions/actions/notary.js @@ -1,9 +1,12 @@ -import * as storeType from './storeType'; -import { translate } from '../translate/translate'; +import { + DASHBOARD_CONNECT_NOTARIES, + DASHBOARD_GET_NOTARIES_LIST +} from '../storeType'; +import { translate } from '../../translate/translate'; import { triggerToaster, Config -} from './actionCreators'; +} from '../actionCreators'; import { logGuiHttp, guiLogState @@ -66,7 +69,7 @@ function updateNotaryNodeConState(json, totalNodes, currentNodeIndex, currentNod if (json && json.error === 'less than required responses') { return { - type: storeType.DASHBOARD_CONNECT_NOTARIES, + type: DASHBOARD_CONNECT_NOTARIES, total: totalNodes - 1, current: currentNodeIndex, name: currentNodeName, @@ -74,7 +77,7 @@ function updateNotaryNodeConState(json, totalNodes, currentNodeIndex, currentNod } } else { return { - type: storeType.DASHBOARD_CONNECT_NOTARIES, + type: DASHBOARD_CONNECT_NOTARIES, total: totalNodes - 1, current: currentNodeIndex, name: currentNodeName, @@ -89,7 +92,7 @@ function connectAllNotaryNodes(json, dispatch) { dispatch(initNotaryNodesConSequence(json)); return { - type: storeType.DASHBOARD_CONNECT_NOTARIES, + type: DASHBOARD_CONNECT_NOTARIES, total: json.length - 1, current: 0, name: json[0], @@ -125,7 +128,7 @@ function getDexNotariesState(json) { } } else { return { - type: storeType.DASHBOARD_GET_NOTARIES_LIST, + type: DASHBOARD_GET_NOTARIES_LIST, notaries: json, } } diff --git a/react/src/actions/openAlias.js b/react/src/actions/actions/openAlias.js similarity index 82% rename from react/src/actions/openAlias.js rename to react/src/actions/actions/openAlias.js index a9037f1..d562e4f 100644 --- a/react/src/actions/openAlias.js +++ b/react/src/actions/actions/openAlias.js @@ -1,8 +1,4 @@ -import * as storeType from './storeType'; -import { - triggerToaster, - Config -} from './actionCreators'; +import { triggerToaster } from '../actionCreators'; import { logGuiHttp, guiLogState diff --git a/react/src/actions/sendFullBasilisk.js b/react/src/actions/actions/sendFullBasilisk.js similarity index 94% rename from react/src/actions/sendFullBasilisk.js rename to react/src/actions/actions/sendFullBasilisk.js index 3ade2ef..282f6d4 100644 --- a/react/src/actions/sendFullBasilisk.js +++ b/react/src/actions/actions/sendFullBasilisk.js @@ -1,10 +1,10 @@ -import * as storeType from './storeType'; -import { translate } from '../translate/translate'; +import { DASHBOARD_ACTIVE_COIN_SENDTO } from '../storeType'; +import { translate } from '../../translate/translate'; import { triggerToaster, Config, getDispatch -} from './actionCreators'; +} from '../actionCreators'; import { logGuiHttp, guiLogState @@ -125,7 +125,6 @@ export function iguanaUTXORawTX(data, dispatch) { }, 'utxos': data.utxos, }; - console.log('iguanaUTXORawTXExport', payload); return new Promise((resolve, reject) => { const _timestamp = Date.now(); @@ -218,14 +217,14 @@ function sendToAddressState(json, dispatch) { dispatch(triggerToaster(true, json.error, 'Error', 'error')); return { - type: storeType.DASHBOARD_ACTIVE_COIN_SENDTO, + type: DASHBOARD_ACTIVE_COIN_SENDTO, lastSendToResponse: json, } } else if (json && json.result && json.complete) { dispatch(triggerToaster(true, translate('TOASTR.TX_SENT_ALT'), translate('TOASTR.WALLET_NOTIFICATION'), 'success')); return { - type: storeType.DASHBOARD_ACTIVE_COIN_SENDTO, + type: DASHBOARD_ACTIVE_COIN_SENDTO, lastSendToResponse: json, } } @@ -233,14 +232,14 @@ function sendToAddressState(json, dispatch) { export function sendToAddressStateAlt(json) { return { - type: storeType.DASHBOARD_ACTIVE_COIN_SENDTO, + type: DASHBOARD_ACTIVE_COIN_SENDTO, lastSendToResponse: json, } } export function clearLastSendToResponseState() { return { - type: storeType.DASHBOARD_ACTIVE_COIN_SENDTO, + type: DASHBOARD_ACTIVE_COIN_SENDTO, lastSendToResponse: null, } } \ No newline at end of file diff --git a/react/src/actions/settings.js b/react/src/actions/actions/settings.js similarity index 96% rename from react/src/actions/settings.js rename to react/src/actions/actions/settings.js index 0204912..5efe2e5 100644 --- a/react/src/actions/settings.js +++ b/react/src/actions/actions/settings.js @@ -1,9 +1,15 @@ -import * as storeType from './storeType'; -import { translate } from '../translate/translate'; +import { + LOAD_APP_INFO, + GET_WIF_KEY, + GET_DEBUG_LOG, + GET_PEERS_LIST, + LOAD_APP_CONFIG +} from '../storeType'; +import { translate } from '../../translate/translate'; import { triggerToaster, Config -} from './actionCreators'; +} from '../actionCreators'; import { logGuiHttp, guiLogState @@ -11,7 +17,7 @@ import { function getAppInfoState(json) { return { - type: storeType.LOAD_APP_INFO, + type: LOAD_APP_INFO, info: json, } } @@ -35,7 +41,7 @@ export function getAppInfo() { export function settingsWifkeyState(json, coin) { return { - type: storeType.GET_WIF_KEY, + type: GET_WIF_KEY, wifkey: json[`{$coin}wif`], address: json[coin], } @@ -117,7 +123,7 @@ function getDebugLogState(json) { const _data = json.result.replace('\n', '\r\n'); return { - type: storeType.GET_DEBUG_LOG, + type: GET_DEBUG_LOG, data: _data, } } @@ -201,7 +207,7 @@ export function getPeersListState(json) { } return { - type: storeType.GET_PEERS_LIST, + type: GET_PEERS_LIST, supernetPeers: json && json.supernet[0] ? json.supernet : null, rawPeers: peersList, } @@ -295,7 +301,7 @@ export function saveAppConfig(_payload) { function getAppConfigState(json) { return { - type: storeType.LOAD_APP_CONFIG, + type: LOAD_APP_CONFIG, config: json, } } diff --git a/react/src/actions/syncInfo.js b/react/src/actions/actions/syncInfo.js similarity index 93% rename from react/src/actions/syncInfo.js rename to react/src/actions/actions/syncInfo.js index edf78ef..a9ff460 100644 --- a/react/src/actions/syncInfo.js +++ b/react/src/actions/actions/syncInfo.js @@ -1,8 +1,8 @@ -import * as storeType from './storeType'; +import { SYNCING_FULL_MODE } from '../storeType'; import { triggerToaster, Config -} from './actionCreators'; +} from '../actionCreators'; import { logGuiHttp, guiLogState @@ -18,7 +18,7 @@ function getSyncInfoState(json) { } return { - type: storeType.SYNCING_FULL_MODE, + type: SYNCING_FULL_MODE, progress: json, } } diff --git a/react/src/actions/syncOnly.js b/react/src/actions/actions/syncOnly.js similarity index 85% rename from react/src/actions/syncOnly.js rename to react/src/actions/actions/syncOnly.js index cb43f78..d43e29b 100644 --- a/react/src/actions/syncOnly.js +++ b/react/src/actions/actions/syncOnly.js @@ -1,9 +1,12 @@ -import * as storeType from './storeType'; -import { translate } from '../translate/translate'; +import { + SYNC_ONLY_MODAL_TOGGLE, + SYNC_ONLY_DATA +} from '../storeType'; +import { translate } from '../../translate/translate'; import { triggerToaster, Config -} from './actionCreators'; +} from '../actionCreators'; import { logGuiHttp, guiLogState @@ -11,14 +14,14 @@ import { export function toggleSyncOnlyModal(display) { return { - type: storeType.SYNC_ONLY_MODAL_TOGGLE, + type: SYNC_ONLY_MODAL_TOGGLE, display, } } function getSyncOnlyForksState(json) { return { - type: storeType.SYNC_ONLY_DATA, + type: SYNC_ONLY_DATA, forks: JSON.parse(json.result), } } diff --git a/react/src/actions/sysInfo.js b/react/src/actions/actions/sysInfo.js similarity index 88% rename from react/src/actions/sysInfo.js rename to react/src/actions/actions/sysInfo.js index 909d8f5..42f601d 100644 --- a/react/src/actions/sysInfo.js +++ b/react/src/actions/actions/sysInfo.js @@ -1,8 +1,7 @@ -import * as storeType from './storeType'; import { triggerToaster, Config -} from './actionCreators'; +} from '../actionCreators'; import { logGuiHttp, guiLogState diff --git a/react/src/actions/walletAuth.js b/react/src/actions/actions/walletAuth.js similarity index 96% rename from react/src/actions/walletAuth.js rename to react/src/actions/actions/walletAuth.js index ccf491c..a9fe0a7 100644 --- a/react/src/actions/walletAuth.js +++ b/react/src/actions/actions/walletAuth.js @@ -1,11 +1,14 @@ -import * as storeType from './storeType'; -import { translate } from '../translate/translate'; +import { + LOGIN, + ACTIVE_HANDLE +} from '../storeType'; +import { translate } from '../../translate/translate'; import { triggerToaster, Config, getMainAddressState, updateErrosStack -} from './actionCreators'; +} from '../actionCreators'; import { logGuiHttp, guiLogState @@ -196,14 +199,14 @@ function iguanaWalletPassphraseState(json, dispatch) { dispatch(iguanaActiveHandleState(json)); return { - type: storeType.LOGIN, + type: LOGIN, isLoggedIn: json && json.pubkey ? true : false, } } function iguanaActiveHandleState(json) { return { - type: storeType.ACTIVE_HANDLE, + type: ACTIVE_HANDLE, isLoggedIn: sessionStorage.getItem('IguanaActiveAccount') && JSON.parse(sessionStorage.getItem('IguanaActiveAccount')).pubkey === json.pubkey && json.status === 'unlocked' ? true : false, handle: json, } From 706743447672c0f0b787a2bb0fa6bf39e98e94ad Mon Sep 17 00:00:00 2001 From: pbca26 Date: Fri, 2 Jun 2017 20:16:34 +0300 Subject: [PATCH 15/17] refactored notifications component --- .../src/components/dashboard/notifications.js | 61 +++++++++---------- 1 file changed, 28 insertions(+), 33 deletions(-) diff --git a/react/src/components/dashboard/notifications.js b/react/src/components/dashboard/notifications.js index c7cc783..1acf7f4 100755 --- a/react/src/components/dashboard/notifications.js +++ b/react/src/components/dashboard/notifications.js @@ -12,10 +12,12 @@ class Notifications extends React.Component { super(props); this.state = { displayModal: false, - totalCalls: 0, - totalErrorCalls: 0, - totalSuccessCalls: 0, - totalPendingCalls: 0, + calls: { + total: 0, + error: 0, + success: 0, + pending: 0, + }, activeTab: 2, guiLog: null, }; @@ -33,31 +35,27 @@ class Notifications extends React.Component { if (this.props.Dashboard && this.props.Dashboard.guiLog) { const _guiLog = this.props.Dashboard.guiLog; - let totalCalls = Object.keys(_guiLog).length; - let totalErrorCalls = 0; - let totalSuccessCalls = 0; - let totalPendingCalls = 0; + let _callsLength = { + total: Object.keys(_guiLog).length, + error: 0, + success: 0, + pending: 0, + } + let guiLogToArray = []; for (let timestamp in _guiLog) { guiLogToArray.push(_guiLog[timestamp]); - - if (_guiLog[timestamp].status === 'error') { - totalErrorCalls++; - } - if (_guiLog[timestamp].status === 'success') { - totalSuccessCalls++; - } - if (_guiLog[timestamp].status === 'pending') { - totalPendingCalls++; - } + _callsLength[_guiLog[timestamp].status]++; } this.setState(Object.assign({}, this.state, { - totalCalls, - totalErrorCalls, - totalSuccessCalls, - totalPendingCalls, + calls: { + total: _callsLength.total, + error: _callsLength.error, + success: _callsLength.success, + pending: _callsLength.pending, + }, guiLog: guiLogToArray, })); } @@ -70,7 +68,6 @@ class Notifications extends React.Component { let _guiLog = this.state.guiLog; _guiLog = sortByDate(_guiLog); let items = []; - let index = 0; for (let i = 0; i < _guiLog.length; i++) { if (_guiLog[i].status === type) { @@ -78,7 +75,7 @@ class Notifications extends React.Component { items.push(
    -
    { index + 1 }.
    +
    { i + 1 }.
    Time: { secondsToString(_logItem.timestamp, true, true) }
    @@ -101,8 +98,6 @@ class Notifications extends React.Component {
    ); } - - index++; } return items; @@ -123,21 +118,21 @@ class Notifications extends React.Component {     this.openTab(0) }> - Success ({ this.state.totalSuccessCalls }) + Success ({ this.state.calls.success })
  3. this.openTab(1) }> - Error ({ this.state.totalErrorCalls }) + Error ({ this.state.calls.error })
  4. this.openTab(2) }> - Pending ({ this.state.totalPendingCalls }) + Pending ({ this.state.calls.pending })
    5. @@ -192,10 +187,10 @@ class Notifications extends React.Component {
    - { this.state.totalSuccessCalls } - { this.state.totalErrorCalls } - { this.state.totalPendingCalls } -
    + { this.state.calls.success } + { this.state.calls.error } + { this.state.calls.pending } +
    From 9e6b3b4fce5a18a6600815b885266f86a53ff87c Mon Sep 17 00:00:00 2001 From: pbca26 Date: Fri, 2 Jun 2017 20:17:03 +0300 Subject: [PATCH 16/17] action creators main const tree shaking --- react/src/actions/actionCreators.js | 75 +++++++++++++++++++---------- 1 file changed, 50 insertions(+), 25 deletions(-) diff --git a/react/src/actions/actionCreators.js b/react/src/actions/actionCreators.js index ea03f1b..c53a8be 100644 --- a/react/src/actions/actionCreators.js +++ b/react/src/actions/actionCreators.js @@ -3,7 +3,32 @@ import 'bluebird'; import _config from '../config'; import { translate } from '../translate/translate'; -import * as storeType from './storeType'; +import { + GET_ACTIVE_COINS, + DASHBOARD_ACTIVE_ADDRESS, + VIEW_CACHE_DATA, + DASHBOARD_DISPLAY_NOTARIES_MODAL, + DASHBOARD_ACTIVE_COIN_MAIN_BASILISK_ADDR, + DASHBOARD_ACTIVE_SECTION, + DASHBOARD_ACTIVE_TXINFO_MODAL, + BASILISK_CONNECTION, + BASILISK_REFRESH, + SYNCING_FULL_MODE, + SYNCING_NATIVE_MODE, + DASHBOARD_ACTIVE_COIN_SEND_FORM, + DASHBOARD_ACTIVE_COIN_RECEIVE_FORM, + DASHBOARD_ACTIVE_COIN_RESET_FORMS, + ADD_TOASTER_MESSAGE, + REMOVE_TOASTER_MESSAGE, + DISPLAY_ADDCOIN_MODAL, + GET_MAIN_ADDRESS, + DASHBOARD_SECTION_CHANGE, + DASHBOARD_ACTIVE_COIN_CHANGE, + ACTIVE_COIN_GET_ADDRESSES, + DASHBOARD_ACTIVE_COIN_NATIVE_TXHISTORY, + START_INTERVAL, + STOP_INTERVAL +} from './storeType'; import { logGuiHttp, getAgamaLog, @@ -51,7 +76,7 @@ try { export function changeActiveAddress(address) { return { - type: storeType.DASHBOARD_ACTIVE_ADDRESS, + type: DASHBOARD_ACTIVE_ADDRESS, address, } } @@ -64,35 +89,35 @@ export function updateErrosStack(method) { export function toggleViewCacheModal(display) { return { - type: storeType.VIEW_CACHE_DATA, + type: VIEW_CACHE_DATA, display, } } export function displayNotariesModal(display) { return { - type: storeType.DASHBOARD_DISPLAY_NOTARIES_MODAL, + type: DASHBOARD_DISPLAY_NOTARIES_MODAL, display, } } export function changeMainBasiliskAddress(address) { return { - type: storeType.DASHBOARD_ACTIVE_COIN_MAIN_BASILISK_ADDR, + type: DASHBOARD_ACTIVE_COIN_MAIN_BASILISK_ADDR, address, } } export function toggleDashboardActiveSection(name) { return { - type: storeType.DASHBOARD_ACTIVE_SECTION, + type: DASHBOARD_ACTIVE_SECTION, section: name, } } export function toggleDashboardTxInfoModal(display, txIndex) { return { - type: storeType.DASHBOARD_ACTIVE_TXINFO_MODAL, + type: DASHBOARD_ACTIVE_TXINFO_MODAL, showTransactionInfo: display, showTransactionInfoTxIndex: txIndex, } @@ -100,7 +125,7 @@ export function toggleDashboardTxInfoModal(display, txIndex) { export function basiliskConnectionState(display, json) { return { - type: storeType.BASILISK_CONNECTION, + type: BASILISK_CONNECTION, basiliskConnection: display, progress: json, } @@ -108,7 +133,7 @@ export function basiliskConnectionState(display, json) { export function basiliskRefreshState(display, json) { return { - type: storeType.BASILISK_REFRESH, + type: BASILISK_REFRESH, basiliskRefresh: display, progress: json, } @@ -128,7 +153,7 @@ export function basiliskConnection(display) { export function syncingNativeModeState(display, json) { return { - type: storeType.SYNCING_FULL_MODE, + type: SYNCING_FULL_MODE, syncingNativeMode: display, progress: json, } @@ -136,7 +161,7 @@ export function syncingNativeModeState(display, json) { export function syncingFullModeState(display, json) { return { - type: storeType.SYNCING_NATIVE_MODE, + type: SYNCING_NATIVE_MODE, syncingFullMode: display, progress: json, } @@ -144,21 +169,21 @@ export function syncingFullModeState(display, json) { export function toggleSendCoinFormState(display) { return { - type: storeType.DASHBOARD_ACTIVE_COIN_SEND_FORM, + type: DASHBOARD_ACTIVE_COIN_SEND_FORM, send: display, } } export function toggleReceiveCoinFormState(display) { return { - type: storeType.DASHBOARD_ACTIVE_COIN_RECEIVE_FORM, + type: DASHBOARD_ACTIVE_COIN_RECEIVE_FORM, receive: display, } } export function toggleSendReceiveCoinFormsState() { return { - type: storeType.DASHBOARD_ACTIVE_COIN_RESET_FORMS, + type: DASHBOARD_ACTIVE_COIN_RESET_FORMS, send: false, receive: false, } @@ -166,7 +191,7 @@ export function toggleSendReceiveCoinFormsState() { export function triggerToaster(display, message, title, _type) { return { - type: storeType.ADD_TOASTER_MESSAGE, + type: ADD_TOASTER_MESSAGE, display, message, title, @@ -177,14 +202,14 @@ export function triggerToaster(display, message, title, _type) { // triggers removing of the toast with the provided toastId export function dismissToaster(toastId) { return { - type: storeType.REMOVE_TOASTER_MESSAGE, + type: REMOVE_TOASTER_MESSAGE, toastId: toastId } } export function toggleAddcoinModalState(display, isLogin) { return { - type: storeType.DISPLAY_ADDCOIN_MODAL, + type: DISPLAY_ADDCOIN_MODAL, display: display, isLogin: isLogin, } @@ -192,7 +217,7 @@ export function toggleAddcoinModalState(display, isLogin) { export function dashboardCoinsState(json) { return { - type: storeType.GET_ACTIVE_COINS, + type: GET_ACTIVE_COINS, coins: json, activeCoins: Object.keys(json.native).length || Object.keys(json.basilisk).length || Object.keys(json.full).length ? true : false } @@ -200,7 +225,7 @@ export function dashboardCoinsState(json) { export function getMainAddressState(json) { return { - type: storeType.GET_MAIN_ADDRESS, + type: GET_MAIN_ADDRESS, activeHandle: json, } } @@ -225,7 +250,7 @@ export function toggleSendReceiveCoinForms() { export function dashboardChangeSectionState(sectionName) { return { - type: storeType.DASHBOARD_SECTION_CHANGE, + type: DASHBOARD_SECTION_CHANGE, activeSection: sectionName, } } @@ -238,7 +263,7 @@ export function dashboardChangeSection(sectionName) { export function dashboardChangeActiveCoinState(coin, mode) { return { - type: storeType.DASHBOARD_ACTIVE_COIN_CHANGE, + type: DASHBOARD_ACTIVE_COIN_CHANGE, coin: coin, mode: mode, } @@ -292,7 +317,7 @@ export function setBasiliskMainAddress(json, coin, mode) { } return { - type: storeType.ACTIVE_COIN_GET_ADDRESSES, + type: ACTIVE_COIN_GET_ADDRESSES, addresses: { 'public': [] }, } } @@ -308,14 +333,14 @@ export function getNativeTxHistoryState(json) { } return { - type: storeType.DASHBOARD_ACTIVE_COIN_NATIVE_TXHISTORY, + type: DASHBOARD_ACTIVE_COIN_NATIVE_TXHISTORY, txhistory: json, } } export function startInterval(name, handle) { return { - type: storeType.START_INTERVAL, + type: START_INTERVAL, name, handle, } @@ -325,7 +350,7 @@ export function stopInterval(name, intervals) { clearInterval(intervals[name]); return { - type: storeType.STOP_INTERVAL, + type: STOP_INTERVAL, name, } } \ No newline at end of file From df5c090084a7851eaba1d8d8e939839c5ca7509b Mon Sep 17 00:00:00 2001 From: pbca26 Date: Fri, 2 Jun 2017 20:38:57 +0300 Subject: [PATCH 17/17] decoupled styling index.scss -> overrides.scss --- react/src/components/dashboard/navbar.js | 2 +- react/src/components/overrides.scss | 552 +++++++++++++++++++++++ react/src/styles/index.scss | 548 +--------------------- 3 files changed, 554 insertions(+), 548 deletions(-) create mode 100644 react/src/components/overrides.scss diff --git a/react/src/components/dashboard/navbar.js b/react/src/components/dashboard/navbar.js index dc278d6..0050b60 100755 --- a/react/src/components/dashboard/navbar.js +++ b/react/src/components/dashboard/navbar.js @@ -33,7 +33,7 @@ class Navbar extends React.Component { handleClickOutside(e) { if (e.srcElement.className !== 'dropdown-menu' && e.srcElement.alt !== 'iguana profile pic' && - e.srcElement.offsetParent.className !== 'avatar avatar-online' && + (e.srcElement.offsetParent && e.srcElement.offsetParent.className !== 'avatar avatar-online') && e.srcElement.className.indexOf('navbar-avatar') === -1 && (e.path && e.path[4] && e.path[4].className.indexOf('dropdown-menu') === -1)) { this.setState({ diff --git a/react/src/components/overrides.scss b/react/src/components/overrides.scss new file mode 100644 index 0000000..b1741e0 --- /dev/null +++ b/react/src/components/overrides.scss @@ -0,0 +1,552 @@ +/* TODO: nesting, separate */ + +#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; +} + +.login-form, +.register-form { + width: 540px; + margin: 30px 0; +} + +#section-iguana-wallet-settings .panel-title { + cursor: pointer; + cursor: hand; +} + +#section-iguana-wallet-settings .panel-title:before { + content: '\F273'; +} +#section-iguana-wallet-settings .panel-title.collapsed:before { + content: '\F278'; +} + +#section-dashboard { + height: 100%; +} + +#section-iguana-wallet-settings { + background: #f3f4f5; +} + +#edexcoin_dashboardinfo a, +.nav-top-menu, +#kmd_txid_info_mdl .nav-tabs li, +.pagination a, +.action { + cursor: pointer; + cursor: hand; +} + +#easydex-header-div { + background-repeat: no-repeat; + background-size: 100%; +} + +.unselectable { + user-select: none; +} + +.seed-toggle { + position: absolute; + right: 0; + top: 0px; + cursor: pointer; + cursor: hand; +} + +.radio-custom input { + cursor: pointer; + cursor: hand; +} + +.collapse { + overflow: hidden; + display: block; +} + +.collapse-active { + transition: height 0.3s ease-out; +} + +.rc-tree { + height: 450px; + overflow-y: scroll; + margin-top: 20px; + + a { + pointer-events: none; + } + li span.rc-tree-iconEle { + display: none; + } +} + +.rc-tree-node-content-wrapper-close + ul { + height: 0; +} +.rc-tree-node-content-wrapper { + user-select: none; +} +.rc-tree-node-content-wrapper-normal { + color: inherit; + pointer-events: all; + user-select: all; +} + +#RefreshBasiliskConnectionsMdl .btn-close { + position: absolute; + top: 15px; + right: 15px; +} + +.page-aside { + position: fixed; +} + +.page-aside-inner .wallet-widgets-list { + overflow-y: auto; + height: 100%; +} + +.display-sync-only-coins-toggle { + cursor: pointer; +} +.display-sync-only-coins-toggle:hover { + color: #ffa726; +} + +.btn-add-coin-item, +.btn-add-coin-item-options, +.btn-save-coin-selection, +.btn-load-coin-selection { + position: absolute; + right: 32px; + z-index: 50; +} +.btn-add-coin-item { + right: 60px; +} +.btn-add-coin-item-options { + padding: 6px; +} +.btn-save-coin-selection { + top: 60px; +} +.btn-load-coin-selection { + top: 95px; +} + +.btn-outline-primary { + color: #FF6600; + background-color: #fff; + border-color: #FF6600; +} + +.add-coin-modal { + .modal-body { + max-height: 590px; + overflow-y: auto; + } + + .multi { + .col-sm-8 { + width: 30%; + } + .col-sm-12 { + &.text-center { + width: 60%; + padding: 0; + + .col-lg-4 { + width: 25%; + margin-right: 8%; + padding: 0; + + .input.to-labelauty+label { + max-width: 136px; + } + } + .col-lg-4:last-child { + margin-right: 0; + } + .col-sm-1 { + width: 44px; + padding: 0; + } + } + } + } +} + +.sync-only-forks { + color: #757575; + + .modal-body { + overflow-y: auto; + } + .badge{ + &.up { + position: absolute; + top: 40px; + left: 65px; + margin: 0 5px; + } + } + .avatar { + width: 20%; + display: inline-block; + text-align: center; + vertical-align: top; + + img { + width: 55px; + display: inherit; + } + } + .progress-bars { + padding-left: 40px; + display: inline-block; + width: 80%; + margin: 0 auto; + } + .padding-bottom-60:last-child { + padding-bottom: 0 !important; + } +} + +#SettingsAccordion { + .panel { + .panel-collapse { + transition: all .3s; + + &.collapse { + height: 0; + } + } + } +} + +.center { + text-align: center; +} + +.navbar { + &.navbar-fixed-top { + .dropdown { + &.open { + .dropdown-menu { + right: 0; + } + } + .dropdown-menu { + display: block; + right: -165px; + } + } + } +} + +/* The switch - the box around the slider */ +.switch { + position: relative; + display: inline-block; + width: 40px; + height: 24px; +} + +/* Hide default HTML checkbox */ +.switch input { + display: none; +} + +/* The slider */ +.slider { + border-radius: 20px; + position: absolute; + cursor: pointer; + top: 0; + left: 0; + right: 0; + bottom: 0; + background-color: #ccc; + -webkit-transition: .4s; + transition: .4s; +} + +.slider:before { + border-radius: 50%; + position: absolute; + content: ""; + height: 20px; + width: 20px; + left: 2px; + bottom: 2px; + background-color: white; + -webkit-transition: .4s; + transition: .4s; +} + +.toggle-label { + color: #757575; + display: inline-block; + position: relative; + top: -12px; + left: 8px; +} + +input:checked + .slider { + background-color: rgb(57, 73, 171); +} + +input:focus + .slider { + box-shadow: 0 0 1px rgb(57, 73, 171); +} + +input:checked + .slider:before { + -webkit-transform: translateX(16px); + -ms-transform: translateX(16px); + transform: translateX(16px); +} + +.dropdown-menu li { + cursor: pointer; +} + +/* Rounded sliders */ +.slider.round { + border-radius: 34px; +} + +.slider.round:before { + border-radius: 50%; +} + +.pointer { + cursor: pointer; +} + +.text-center { + text-align: center; +} + +.breadcrumb > li + li:before { + display: none; +} + +.notifications-modal { + color: #757575; +} + +.notifications { + .notice { + position: relative; + margin: 1em; + background: #F9F9F9; + padding: 1em 1em 1em 2em; + border-left: 4px solid #DDD; + box-shadow: 0 1px 1px rgba(0, 0, 0, 0.125); + } + + .notice:before { + position: absolute; + top: 50%; + margin-top: -17px; + left: -17px; + background-color: #DDD; + color: #FFF; + width: 30px; + height: 30px; + border-radius: 100%; + text-align: center; + line-height: 30px; + font-weight: bold; + font-family: Georgia; + text-shadow: 1px 1px rgba(0, 0, 0, 0.5); + } + + .info { + border-color: #0074D9; + } + + .info:before { + content: 'i'; + background-color: #0074D9; + } + + .success { + border-color: #2ECC40; + } + + .success:before { + content: '√'; + background-color: #2ECC40; + } + + .warning { + border-color: #FFDC00; + } + + .warning:before { + content: '!'; + background-color: #FFDC00; + } + + .error { + border-color: #FF4136; + } + + .error:before { + content: 'X'; + background-color: #FF4136; + } +} + +.notifications-badge { + position: fixed; + bottom: 10px; + left: 5px; + cursor: pointer; + height: 20px; + z-index: 20; + + .badge { + margin-left: 2px; + font-weight: bold; + } + .badge.success { + color: #3c763d; + background-color: #dff0d8; + border-color: #d6e9c6; + } + .badge.pending { + color: #8a6d3b; + background-color: #fcf8e3; + border-color: #faebcc; + } + .badge.error { + color: #a94442; + background-color: #f2dede; + border-color: #ebccd1; + } + + .spinner-hide { + >div { + display: none; + } + } + + .spinner { + position: absolute; + left: 60px; + bottom: -12px; + + >div { + background-color: #fff; + margin-right: 1px; + width: 3px; + } + } + + &.stick-to-top { + top: -3px; + left: 470px; + z-index: 1500; + + .spinner { + display: inline-block; + position: relative; + left: -4px; + bottom: -16px; + + >div { + background-color: #00bcd4; + margin-right: 1px; + width: 3px; + } + } + } +} + +#js-copytextarea { + opacity: 0; + height: 10px; + width: 200px; +} + +#app { + height: 100%; +} + +.spinner { + width: 50px; + height: 40px; + text-align: center; + font-size: 10px; +} + +.spinner > div { + background-color: #333; + height: 100%; + width: 6px; + display: inline-block; + + -webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out; + animation: sk-stretchdelay 1.2s infinite ease-in-out; +} + +.spinner .rect2 { + -webkit-animation-delay: -1.1s; + animation-delay: -1.1s; +} + +.spinner .rect3 { + -webkit-animation-delay: -1.0s; + animation-delay: -1.0s; +} + +.spinner .rect4 { + -webkit-animation-delay: -0.9s; + animation-delay: -0.9s; +} + +.spinner .rect5 { + -webkit-animation-delay: -0.8s; + animation-delay: -0.8s; +} + +@-webkit-keyframes sk-stretchdelay { + 0%, 40%, 100% { -webkit-transform: scaleY(0.4) } + 20% { -webkit-transform: scaleY(1.0) } +} + +@keyframes sk-stretchdelay { + 0%, 40%, 100% { + transform: scaleY(0.4); + -webkit-transform: scaleY(0.4); + } 20% { + transform: scaleY(1.0); + -webkit-transform: scaleY(1.0); + } +} + +.bootstrap-select > .dropdown-toggle { + z-index: 0; +} \ No newline at end of file diff --git a/react/src/styles/index.scss b/react/src/styles/index.scss index 4d3038d..3b3c8e4 100644 --- a/react/src/styles/index.scss +++ b/react/src/styles/index.scss @@ -33,550 +33,4 @@ @import '../components/addcoin/addcoin.scss'; @import '../components/dashboard/dashboard.scss'; @import '../components/login/login.scss'; - -#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; -} - -.login-form, -.register-form { - width: 540px; - margin: 30px 0; -} - -#section-iguana-wallet-settings .panel-title { - cursor: pointer; - cursor: hand; -} - -#section-iguana-wallet-settings .panel-title:before { - content: '\F273'; -} -#section-iguana-wallet-settings .panel-title.collapsed:before { - content: '\F278'; -} - -#section-dashboard { - height: 100%; -} - -#section-iguana-wallet-settings { - background: #f3f4f5; -} - -#edexcoin_dashboardinfo a, -.nav-top-menu, -#kmd_txid_info_mdl .nav-tabs li, -.pagination a, -.action { - cursor: pointer; - cursor: hand; -} - -#easydex-header-div { - background-repeat: no-repeat; - background-size: 100%; -} - -.unselectable { - user-select: none; -} - -.seed-toggle { - position: absolute; - right: 0; - top: 0px; - cursor: pointer; - cursor: hand; -} - -.radio-custom input { - cursor: pointer; - cursor: hand; -} - -.collapse { - overflow: hidden; - display: block; -} - -.collapse-active { - transition: height 0.3s ease-out; -} - -.rc-tree { - height: 450px; - overflow-y: scroll; - margin-top: 20px; - - a { - pointer-events: none; - } - li span.rc-tree-iconEle { - display: none; - } -} - -.rc-tree-node-content-wrapper-close + ul { - height: 0; -} -.rc-tree-node-content-wrapper { - user-select: none; -} -.rc-tree-node-content-wrapper-normal { - color: inherit; - pointer-events: all; - user-select: all; -} - -#RefreshBasiliskConnectionsMdl .btn-close { - position: absolute; - top: 15px; - right: 15px; -} - -.page-aside { - position: fixed; -} - -.page-aside-inner .wallet-widgets-list { - overflow-y: auto; - height: 100%; -} - -.display-sync-only-coins-toggle { - cursor: pointer; -} -.display-sync-only-coins-toggle:hover { - color: #ffa726; -} - -.btn-add-coin-item, -.btn-add-coin-item-options, -.btn-save-coin-selection, -.btn-load-coin-selection { - position: absolute; - right: 32px; - z-index: 50; -} -.btn-add-coin-item { - right: 60px; -} -.btn-add-coin-item-options { - padding: 6px; -} -.btn-save-coin-selection { - top: 60px; -} -.btn-load-coin-selection { - top: 95px; -} - -.btn-outline-primary { - color: #FF6600; - background-color: #fff; - border-color: #FF6600; -} - -.add-coin-modal { - .modal-body { - max-height: 590px; - overflow-y: auto; - } - - .multi { - .col-sm-8 { - width: 30%; - } - .col-sm-12 { - &.text-center { - width: 60%; - padding: 0; - - .col-lg-4 { - width: 25%; - margin-right: 8%; - padding: 0; - - .input.to-labelauty+label { - max-width: 136px; - } - } - .col-lg-4:last-child { - margin-right: 0; - } - .col-sm-1 { - width: 44px; - padding: 0; - } - } - } - } -} - -.sync-only-forks { - color: #757575; - - .modal-body { - overflow-y: auto; - } - .badge{ - &.up { - position: absolute; - top: 40px; - left: 65px; - margin: 0 5px; - } - } - .avatar { - width: 20%; - display: inline-block; - text-align: center; - vertical-align: top; - - img { - width: 55px; - display: inherit; - } - } - .progress-bars { - padding-left: 40px; - display: inline-block; - width: 80%; - margin: 0 auto; - } - .padding-bottom-60:last-child { - padding-bottom: 0 !important; - } -} - -#SettingsAccordion { - .panel { - .panel-collapse { - transition: all .3s; - - &.collapse { - height: 0; - } - } - } -} - -.center { - text-align: center; -} - -.navbar { - &.navbar-fixed-top { - .dropdown { - &.open { - .dropdown-menu { - right: 0; - } - } - .dropdown-menu { - display: block; - right: -165px; - } - } - } -} - -/* The switch - the box around the slider */ -.switch { - position: relative; - display: inline-block; - width: 40px; - height: 24px; -} - -/* Hide default HTML checkbox */ -.switch input { - display: none; -} - -/* The slider */ -.slider { - border-radius: 20px; - position: absolute; - cursor: pointer; - top: 0; - left: 0; - right: 0; - bottom: 0; - background-color: #ccc; - -webkit-transition: .4s; - transition: .4s; -} - -.slider:before { - border-radius: 50%; - position: absolute; - content: ""; - height: 20px; - width: 20px; - left: 2px; - bottom: 2px; - background-color: white; - -webkit-transition: .4s; - transition: .4s; -} - -.toggle-label { - color: #757575; - display: inline-block; - position: relative; - top: -12px; - left: 8px; -} - -input:checked + .slider { - background-color: rgb(57, 73, 171); -} - -input:focus + .slider { - box-shadow: 0 0 1px rgb(57, 73, 171); -} - -input:checked + .slider:before { - -webkit-transform: translateX(16px); - -ms-transform: translateX(16px); - transform: translateX(16px); -} - -.dropdown-menu li { - cursor: pointer; -} - -/* Rounded sliders */ -.slider.round { - border-radius: 34px; -} - -.slider.round:before { - border-radius: 50%; -} - -.pointer { - cursor: pointer; -} - -.text-center { - text-align: center; -} - -.breadcrumb > li + li:before { - display: none; -} - -.notifications-modal { - color: #757575; -} - -.notifications { - .notice { - position: relative; - margin: 1em; - background: #F9F9F9; - padding: 1em 1em 1em 2em; - border-left: 4px solid #DDD; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.125); - } - - .notice:before { - position: absolute; - top: 50%; - margin-top: -17px; - left: -17px; - background-color: #DDD; - color: #FFF; - width: 30px; - height: 30px; - border-radius: 100%; - text-align: center; - line-height: 30px; - font-weight: bold; - font-family: Georgia; - text-shadow: 1px 1px rgba(0, 0, 0, 0.5); - } - - .info { - border-color: #0074D9; - } - - .info:before { - content: 'i'; - background-color: #0074D9; - } - - .success { - border-color: #2ECC40; - } - - .success:before { - content: '√'; - background-color: #2ECC40; - } - - .warning { - border-color: #FFDC00; - } - - .warning:before { - content: '!'; - background-color: #FFDC00; - } - - .error { - border-color: #FF4136; - } - - .error:before { - content: 'X'; - background-color: #FF4136; - } -} - -.notifications-badge { - position: fixed; - bottom: 10px; - left: 5px; - cursor: pointer; - height: 20px; - z-index: 20; - - .badge { - margin-left: 2px; - font-weight: bold; - } - .badge.success { - color: #3c763d; - background-color: #dff0d8; - border-color: #d6e9c6; - } - .badge.pending { - color: #8a6d3b; - background-color: #fcf8e3; - border-color: #faebcc; - } - .badge.error { - color: #a94442; - background-color: #f2dede; - border-color: #ebccd1; - } - - .spinner-hide { - >div { - display: none; - } - } - - .spinner { - position: absolute; - left: 60px; - bottom: -12px; - - >div { - background-color: #fff; - margin-right: 1px; - width: 3px; - } - } - - &.stick-to-top { - top: -3px; - left: 470px; - z-index: 1500; - - .spinner { - display: inline-block; - position: relative; - left: -4px; - bottom: -16px; - - >div { - background-color: #00bcd4; - margin-right: 1px; - width: 3px; - } - } - } -} - -#js-copytextarea { - opacity: 0; - height: 10px; - width: 200px; -} - -#app { - height: 100%; -} - -.spinner { - width: 50px; - height: 40px; - text-align: center; - font-size: 10px; -} - -.spinner > div { - background-color: #333; - height: 100%; - width: 6px; - display: inline-block; - - -webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out; - animation: sk-stretchdelay 1.2s infinite ease-in-out; -} - -.spinner .rect2 { - -webkit-animation-delay: -1.1s; - animation-delay: -1.1s; -} - -.spinner .rect3 { - -webkit-animation-delay: -1.0s; - animation-delay: -1.0s; -} - -.spinner .rect4 { - -webkit-animation-delay: -0.9s; - animation-delay: -0.9s; -} - -.spinner .rect5 { - -webkit-animation-delay: -0.8s; - animation-delay: -0.8s; -} - -@-webkit-keyframes sk-stretchdelay { - 0%, 40%, 100% { -webkit-transform: scaleY(0.4) } - 20% { -webkit-transform: scaleY(1.0) } -} - -@keyframes sk-stretchdelay { - 0%, 40%, 100% { - transform: scaleY(0.4); - -webkit-transform: scaleY(0.4); - } 20% { - transform: scaleY(1.0); - -webkit-transform: scaleY(1.0); - } -} \ No newline at end of file +@import '../components/overrides.scss'; \ No newline at end of file