Build a Cash Register Project - Build a Cash Register

Tell us what’s happening:

My code is failing every step after step 13. It works initially, but for some reason doesn’t give Status: INSUFFICIENT_FUNDS or Status: CLOSED correctly after running out of money in the drawer when the button is pushed repeatedly. I’m stuck on what to do to make it handle that properly. (Sorry for the multiple different help posts aha, this project is really stumping me. Also sorry for the excessive console logs, I’m really trying to watch every step of the process to catch what’s going wrong but I’m not really getting it.)

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang ="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Cash Register Project</title>
    <link rel="stylesheet" href="styles.css">
  </head>
  <body>
    <h1>Cash Register</h1>
    <input id="cash" type="number">
    <button id="purchase-btn">Purchase</button>
    <p id="change-due"></p>
  </body>
  <script src="script.js"></script>
</html>
/* file: script.js */
let price = 1.87;
let cid = [
  ['PENNY', 1.01],
  ['NICKEL', 2.05],
  ['DIME', 3.1],
  ['QUARTER', 4.25],
  ['ONE', 90],
  ['FIVE', 55],
  ['TEN', 20],
  ['TWENTY', 60],
  ['ONE HUNDRED', 100]
];
const cash = document.getElementById("cash");
const changeDue = document.getElementById("change-due");
const purchaseBtn = document.getElementById("purchase-btn");

const cashValue = (arr) => {
  let total = 0;
  for (let i = 0; i < arr.length; i++) {
    total += arr[i][1];
  }
  return total.toFixed(2);
}
const cashDrawer = cashValue(cid);
console.log(cashDrawer);

purchaseBtn.addEventListener("click", purchase);

function changeCalculator(change) {
    let hundredCounter = 0;
    let twentyCounter = 0;
    let tenCounter = 0;
    let fiveCounter = 0;
    let oneCounter = 0;
    let quarterCounter = 0;
    let dimeCounter = 0;
    let nickelCounter = 0;
    let pennyCounter = 0;

    let hundredGiven = false;
    let twentyGiven = false;
    let tenGiven = false;
    let fiveGiven = false;
    let oneGiven = false;
    let quarterGiven = false;
    let dimeGiven = false;
    let nickelGiven = false;
    let pennyGiven = false;
  if (change > cashDrawer) {
    changeDue.textContent = "Status: INSUFFICIENT_FUNDS";
  } else {
    changeDue.innerHTML = change === cashDrawer ? "Status: CLOSED <br>" : "Status: OPEN <br>";
    console.log(change);
    while (change >= 100 && cid[8][1] > 0) {
      change = (change - 100).toFixed(2);
      cid[8][1] = (cid[8][1] - 100).toFixed(2);
      hundredGiven = true;
      hundredCounter++;
    } 
    console.log(change);
    while (change >= 20 && cid[7][1] > 0) {
      change = (change - 20).toFixed(2);
      cid[7][1] = (cid[7][1] - 20).toFixed(2);
      twentyGiven = true;
      twentyCounter++;
    }
    console.log(change);
    while (change >= 10 && cid[6][1] > 0) {
      change = (change - 10).toFixed(2);
      cid[6][1] = (cid[6][1] - 10).toFixed(2);
      tenGiven = true;
      tenCounter++;
    } 
    console.log(change);
    while (change >= 5 && cid[5][1] > 0) {
      change = (change - 5).toFixed(2);
      cid[5][1] = (cid[5][1] - 5).toFixed(2);
      fiveGiven = true;
      fiveCounter++;
    }
    console.log(change);
    while (change >= 1 && cid[4][1] > 0) {
      change = (change - 1).toFixed(2);
      cid[4][1] = (cid[4][1] - 1).toFixed(2);
      oneGiven = true;
      oneCounter++;
    }
    console.log(change);
    while (change >= 0.25 && cid[3][1] > 0) {
      change = (change - 0.25).toFixed(2);
      cid[3][1] = (cid[3][1] - 0.25).toFixed(2);
      quarterGiven = true;
      quarterCounter++;
    }
    console.log(change);
    while (change >= 0.1 && cid[2][1] > 0) {
      change = (change - 0.1).toFixed(2);
      cid[2][1] = (cid[2][1] - 0.1).toFixed(2);
      dimeGiven = true;
      dimeCounter++;
    }
    console.log(change);
    while (change >= 0.05 && cid[1][1] > 0) {
      change = (change - 0.05).toFixed(2);
      cid[1][1] = (cid[1][1] - 0.05).toFixed(2);
      nickelGiven = true;
      nickelCounter++;
    }
    console.log(change);
    while (change >= 0.01 && cid[0][1] > 0) {
      change = (change - 0.01).toFixed(2);
      cid[0][1] = (cid[0][1] - 0.01).toFixed(2);
      pennyGiven = true; 
      pennyCounter++;
    }
    console.log(change);
  }
  const cashWriter = () => {
    changeDue.innerHTML += hundredGiven ? `ONE HUNDRED: $${hundredCounter * 100} <br>` : "";
  changeDue.innerHTML += twentyGiven ? `TWENTY: $${twentyCounter * 20} <br>` : "";
  changeDue.innerHTML += tenGiven ? `TEN: $${tenCounter * 10} <br>` : "";
  changeDue.innerHTML += fiveGiven ? `FIVE: $${fiveCounter * 5} <br>` : "";
  changeDue.innerHTML += oneGiven ? `ONE: $${oneCounter} <br>` : "";
  changeDue.innerHTML += quarterGiven ? `QUARTER: $${(quarterCounter * 0.25).toFixed(2)} <br>` : "";
  changeDue.innerHTML += dimeGiven ? `DIME: $${(dimeCounter * 0.1).toFixed(2)} <br>` : "";
  changeDue.innerHTML += nickelGiven ? `NICKEL: $${(nickelCounter * 0.05).toFixed(2)} <br>` : "";
  changeDue.innerHTML += pennyGiven ? `PENNY: $${(pennyCounter * 0.01).toFixed(2)}` : "";
  }
  cashWriter();
}

function purchase() {
  const floatCash = parseFloat(cash.value);
  changeDue.textContent = "";
  if (floatCash < price) {
    alert("Customer does not have enough money to purchase the item");
  } else if (floatCash === price) {
    changeDue.textContent = "No change due - customer paid with exact cash";
  } else {
    let change = (floatCash - price);
    console.log(change);
    changeCalculator(change);
  }
}

### Your browser information:

User Agent is: <code>Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/131.0.0.0 Safari/537.36</code>

### Challenge Information:
Build a Cash Register Project - Build a Cash Register
https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures-v8/build-a-cash-register-project/build-a-cash-register

Global variables like this break the reusability of your code.

Ah, thank you! I had an issue with global variables before and for some reason it didn’t occur to me that that one would also be an issue.