Commit c74aed73 authored by Benjamin Bouvier's avatar Benjamin Bouvier
Browse files

Spinnerz gonna spin! Fixes #143

parent bc1025b7
......@@ -2,19 +2,14 @@ import React from 'react';
import { translate as $t } from '../../helpers';
export default class WeboobInstallReadme extends React.Component {
render() {
return (
<div>
<h1>
{ $t('client.weboobinstallreadme.title') }
</h1>
<div className="well">
{ $t('client.weboobinstallreadme.content') }
<a href="https://framagit.org/bnjbvr/kresus/blob/incoming/README.md">README</a>.
</div>
</div>
);
}
}
export default () => (
<div>
<h1>
{ $t('client.weboobinstallreadme.title') }
</h1>
<div className="well">
{ $t('client.weboobinstallreadme.content') }
<a href="https://framagit.org/bnjbvr/kresus/blob/incoming/README.md">README</a>.
</div>
</div>
);
import React from 'react';
import { translate as $t } from '../../helpers';
export default () => (<div className="row">
<div className="col-sm-3 hidden-xs" />
<div className="col-sm-6 col-xs-12">
<div className="top-panel panel panel-default">
<div className="panel-heading">
<h3 className="text-center">
{ $t('client.spinner.title') }
</h3>
</div>
<div className="panel-body text-center">
<div className="spinner"/>
{ $t('client.spinner.content') }
</div>
</div>
</div>
</div>);
......@@ -666,3 +666,68 @@ span.fa-star-o:hover:before, span.fa-star-o:hover ~ span.star:before {
span.fa-star {
color: #ffd66a;
}
/* Spinnerz gonna spin */
.spinner {
font-size: 10px;
margin: 50px auto;
text-indent: -9999em;
width: 11em;
height: 11em;
border-radius: 50%;
background: #0055ff;
background: -moz-linear-gradient(left, #0055ff 10%, rgba(0,85,255, 0) 42%);
background: -webkit-linear-gradient(left, #0055ff 10%, rgba(0,85,255, 0) 42%);
background: -o-linear-gradient(left, #0055ff 10%, rgba(0,85,255, 0) 42%);
background: -ms-linear-gradient(left, #0055ff 10%, rgba(0,85,255, 0) 42%);
background: linear-gradient(to right, #0055ff 10%, rgba(0,85,255, 0) 42%);
position: relative;
-webkit-animation: spin3 1.4s infinite linear;
animation: spin3 1.4s infinite linear;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
}
.spinner:before {
width: 50%;
height: 50%;
background: #0055ff;
border-radius: 100% 0 0 0;
position: absolute;
top: 0;
left: 0;
content: '';
}
.spinner:after {
background: #fff;
width: 75%;
height: 75%;
border-radius: 50%;
content: '';
margin: auto;
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
}
@-webkit-keyframes spin3 {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes spin3 {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
......@@ -16,6 +16,7 @@ import DuplicatesList from './components/duplicates';
import Settings from './components/settings';
import AccountWizard from './components/init/account-wizard';
import WeboobInstallReadme from './components/init/weboob-readme';
import Loading from './components/ui/loading';
// Now this really begins.
class BaseApp extends React.Component {
......@@ -39,6 +40,10 @@ class BaseApp extends React.Component {
return <WeboobInstallReadme />;
}
if (this.props.backgroundProcessing) {
return <Loading />;
}
if (!this.props.hasAccess) {
return <AccountWizard />;
}
......@@ -145,7 +150,8 @@ class BaseApp extends React.Component {
let Kresus = connect(state => {
return {
isWeboobInstalled: get.isWeboobInstalled(state),
hasAccess: get.currentAccessId(state) !== null
hasAccess: get.currentAccessId(state) !== null,
backgroundProcessing: get.backgroundProcessing(state)
};
}, dispatch => {
return {
......
......@@ -590,17 +590,17 @@ function reduceRunSync(state, action) {
if (status === SUCCESS) {
debug('Sync successfully terminated.');
return state;
return u({ isSyncing: false }, state);
}
if (status === FAIL) {
debug('Sync error:', action.error);
handleSyncError(action.error);
return state;
return u({ isSyncing: false, }, state);
}
debug('Starting sync...');
return state;
return u({ isSyncing: true }, state);
}
function reduceRunAccountsSync(state, action) {
......@@ -608,17 +608,17 @@ function reduceRunAccountsSync(state, action) {
if (status === SUCCESS) {
debug('Account sync successfully terminated.');
return state;
return u({ isSyncing: false }, state);
}
if (status === FAIL) {
debug('Account sync error:', action.error);
handleSyncError(action.error);
return state;
return u({ isSyncing: false }, state);
}
debug('Starting accounts sync...');
return state;
return u({ isSyncing: true }, state);
}
function reduceLoadAccounts(state, action) {
......@@ -813,16 +813,16 @@ function reduceDeleteAccount(state, action) {
currentAccountId
}, ret);
return ret;
return u({ isSyncing: false }, ret);
}
if (status === FAIL) {
debug('Failure when deleting account:', action.error);
return state;
return u({ isSyncing: false }, state);
}
debug('Deleting account...');
return state;
return u({ isSyncing: true }, state);
}
function reduceDeleteAccess(state, action) {
......@@ -851,16 +851,16 @@ function reduceDeleteAccess(state, action) {
}, ret);
}
return ret;
return u({ isSyncing: false }, ret);
}
if (status === FAIL) {
debug('Failure when deleting access:', action.error);
return state;
return u({ isSyncing: false }, state);
}
debug('Deleting access...');
return state;
return u({ isSyncing: true }, state);
}
function reduceCreateAccess(state, action) {
......@@ -869,18 +869,19 @@ function reduceCreateAccess(state, action) {
if (status === SUCCESS) {
debug('Successfully created access.');
return u({
accesses: state.accesses.concat(action.access)
accesses: state.accesses.concat(action.access),
isSyncing: false
}, state);
}
if (status === FAIL) {
debug('Failure when creating access:', action.error);
handleFirstSyncError(action.error);
return state;
return u({ isSyncing: false }, state);
}
debug('Creating access...');
return state;
return u({ isSyncing: true }, state);
}
function reduceCreateAlert(state, action) {
......@@ -1067,6 +1068,7 @@ export function initialState(external, allBanks, allAccounts, allOperations, all
alerts,
currentAccessId,
currentAccountId,
isSyncing: false,
constants: {
defaultCurrency
}
......@@ -1074,6 +1076,10 @@ export function initialState(external, allBanks, allAccounts, allOperations, all
}
// Getters
export function isSyncing(state) {
return state.isSyncing;
}
export function getCurrentAccessId(state) {
return state.currentAccessId;
}
......
......@@ -210,6 +210,13 @@ export const get = {
return version !== '?' && version !== '1.0';
},
// Bool
backgroundProcessing(state) {
assertDefined(state);
return Settings.isImporting(state.settings) ||
Bank.isSyncing(state.banks);
},
isWeboobUpdating(state) {
assertDefined(state);
return Settings.isWeboobUpdating(state.settings);
......
......@@ -190,16 +190,17 @@ function reduceImportInstance(state, action) {
debug('Successfully imported instance');
// Main reducer is in the main store (for reloading the entire
// instance).
// isImporting is reset via the call to initialState().
return state;
}
if (status === FAIL) {
debug('Error when importing instance', action.error);
return state;
return u({ isImporting: false }, state);
}
debug('Importing instance...');
return state;
return u({ isImporting: true }, state);
}
const reducers = {
......@@ -227,7 +228,8 @@ export function initialState(settings) {
return u({
map,
updatingWeboob: false
updatingWeboob: false,
isImporting: false
}, {});
}
......@@ -240,6 +242,10 @@ export function isWeboobUpdating(state) {
return state.updatingWeboob;
}
export function isImporting(state) {
return state.isImporting;
}
export function get(state, key) {
assert(DefaultSettings.has(key),
`all settings must have default values, but ${key} doesn't have one.`);
......
......@@ -357,6 +357,11 @@ module.exports = {
labelMonthPrev: 'Previous month',
labelMonthSelect: 'Select a month',
labelYearSelect: 'Select a year'
},
spinner: {
title: "Please wait...",
content: "Kresus is processing your demand, hang tight!"
}
},
......
......@@ -357,6 +357,11 @@ module.exports = {
labelMonthPrev: 'Mois précédent',
labelMonthSelect: 'Sélectionner un mois',
labelYearSelect: 'Sélectionner une année'
},
spinner: {
title: "Veuillez patienter...",
content: "Kresus est en train d'exécuter vos souhaits, à tout de suite !"
}
},
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment