https://alamigardenhotel.com.my/js/front-end/occupancy-dropdown.js

1let counts = {adults: 0, children: 0 };
2
3function updateCount(type, change) {
4    if (counts[type] + change >= 0) {
5        counts[type] += change;
6        document.getElementById(`${type}-count`).innerText = counts[type];
7        updateInputValue();
8    }
9}
10
11function updateInputValue() {
12    document.getElementById("num_of_adults").value = 
13        `${counts.adults} Adults, ${counts.children} Children`;
14}
15
16function toggleOccupancyDropdown() {
17    document.getElementById("occupancy-dropdown").classList.toggle("display-none");
18}
19
20document.addEventListener("click", function (event) {
21    let dropdown = document.getElementById("occupancy-dropdown");
22    let inputField = document.getElementById("num_of_adults");
23
24    // Check if the clicked element is NOT inside the dropdown or input field
25    if (!dropdown.contains(event.target) && event.target !== inputField) {
26        dropdown.classList.add("display-none"); // Hide the dropdown
27    }
28});
29
30document.addEventListener("DOMContentLoaded", function () {
31    let inputField = document.getElementById("num_of_adults");
32    let regex = /(\d+)\s*(Adults|Children)/g;
33    let matches = [...inputField.value.matchAll(regex)]; // Get all matches
34
35    let numOfAdultsCount = 0;
36    let numOfChildrenCount = 0;
37
38    matches.forEach(match => {
39        let count = parseInt(match[1], 10); // Extract the number
40        if (match[2] === "Adults") {
41            numOfAdultsCount = count;
42            counts['adults'] = count;
43        } else if (match[2] === "Children") {
44            numOfChildrenCount = count;
45            counts['children'] = count;
46        }
47    });
48
49    if (document.getElementById("adults-count")) {
50        document.getElementById("adults-count").innerText = numOfAdultsCount ?? 1;
51    }
52
53    if (document.getElementById("children-count")) {
54        document.getElementById("children-count").innerText = numOfChildrenCount ?? 0;
55    }
56});