-
Notifications
You must be signed in to change notification settings - Fork 1
/
app.js
67 lines (59 loc) · 1.96 KB
/
app.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
document.addEventListener("DOMContentLoaded", () => {
const seats = document.querySelectorAll(".seat");
const numSeatsElement = document.getElementById("numSeats");
const totalAmountElement = document.getElementById("totalAmount");
const resetButton = document.getElementById("resetButton");
// Price map for each deck
const deckPrices = {
lower: 120,
upper: 90,
};
let selectedSeats = [];
seats.forEach((seat) => {
seat.addEventListener("click", () => {
seat.classList.toggle("selected");
const deck = seat.closest(".deck").classList.contains("lower")
? "lower"
: "upper";
const seatNumber = seat.textContent;
if (seat.classList.contains("selected")) {
selectedSeats.push({ deck, seatNumber });
} else {
selectedSeats = selectedSeats.filter(
(item) => item.seatNumber !== seatNumber || item.deck !== deck
);
}
updateTotalPrice();
});
});
resetButton.addEventListener("click", () => {
seats.forEach((seat) => seat.classList.remove("selected"));
selectedSeats = [];
updateTotalPrice();
});
function updateTotalPrice() {
const totalPrice = selectedSeats.reduce(
(total, seat) => total + deckPrices[seat.deck],
0
);
const numSeats = selectedSeats.length;
numSeatsElement.textContent = numSeats;
totalAmountElement.textContent = totalPrice;
}
seats.forEach((seat) => {
const deck = seat.closest(".deck").classList.contains("lower")
? "lower"
: "upper";
const price = deck === "lower" ? "₹120" : "₹90";
seat.setAttribute("data-bs-toggle", "tooltip");
seat.setAttribute("data-bs-placement", "top");
seat.setAttribute("title", price);
});
// Initialize Bootstrap tooltips
const tooltipTriggerList = [].slice.call(
document.querySelectorAll('[data-bs-toggle="tooltip"]')
);
tooltipTriggerList.map(
(tooltipTriggerEl) => new bootstrap.Tooltip(tooltipTriggerEl)
);
});