diff --git a/src/render.ts b/src/render.ts
index 3474540..9973417 100644
--- a/src/render.ts
+++ b/src/render.ts
@@ -4,28 +4,32 @@ export function renderInputs() {
console.log("Rendering input elements");
const settingsMap = new Map(Object.entries(settings));
+ const inputElements = inputs
+ .map(({ label, description, settingsKey, isPercentage, id }) => {
+ const value = settingsMap.get(settingsKey)!;
+ return `
+
+
+
+
${description}
+
`;
+ })
+ .join("");
document.getElementById("controls")!.innerHTML =
`Inputs
` +
- inputs
- .map(({ label, description, settingsKey, isPercentage, id }) => {
- const value = settingsMap.get(settingsKey)!;
- return `
-
-
-
-
${description}
-
`;
- })
- .join("");
+ inputElements +
+ ``;
}
// renderInputs();
diff --git a/src/settings.ts b/src/settings.ts
index c769a3a..838be0a 100644
--- a/src/settings.ts
+++ b/src/settings.ts
@@ -22,23 +22,25 @@ interface Inputs {
id: string;
}
-const settings: Settings = window.localStorage.getItem("settings")
+const defaults = {
+ currentAge: 30,
+ retirementAge: 65,
+ lifeExpectancy: 90,
+ netSalary: 30000,
+ salaryIncrease: 0.02,
+ savingsPercentage: 0.15,
+ currentSavings: 0,
+ livingCosts: 0,
+ averageInflation: 0.03,
+ retirementIncome: 50000,
+ retirementIncomeIncrease: 0,
+ rateOfReturn: 0.075,
+ tax: 0.275
+};
+
+let settings: Settings = window.localStorage.getItem("settings")
? JSON.parse(window.localStorage.getItem("settings")!)
- : {
- currentAge: 30,
- retirementAge: 65,
- lifeExpectancy: 90,
- netSalary: 30000,
- salaryIncrease: 0.02,
- savingsPercentage: 0.15,
- currentSavings: 0,
- livingCosts: 0,
- averageInflation: 0.03,
- retirementIncome: 50000,
- retirementIncomeIncrease: 0,
- rateOfReturn: 0.075,
- tax: 0.275
- };
+ : defaults;
const inputs: Inputs[] = [
{
@@ -127,4 +129,13 @@ const inputs: Inputs[] = [
}
];
-export { settings, inputs };
+function resetSettings() {
+ settings = defaults;
+ saveSettings();
+}
+
+function saveSettings() {
+ window.localStorage.setItem("settings", JSON.stringify(settings));
+}
+
+export { settings, inputs, resetSettings, saveSettings };
diff --git a/src/setup.ts b/src/setup.ts
index a141654..9565013 100644
--- a/src/setup.ts
+++ b/src/setup.ts
@@ -1,6 +1,7 @@
import { drawChart } from "./chart";
import { createProjection } from "./projection";
-import { inputs, settings } from "./settings";
+import { renderInputs } from "./render";
+import { inputs, resetSettings, settings } from "./settings";
export function setupEventListeners() {
inputs.forEach((input) =>
@@ -13,9 +14,14 @@ export function setupEventListeners() {
: element.valueAsNumber;
// console.log(settings);
- window.localStorage.setItem("settings", JSON.stringify(settings));
const data = createProjection();
drawChart(data);
})
);
+ document.getElementById("reset")!.addEventListener("click", () => {
+ resetSettings();
+ renderInputs();
+ const data = createProjection();
+ drawChart(data);
+ });
}