In this javascript for leaflet.js is there a way of tracking how many houses have been bought (the polygons colored green) - 'let money = 100000;
let numberOfBuildings = 0;
let mapClickEnabled = true;
let dailybonus = 0;
let polygonClicked = false; // Flag to track if a polygon was clicked
let isExpanded = false; // Flag to track expansion state of moneyDisplay

const moneyElement = document.getElementById("moneydisplay");
moneyElement.textContent = `£${money}`;

const map = L.map("map").setView([51.5352028, 0.0054299], 17);

// fetch house data

// Event listener for when the map is clicked
map.on("click", function (e) {
 if (mapClickEnabled && !polygonClicked) {
 if (!polygonClicked) {
  // Update building radius and city coordinates
  let buildingRadius = 300;
  let firstCityCoords = [e.latlng.lat, e.latlng.lng];

  if (money >= 100000) {
   // Code to execute when money is 100,000 or more (original code goes here)
   money -= 50000;

   const overpassQuery = `
[out:json];
way["building"="house"](around:${buildingRadius},${firstCityCoords[0]},${firstCityCoords[1]});
out body;
>;
out skel qt;
`;

   fetch("https://overpass-api.de/api/interpreter", {
    method: "POST",
    headers: {
     "Content-Type": "application/x-www-form-urlencoded",
    },
    body: "data=" + encodeURIComponent(overpassQuery),
   })
    .then((response) => response.json())
    .then((data) => {
     // Update money display after successful building placement
     const moneyElement = document.getElementById("moneydisplay");
     moneyElement.textContent = `£${money}`;

     numberOfBuildings = data.elements.length; // Get the length of the array after fetching data
     dailybonus += numberOfBuildings;
     console.log("Daily bonus total now:", dailybonus);

     // Process the data returned by the Overpass API
     data.elements.forEach((element) => {
      if (element.type === "way") {
       // Extract coordinates from the way element
       const coordinates = element.nodes.map((nodeId) => {
        const node = data.elements.find((node) => node.id === nodeId);
        return [node.lat, node.lon];
       });

       // Create a polygon for the building
       const polygon = L.polygon(coordinates, {
        color: "black", // Set building outline color
        weight: 2, // Set building outline weight
        fill: true, // Fill the building outline
        fillColor: "gray", // Set building fill color
        fillOpacity: 0.5, // Set building fill opacity
       }).addTo(map);

       polygon.on("click", function (e) {
        // Check if the building is already owned (colored green)
        if (polygon.options.fillColor === "green") {
         // Display message indicating that the building is already owned
         const messageDisplay =
          document.getElementById("messageDisplay");
         messageDisplay.textContent = `You already own this building.`;
         return; // Stop further execution
        }

        // Handle click event on the building footprint
        console.log("Building footprint clicked!");
        e.originalEvent.stopPropagation();
        polygonClicked = true; // Set flag to true when a polygon is clicked

        if (money >= 10000) {
         // Change polygon fill color to green
         polygon.setStyle({ fillColor: "green" });
         // Display message after creating polygons (uses the updated numberOfBuildings)
         const messageDisplay =
          document.getElementById("messageDisplay");
         messageDisplay.innerHTML = `Congratulations you have bought this building for £10,000. You will earn £10000 per day in rent.`;
         money -= 10000;
         dailybonus += 10000;
         const moneyDisplay = document.getElementById("moneydisplay");
         const moneyString = `£${money}`;
         moneyDisplay.textContent = moneyString;
         console.log("Daily bonus total now:", dailybonus);
        } else {
         const messageDisplay =
          document.getElementById("messageDisplay");
         messageDisplay.innerHTML = `Sorry you need £10,000 to buy this building`;
        }
       });

       // Reset the polygonClicked flag after clicking outside a polygon
       map.on("click", function (e) {
        polygonClicked = false;
       });
      }
       
       mapClickEnabled = false; // Disable map clicks for placing buildings

     });

     // Display message after creating polygons (uses the updated numberOfBuildings)
     const messageDisplay = document.getElementById("messageDisplay");
     messageDisplay.innerHTML = `Congratulations you have leased ${numberOfBuildings} buildings for £50,000! You will earn £${numberOfBuildings} per day from these leases. <p> You can now click on individual buildings on the map to buy them and start earning rent as well.</p>`;
    })
    .catch((error) => {
     console.error("Error fetching data:", error);
    });
  } else {
   // Code to execute when money is less than 100,000 (optional)
   console.log("You don't have enough money to build!");
   // Display message after creating polygons (uses the updated numberOfBuildings)
   const messageDisplay = document.getElementById("messageDisplay");
   messageDisplay.textContent = `Sorry you don't have enough money. You need at least £100,000 to buy land.`;
  }
 }
 }
});

//24 hour clock display

const TIME_MULTIPLIER = 60 * 10; // 10 minutes = 600 seconds

// Function to format time in 24-hour format with leading zeros
function formatTime(hours, minutes) {
 // Handle the case where minutes reach 60 (should display the next hour)
 if (minutes === 60) {
  hours++;
  minutes = 0;
 }
 return `${hours.toString().padStart(2, "0")}:${minutes
  .toString()
  .padStart(2, "0")}`;
}

// Function to update the clock display and handle daily bonus
function updateClock() {
 const currentTime = new Date();

 // Simulate game time by multiplying actual time with multiplier
 const gameTime = new Date(currentTime.getTime() * TIME_MULTIPLIER);

 // Get hours and minutes in 24-hour format
 let hours = gameTime.getHours();
 // Get minutes and force them to the nearest multiple of 10 (ending in 0)
 let minutes = Math.floor(gameTime.getMinutes() / 10) * 10;
 // Format the time string with fixed minute handling
 const formattedTime = formatTime(hours, minutes);

 // Update the content of the div with the formatted time
 document.getElementById("timedisplay").textContent = formattedTime;

 // Check if it's midnight (00:00)
 if (hours === 0 && minutes === 0) {
  // add dailybonus
  money += dailybonus;
  const moneyDisplay = document.getElementById("moneydisplay");
  const moneyString = `£${money}`;
  moneyDisplay.textContent = moneyString;
 }
}

// Call the updateClock function initially
updateClock();

// Update the clock every second to simulate smooth time progression
setInterval(updateClock, 1000);

// expand moneyDisplay
const moneyDisplay = document.getElementById("moneydisplay");


moneyDisplay.addEventListener("click", function() {
 isExpanded = !isExpanded; // Toggle expansion state on each click

 if (isExpanded) {
  // Styles for expanded state (e.g., larger font size, increased width)
  moneyDisplay.style.height = "50%"; // Example: Increase font size
  moneyDisplay.innerHTML += "<br><br>Rents and Leases Daily Income: £" + dailybonus;
 } else {
  // Styles for normal state (original styles)
  moneyDisplay.style.height = "auto"; // Reset width
  moneyDisplay.innerHTML = moneyDisplay.innerHTML.replace("<br><br>Rents and Leases Daily Income: £" + dailybonus, "");
 }
 });
'