2022-08-02 12:13:30 +02:00

85 lines
2.4 KiB
JavaScript

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();