Build a Cash Register Project - Build a Cash Register

JavaScript
1

Tell us what’s happening:

I am or rather have built the cash register and now I am failing test #18 and #19. Here is the github (GitHub - NerajnoLearning/Coinz: JavaScript Foundamentals - Cash Register - FCC) and the demo (Cash Register). I would appreciate any help or pointers.

Your code so far

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Cash Register</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <div class="container">
        <h1>Cash Register</h1>
        <div class="input-group">
            <label for="cash">Cash:</label>
            <input type="number" id="cash" step="0.01" min="0">
        </div>
        <button id="purchase-btn">Purchase</button>
        <div id="change-due"></div>
    </div>
    <script src="script.js"></script>
<!--     <script src="https://cdn.freecodecamp.org/testable-projects-fcc/v2/bundle.js"></script> -->
</body>
</html>

/* file: script.js */
let price = 19.5;
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 checkCashRegister = (price, cash, cid) => {
  const UNIT_AMOUNT = {
    "PENNY": 0.01,
    "NICKEL": 0.05,
    "DIME": 0.1,
    "QUARTER": 0.25,
    "ONE": 1,
    "FIVE": 5,
    "TEN": 10,
    "TWENTY": 20,
    "ONE HUNDRED": 100
  };

  let totalCID = cid.reduce((sum, [, amount]) => sum + amount, 0);
  totalCID = Number(totalCID.toFixed(2));
  let changeToGive = Number((cash - price).toFixed(2));
  const changeArray = [];

  if (changeToGive > totalCID) {
    return { status: "INSUFFICIENT_FUNDS", change: [] };
  }

  if (changeToGive === totalCID) {
    return { status: "CLOSED", change: cid };
  }

  const cidReversed = [...cid].reverse();

  for (let [unit, amount] of cidReversed) {
    const unitValue = UNIT_AMOUNT[unit];
    let unitTotal = 0;

    while (changeToGive >= unitValue && amount > 0) {
      changeToGive = Number((changeToGive - unitValue).toFixed(2));
      amount = Number((amount - unitValue).toFixed(2));
      unitTotal = Number((unitTotal + unitValue).toFixed(2));
    }

    if (unitTotal > 0) {
      changeArray.push([unit, unitTotal]);
    }
  }

  if (changeToGive > 0) {
    return { status: "INSUFFICIENT_FUNDS", change: [] };
  }

  return { status: "OPEN", change: changeArray };
};

// Function to format the change output
const formatChange = (change) => {
  return change.map(([unit, amount]) => `${unit}: $${amount.toFixed(2)}`).join(' ');
};

// Event listener for the purchase button
document.getElementById('purchase-btn').addEventListener('click', () => {
  const cashInput = document.getElementById('cash');
  const changeDue = document.getElementById('change-due');
  const cash = parseFloat(cashInput.value);

  if (isNaN(cash) || cash < price) {
    alert("Customer does not have enough money to purchase the item");
    return;
  }

  if (cash === price) {
    changeDue.textContent = "No change due - customer paid with exact cash";
    return;
  }

  const result = checkCashRegister(price, cash, JSON.parse(JSON.stringify(cid)));

  if (result.status === "INSUFFICIENT_FUNDS") {
    changeDue.textContent = "Status: INSUFFICIENT_FUNDS";
  } else if (result.status === "CLOSED") {
    changeDue.textContent = `Status: CLOSED ${formatChange(result.change)}`;
  } else {
    changeDue.textContent = `Status: ${result.status} ${formatChange(result.change)}`;
  }
});

/* file: styles.css */
body {
    font-family: Arial, sans-serif;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    margin: 0;
    background-color: #f0f0f0;
}

.container {
    background-color: white;
    padding: 2rem;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

h1 {
    text-align: center;
    color: #333;
}

.input-group {
    margin-bottom: 1rem;
}

label {
    display: block;
    margin-bottom: 0.5rem;
}

input {
    width: 100%;
    padding: 0.5rem;
    border: 1px solid #ccc;
    border-radius: 4px;
}

button {
    display: block;
    width: 100%;
    padding: 0.75rem;
    background-color: #007bff;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 1rem;
}

button:hover {
    background-color: #0056b3;
}

#change-due {
    margin-top: 1rem;
    padding: 1rem;
    background-color: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 4px;
}

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) 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

Take a look at the expected result. Test 18 expects:

Status: CLOSED PENNY: $0.5

While result from the code is:

Status: CLOSED PENNY: $0.50 NICKEL: $0.00 DIME: $0.00 QUARTER: $0.00 ONE: $0.00 FIVE: $0.00 TEN: $0.00 TWENTY: $0.00 ONE HUNDRED: $0.00

1 Like