Tell us what’s happening:
I’m stuck on this project since the beginning of this year, I’ve made a lot of changes here so far but the code doesn’t pass of the last two test, 18 and 19.
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">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap" rel="stylesheet">
<title>Cash Register</title>
</head>
<body>
<h1>Cash Register</h1>
<div id="cash-register">
<label for="cash">Enter cash</label>
<input id="cash" type="number" class="user-input" value="">
<p id="price"></p>
<p id="change"></p>
<div id="change-due"></div>
</div>
<button id="purchase-btn">Purchase</button>
<div class="container">
<div class="top-display">
<p id="price-screen" class="price-screen"></p>
</div>
<div id="cash-drawer-display" class="cash-drawer-display">
<h2>Cash Drawer Display</h2>
</div>
</div>
<script src="./script.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 cash = document.getElementById("cash");
const changeDue = document.getElementById("change-due");
const purchaseBtn = document.getElementById("purchase-btn");
const priceScreen = document.getElementById("price-screen");
const cashDrawerDisplay = document.getElementById("cash-drawer-display");
const checkRegister = () => {
let cashInput = parseFloat(cash.value);
if (isNaN(cashInput)) {
alert("Please enter a valid amount");
return;
}
let change = Number((cashInput - price).toFixed(2));
let totalCid = Number(cid.reduce((total, sum) => total + sum[1], 0).toFixed(2));
document.getElementById("change").innerHTML = `<b>Change: </b> ${change}`;
if (cashInput < price) {
alert("Customer does not have enough money to purchase the item");
return;
} else if (cashInput === price) {
changeDue.innerHTML = "No change due - customer paid with exact cash";
return;
} else if (cash.value === "") {
return;
}
if (change > totalCid) {
changeDue.innerHTML = "Status: INSUFFICIENT_FUNDS";
return;
}
const denominations = [
{ name: "ONE HUNDRED", value: 100.00 },
{ name: "TWENTY", value: 20.00 },
{ name: "TEN", value: 10.00 },
{ name: "FIVE", value: 5.00 },
{ name: "ONE", value: 1.00 },
{ name: "QUARTER", value: 0.25 },
{ name: "DIME", value: 0.10 },
{ name: "NICKEL", value: 0.05 },
{ name: "PENNY", value: 0.01 }
];
let changeArr = [];
let cidCopy = JSON.parse(JSON.stringify(cid)); // Deep copy of cid
for (let denom of denominations) {
let value = 0;
while (change >= denom.value && cidCopy.find(el => el[0] === denom.name)[1] >= denom.value) {
change -= denom.value;
change = Number(change.toFixed(2));
value += denom.value;
cidCopy.find(el => el[0] === denom.name)[1] -= denom.value;
}
if (value > 0) {
changeArr.push([denom.name, value]);
}
}
if (change > 0) {
changeDue.innerHTML = "Status: INSUFFICIENT_FUNDS";
return;
}
if (price < cashInput && totalCid === cashInput - price && purchaseBtn) {
changeDue.innerHTML = "Status: CLOSED " + changeArr.map(cash => `${cash[0]}: $${cash[1].toFixed(2)}`).join(" ");
cid = cid.map(denom => [denom[0], 0]);
} else {
changeDue.innerHTML = "Status: <b>OPEN</b> <br><br>" + changeArr.map(cash => `<b>${cash[0]}</b>: $${cash[1].toFixed(2)} <br>`).join(" ");
cid = JSON.parse(JSON.stringify(cidCopy));
}
displayCashInDrawer();
};
const displayCashInDrawer = () => {
cashDrawerDisplay.innerHTML = cid.map(item => `<p>${item[0]}: $${item[1].toFixed(2)}</p>`).join('');
};
window.onload = displayCashInDrawer;
purchaseBtn.addEventListener("click", checkRegister);
cash.addEventListener("keydown", e => {
if (e.key === "Enter") {
checkRegister();
}
});
/* file: styles.css */
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/130.0.0.0 Safari/537.36
Challenge Information:
Build a Cash Register Project - Build a Cash Register