From 13229d1123dfb269452696984a783962705f9820 Mon Sep 17 00:00:00 2001 From: enricobuehler Date: Tue, 2 Aug 2022 12:13:30 +0200 Subject: [PATCH] - initial commit --- index.html | 64 +++++++++++++++++++++++++++++++++++++++++ main.js | 84 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 148 insertions(+) create mode 100644 index.html create mode 100644 main.js diff --git a/index.html b/index.html new file mode 100644 index 0000000..cbb4eaf --- /dev/null +++ b/index.html @@ -0,0 +1,64 @@ + + + +
+

+ FeBaFix Rechner +

+
+ + + +

Ergebnis

+ + +
+
+ + + + + \ No newline at end of file diff --git a/main.js b/main.js new file mode 100644 index 0000000..a08c7b1 --- /dev/null +++ b/main.js @@ -0,0 +1,84 @@ +class CountCalculator { + constructor() { + // count of the item + this.count = 0; + this.windowsillType; + this.windowsillStrength; + // collect form inputs/outputs + + this.lengthInput = document.getElementById("length-input"); + this.countOutput = document.getElementById("count-output"); + this.windowsillTypeInput = document.getElementById("windowsill-type-input"); + this.windowsillStrengthInput = document.getElementById( + "windowsill-strength-input" + ); + this.windowsillTypeOutput = document.getElementById( + "windowsill-type-output" + ); + this.windowsillStrengthInputContainer = document.getElementById( + "windowsill-strength-input-container" + ); + + // listen for input changes + this.lengthInput.addEventListener("change", (e) => { + this.handleCountChange(e.target.value); + }); + this.windowsillTypeInput.addEventListener("change", (e) => { + this.handleWindowsillTypeChange(e.target.value); + }); + this.windowsillStrengthInput.addEventListener("change", (e) => { + this.handleWindowsillStrengthChange(e.target.value); + }); + this.init(); + } + + init() { + this.handleCountChange(this.lengthInput.value); + this.handleWindowsillStrengthChange(this.windowsillStrengthInput.value); + this.handleWindowsillTypeChange(this.windowsillTypeInput.value); + this.updateOutput(); + } + + updateOutput() { + this.countOutput.innerHTML = this.count; + console.log(this.windowsillStrength, this.windowsillType); + if (this.windowsillType === "custom") { + this.windowsillTypeOutput.innerHTML = `Sondergröße: ${ + (this.windowsillStrength !== "" && + this.windowsillStrength + "er Lehre") || + "" + }`; + } else { + this.windowsillTypeOutput.innerHTML = `${this.windowsillType}er Lehre`; + } + } + + handleCountChange(value) { + this.count = this.calculateCount(value); + this.updateOutput(); + } + + handleWindowsillTypeChange(value) { + if (value === "custom") { + this.windowsillStrengthInputContainer.style.display = "flex"; + } else { + this.windowsillStrengthInputContainer.style.display = "none"; + } + this.windowsillType = value; + this.updateOutput(); + } + + handleWindowsillStrengthChange(value) { + this.windowsillStrength = value; + this.updateOutput(); + } + + calculateCount(length) { + let count = length * 3; + count = Math.ceil(count / 10) * 10; + + return count; + } +} + +new CountCalculator();