-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.js
85 lines (77 loc) · 2.27 KB
/
index.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
const bill = document.getElementById("bill");
const numOfPeople = document.getElementById("numOfPeople");
const tipPerPerson = document.getElementById("tipPerPerson");
let preBuiltTips = document.querySelectorAll(".tip");
let customTipBox = document.getElementById("customTip");
let totalPerPerson = document.getElementById("totalPerPerson");
const resetBtn = document.getElementById("resetBtn");
const errorMsg = document.getElementById('errorMsg')
let billPerPerson;
let tip;
let customTip;
let tipAmount;
let tipPerPersonAmount;
const resetTipPercentage = () => {
preBuiltTips.forEach((button) => {
button.classList.remove("clicked");
});
customTipBox.value = "";
};
const resetTipPrice = () => {
tipPerPerson.textContent = "$0.00";
totalPerPerson.textContent = "$0.00";
};
const resetInputPrice = () => {
numOfPeople.value = "";
bill.value = "";
};
preBuiltTips.forEach(function (tipBtn) {
tipBtn.addEventListener("click", function (e) {
resetTipPercentage();
e.target.classList.add("clicked");
});
});
function calculateTip() {
customTip = customTipBox.value;
if (customTip != "") {
try {
tip = Number(customTip);
} catch (error) {
console.log(error);
}
} else if (customTip === "") {
const clickedTipBtn = document.querySelector(".clicked");
tip = Number(clickedTipBtn?.value ?? 0);
}
tipAmount = parseFloat(((tip / 100) * Number(bill.value)).toFixed(2));
tipPerPersonAmount = parseFloat((tipAmount / numOfPeople.value).toFixed(2));
tipPerPerson.textContent = "$" + tipPerPersonAmount;
}
function calculateBill() {
billPerPerson = parseFloat(
(
Number(bill.value) / Number(numOfPeople.value) +
tipPerPersonAmount
).toFixed(2)
);
totalPerPerson.textContent = "$" + billPerPerson;
}
const resetCalculator = () => {
resetTipPercentage();
resetTipPrice();
resetInputPrice();
};
resetBtn.addEventListener("click", resetCalculator);
window.addEventListener("keydown", function (e) {
if (e.key === "Enter") {
if (numOfPeople.value) {
numOfPeople.classList.remove("zero-people-error");
errorMsg.style.visibility = 'hidden'
calculateTip();
calculateBill();
} else {
numOfPeople.classList.add("zero-people-error");
errorMsg.style.visibility = 'visible'
}
}
});