Expand cache

This commit is contained in:
James Cole
2023-08-27 07:45:09 +02:00
parent 66cc3f48bc
commit 83d94cb792
12 changed files with 261 additions and 61 deletions

View File

@@ -53,18 +53,17 @@ export default () => ({
let options = window.store.get(CHART_CACHE_KEY);
this.drawChart(options);
this.loading = false;
return;
}
if (!cacheValid || typeof cachedData === 'undefined') {
const dashboard = new Dashboard();
dashboard.dashboard(new Date(window.store.get('start')), new Date(window.store.get('end')), null).then((response) => {
this.chartData = response.data;
// cache generated options:
let options = this.generateOptions(this.chartData);
window.store.set(CHART_CACHE_KEY, options);
this.drawChart(options);
this.loading = false;
});
}
const dashboard = new Dashboard();
dashboard.dashboard(new Date(window.store.get('start')), new Date(window.store.get('end')), null).then((response) => {
this.chartData = response.data;
// cache generated options:
let options = this.generateOptions(this.chartData);
window.store.set(CHART_CACHE_KEY, options);
this.drawChart(options);
this.loading = false;
});
},
generateOptions(data) {
@@ -150,14 +149,11 @@ export default () => ({
chart = new Chart(document.querySelector("#account-chart"), options);
},
loadAccounts() {
// console.log('loadAccounts');
if (true === this.loadingAccounts) {
// console.log('loadAccounts CANCELLED');
return;
}
this.loadingAccounts = true;
if (this.accountList.length > 0) {
// console.log('NO need to load account data');
this.loadingAccounts = false;
return;
}
@@ -217,6 +213,7 @@ export default () => ({
// console.log(parent);
accounts.push({
name: parent.attributes.name,
order: parent.attributes.order,
id: parent.id,
balance_raw: parseFloat(parent.attributes.current_balance),
balance: formatMoney(parent.attributes.current_balance, parent.attributes.currency_code),
@@ -224,8 +221,11 @@ export default () => ({
native_balance: formatMoney(parent.attributes.native_current_balance, parent.attributes.native_code),
groups: groups,
});
console.log(parent.attributes);
count++;
if (count === totalAccounts) {
accounts.sort((a, b) => a.order - b.order); // b - a for reverse sort
this.accountList = accounts;
this.loadingAccounts = false;
window.store.set(ACCOUNTS_CACHE_KEY, accounts);

View File

@@ -24,7 +24,7 @@ import {getVariable} from "../../store/get-variable.js";
import formatMoney from "../../util/format-money.js";
let afterPromises = false;
const CACHE_KEY = 'dashboard-boxes-data';
export default () => ({
balanceBox: {amounts: [], subtitles: []},
billBox: {paid: [], unpaid: []},
@@ -35,6 +35,16 @@ export default () => ({
boxData: null,
boxOptions: null,
getFreshData() {
const cacheValid = window.store.get('cacheValid');
let cachedData = window.store.get(CACHE_KEY);
if (cacheValid && typeof cachedData !== 'undefined') {
this.boxData = cachedData;
this.generateOptions(this.boxData);
return;
}
// get stuff
let getter = new Summary();
let start = new Date(window.store.get('start'));
@@ -42,6 +52,7 @@ export default () => ({
getter.get(format(start, 'yyyy-MM-dd'), format(end, 'yyyy-MM-dd'), null).then((response) => {
this.boxData = response.data;
window.store.set(CACHE_KEY, response.data);
this.generateOptions(this.boxData);
//this.drawChart();
});

View File

@@ -32,7 +32,7 @@ let afterPromises = false;
let i18n; // for translating items in the chart.
const CACHE_KEY = 'dashboard-budgets-chart';
export default () => ({
loading: false,
autoConversion: false,
@@ -58,10 +58,21 @@ export default () => ({
chart = new Chart(document.querySelector("#budget-chart"), options);
},
getFreshData() {
const cacheValid = window.store.get('cacheValid');
let cachedData = window.store.get(CACHE_KEY);
if (cacheValid && typeof cachedData !== 'undefined') {
chartData = cachedData; // save chart data for later.
this.drawChart(this.generateOptions(chartData));
this.loading = false;
return;
}
const dashboard = new Dashboard();
dashboard.dashboard(new Date(window.store.get('start')), new Date(window.store.get('end')), null).then((response) => {
chartData = response.data; // save chart data for later.
this.drawChart(this.generateOptions(response.data));
this.drawChart(this.generateOptions(chartData));
window.store.set(CACHE_KEY, chartData);
this.loading = false;
});
},
@@ -93,19 +104,19 @@ export default () => ({
label: i18n.t('firefly.spent'),
data: [],
borderWidth: 1,
stack: 1
stack: 1,
},
{
label: i18n.t('firefly.left'),
data: [],
borderWidth: 1,
stack: 1
stack: 1,
},
{
label: i18n.t('firefly.overspent'),
data: [],
borderWidth: 1,
stack: 1
stack: 1,
}
]
};
@@ -158,13 +169,13 @@ export default () => ({
i18n = new I18n();
i18n.locale = values[1];
loadTranslations(i18n, values[1]);
this.autoConversion = values[0];
afterPromises = true;
if (false === this.loading) {
this.loadChart();
}
loadTranslations(i18n, values[1]).then(() => {
this.autoConversion = values[0];
afterPromises = true;
if (false === this.loading) {
this.loadChart();
}
});
});
window.store.observe('end', () => {
if (!afterPromises) {
@@ -172,7 +183,7 @@ export default () => ({
}
// console.log('boxes observe end');
if (false === this.loading) {
this.chartData = null;
chartData = null;
this.loadChart();
}
});

View File

@@ -28,6 +28,8 @@ let chart = null;
let chartData = null;
let afterPromises = false;
const CACHE_KEY = 'dashboard-categories-chart';
export default () => ({
loading: false,
autoConversion: false,
@@ -140,10 +142,21 @@ export default () => ({
},
getFreshData() {
const cacheValid = window.store.get('cacheValid');
let cachedData = window.store.get(CACHE_KEY);
if (cacheValid && typeof cachedData !== 'undefined') {
chartData = cachedData; // save chart data for later.
this.drawChart(this.generateOptions(chartData));
this.loading = false;
return;
}
const dashboard = new Dashboard();
dashboard.dashboard(new Date(window.store.get('start')), new Date(window.store.get('end')), null).then((response) => {
chartData = response.data; // save chart data for later.
this.drawChart(this.generateOptions(response.data));
window.store.set(CACHE_KEY, chartData);
this.loading = false;
});
},

View File

@@ -25,6 +25,7 @@ import {loadTranslations} from "../../support/load-translations.js";
let apiData = {};
let afterPromises = false;
let i18n;
const CACHE_KEY = 'dashboard-piggies-data';
export default () => ({
loading: false,
@@ -32,6 +33,16 @@ export default () => ({
sankeyGrouping: 'account',
piggies: [],
getFreshData() {
const cacheValid = window.store.get('cacheValid');
let cachedData = window.store.get(CACHE_KEY);
if (cacheValid && typeof cachedData !== 'undefined') {
apiData = cachedData;
this.parsePiggies();
this.loading = false;
return;
}
let params = {
start: window.store.get('start').slice(0, 10),
end: window.store.get('end').slice(0, 10),
@@ -49,6 +60,7 @@ export default () => ({
this.downloadPiggyBanks(params);
return;
}
window.store.set(CACHE_KEY, apiData);
this.parsePiggies();
this.loading = false;
});
@@ -114,12 +126,14 @@ export default () => ({
i18n = new I18n();
i18n.locale = values[1];
loadTranslations(i18n, values[1]);
loadTranslations(i18n, values[1]).then(() => {
// console.log('piggies after promises');
afterPromises = true;
this.autoConversion = values[0];
this.loadPiggyBanks();
});
// console.log('piggies after promises');
afterPromises = true;
this.autoConversion = values[0];
this.loadPiggyBanks();
});
window.store.observe('end', () => {
if (!afterPromises) {

View File

@@ -27,6 +27,7 @@ import {I18n} from "i18n-js";
Chart.register({SankeyController, Flow});
const CACHE_KEY = 'dashboard-sankey-data';
let i18n;
let currencies = [];
let afterPromises = false;
@@ -256,7 +257,7 @@ export default () => ({
let dataSet =
// sankey chart has one data set.
{
label: 'My sankey',
label: 'Firefly III dashboard sankey chart',
data: [],
colorFrom: (c) => getColor(c.dataset.data[c.dataIndex].from),
colorTo: (c) => getColor(c.dataset.data[c.dataIndex].to),
@@ -284,6 +285,17 @@ export default () => ({
},
getFreshData() {
const cacheValid = window.store.get('cacheValid');
let cachedData = window.store.get(CACHE_KEY);
if (cacheValid && typeof cachedData !== 'undefined') {
transactions = cachedData;
this.drawChart(this.generateOptions());
this.loading = false;
return;
}
let params = {
start: window.store.get('start').slice(0, 10),
end: window.store.get('end').slice(0, 10),
@@ -305,9 +317,7 @@ export default () => ({
this.downloadTransactions(params);
return;
}
// continue to next step.
//console.log('Final page!');
//console.log(transactions);
window.store.set(CACHE_KEY, transactions);
this.drawChart(this.generateOptions());
this.loading = false;
});
@@ -347,13 +357,13 @@ export default () => ({
translations.expense_account = i18n.t('firefly.expense_account');
translations.revenue_account = i18n.t('firefly.revenue_account');
translations.budget = i18n.t('firefly.budget');
// console.log('sankey after promises');
afterPromises = true;
this.autoConversion = values[0];
this.loadChart();
});
// console.log('sankey after promises');
afterPromises = true;
this.autoConversion = values[0];
this.loadChart();
});
window.store.observe('end', () => {
if (!afterPromises) {

View File

@@ -25,6 +25,8 @@ import {Chart} from 'chart.js';
import {I18n} from "i18n-js";
import {loadTranslations} from "../../support/load-translations.js";
const CACHE_KEY = 'dashboard-subscriptions-data';
let chart = null;
let chartData = null;
let afterPromises = false;
@@ -54,6 +56,17 @@ export default () => ({
chart = new Chart(document.querySelector("#subscriptions-chart"), options);
},
getFreshData() {
const cacheValid = window.store.get('cacheValid');
let cachedData = window.store.get(CACHE_KEY);
if (cacheValid && typeof cachedData !== 'undefined') {
this.drawChart(this.generateOptions(cachedData));
this.loading = false;
return;
}
const getter = new Get();
let params = {
start: format(new Date(window.store.get('start')), 'y-MM-dd'),
@@ -65,6 +78,7 @@ export default () => ({
getter.unpaid(params).then((response) => {
let unpaidData = response.data;
let chartData = {paid: paidData, unpaid: unpaidData};
window.store.set(CACHE_KEY, chartData);
this.drawChart(this.generateOptions(chartData));
this.loading = false;
});
@@ -138,12 +152,13 @@ export default () => ({
i18n = new I18n();
i18n.locale = values[1];
loadTranslations(i18n, values[1]);
loadTranslations(i18n, values[1]).then(() => {
if (false === this.loading) {
this.loadChart();
}
});
if (false === this.loading) {
this.loadChart();
}
});
window.store.observe('end', () => {
if (!afterPromises) {

View File

@@ -0,0 +1,103 @@
/*
* get-colors.js
* Copyright (c) 2023 james@firefly-iii.org
*
* This file is part of Firefly III (https://github.com/firefly-iii).
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as
* published by the Free Software Foundation, either version 3 of the
* License, or (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Affero General Public License for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*/
// some default colors in dark and light:
import {Color} from '@kurkle/color';
// base colors for most things
let red = new Color('#dc3545'); // same as bootstrap danger
let green = new Color('#198754'); // same as bootstrap success.
let blue = new Color('#0d6efd'); // bootstrap blue.
// four other colors:
let orange = new Color('#fd7e14'); // bootstrap orange.
let index = 0;
// or cycle through X colors:
if ('light' === window.theme) {
red.lighten(0.3).clearer(0.3);
green.lighten(0.3).clearer(0.3);
blue.lighten(0.3).clearer(0.3);
orange.lighten(0.3).clearer(0.3);
}
let allColors = [red, green, blue, orange];
function getColors(type, field) {
index++;
let colors = {
borderColor: red.rgbString(),
backgroundColor: red.rgbString(),
};
let border;
switch (type) {
default:
let currentIndex = (Math.ceil(index / 2) % allColors.length) - 1;
border = new Color(allColors[currentIndex].rgbString());
border.darken(0.4);
colors = {
borderColor: border.rgbString(),
backgroundColor: allColors[currentIndex].rgbString(),
};
break;
case 'spent':
border = new Color(blue.rgbString());
border.darken(0.4);
colors = {
borderColor: border.rgbString(),
backgroundColor: blue.rgbString(),
};
break;
case 'left':
border = new Color(green.rgbString());
border.darken(0.4);
colors = {
borderColor: border.rgbString(),
backgroundColor: green.rgbString(),
};
break;
case 'overspent':
border = new Color(red.rgbString());
border.darken(0.4);
colors = {
borderColor: border.rgbString(),
backgroundColor: red.rgbString(),
};
break;
}
if ('border' === field) {
return colors.borderColor;
}
if ('background' === field) {
return colors.backgroundColor;
}
return '#FF0000'; // panic!
}
export {getColors};

View File

@@ -32,13 +32,16 @@
const setTheme = theme => {
if (theme === 'browser' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
document.documentElement.setAttribute('data-bs-theme', 'dark')
window.theme = 'dark';
return;
}
if (theme === 'browser' && window.matchMedia('(prefers-color-scheme: light)').matches) {
window.theme = 'light';
document.documentElement.setAttribute('data-bs-theme', 'light')
return;
}
document.documentElement.setAttribute('data-bs-theme', theme)
window.theme = theme;
}
setTheme(getPreferredTheme())