Build a Cash Register Project - Build a Cash Register

JavaScript
1

Tell us what’s happening:

So The App is working but i can’t seem to pass the tests from 7 onwards till the end which is 19 . Can’t seem to understand WHat is going wrong.

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">
    <link rel=stylesheet href="./styles.css">
    <title>Cash Register</title>

</head>
<body>
  <h1>Cash Register</h1>
  <label for="price">Item Price: </label>
  <input type="number" id="price" placeholder="Enter price" required>
  <br>

  <label for="cash">Cash Provided: </label>
  <input type="number" id="cash" placeholder="Enter cash" required>
  <br>

  <button id="purchase-btn">Purchase</button>
  <p id="change-due"></p>

  <script src="./script.js"></script>
</body>
</html>


/* file: script.js */
// Declare global variables for price and cid
let price = 0;
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]
];

// Set up event listener for purchase button
document.getElementById("purchase-btn").addEventListener("click", function() {
    // Get the values from input fields
    price = parseFloat(document.getElementById("price").value); // price is now updated globally
    const cash = parseFloat(document.getElementById("cash").value); // get cash value

    // Ensure the values are numbers
    if (isNaN(price) || isNaN(cash)) {
        alert("Invalid input");
        return;
    }

    const changeDue = calculateChange(cash, price, cid);
    document.getElementById("change-due").innerText = changeDue || "Error calculating change"; // Display result
});

// Function to calculate change
function calculateChange(cash, price, cid) {
    const unitValues = {
        "PENNY": 0.01,
        "NICKEL": 0.05,
        "DIME": 0.1,
        "QUARTER": 0.25,
        "ONE": 1,
        "FIVE": 5,
        "TEN": 10,
        "TWENTY": 20,
        "ONE HUNDRED": 100
    };

    let changeDue = cash - price;
    let change = [];

    // Case 1: If cash is less than price
    if (cash < price) {
        alert("Customer does not have enough money to purchase the item");
        return "Customer does not have enough money to purchase the item";
    }

    // Case 2: If cash equals price
    if (cash === price) {
        return "No change due - customer paid with exact cash";
    }

    // Sort cash-in-drawer in descending order
    cid.sort((a, b) => b[1] - a[1]);

    // Loop through denominations and calculate change
    for (let i = 0; i < cid.length && changeDue > 0; i++) {
        const denomination = cid[i][0];
        const amount = cid[i][1];

        const unitsNeeded = Math.floor(changeDue / unitValues[denomination]);
        const availableUnits = Math.min(unitsNeeded, Math.floor(amount / unitValues[denomination]));

        if (availableUnits > 0) {
            change.push([denomination, availableUnits * unitValues[denomination]]);
            changeDue -= availableUnits * unitValues[denomination];
            // Round changeDue to avoid floating point precision issues
            changeDue = Math.round(changeDue * 100) / 100;
        }
    }

    // Case 3: If we can't return exact change
    if (changeDue > 0) {
        return "Status: INSUFFICIENT_FUNDS";
    }

    // Case 4: If the drawer has enough to cover change, and we returned change
    if (change.length > 0) {
        let changeString = "Status: OPEN ";
        change.forEach(item => {
            changeString += `${item[0]}: $${item[1].toFixed(2)} `;
        });
        
        // Ensure a string is returned and call trim safely
        return changeString.trim();
    }

    // Case 5: If change due is exactly equal to what we have in the drawer
    return "Status: CLOSED";
}


/* file: styles.css */
body {
  font-family: Arial, sans-serif;
  text-align: center;
  margin: 50px;
}

#container {
  max-width: 400px;
  margin: 0 auto;
}

input {
  padding: 5px;
  margin: 10px;
}

button {
  padding: 10px 20px;
  margin: 10px;
  cursor: pointer;
}

#change-due {
  margin-top: 20px;
  font-weight: bold;
}

Your browser information:

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

Challenge Information:

Build a Cash Register Project - Build a Cash Register

2

Hi there!

You should not have any other variables in global scope, except the above price and cid.

1 Like