Tell us what’s happening:
Describe your issue in detail here.
Your code so far
<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Cash Register</title>
</head>
<body>
<label for="cash">Enter Cash Amount:</label>
<input type="number" id="cash">
<button id="purchase-btn">Purchase</button>
<div id="change-due"></div>
<script src="script.js"></script>
</body>
</html>
/* file: styles.css */
/* file: script.js */
const purchaseButton = document.getElementById('purchase-btn');
const cashInput = document.getElementById('cash');
const changeDueDiv = document.getElementById('change-due');
let price = 19.5;
let cid = [["PENNY", 0.5], ["NICKEL", 0], ["DIME", 0], ["QUARTER", 0], ["ONE", 0], ["FIVE", 0], ["TEN", 0], ["TWENTY", 0], ["ONE HUNDRED", 0]];
const checkCashRegister = () => {
if (Number(cashInput.value) < price) {
alert('Customer does not have enough money to purchase the item');
cashInput.value = '';
return;
}
if (Number(cashInput.value) === price) {
changeDueDiv.innerHTML = 'No change due - customer paid with exact cash';
cashInput.value = '';
return;
}
let changeDue = (Number(cashInput.value) - price).toFixed(2);
let change = calculateChange(changeDue, cid);
if (change.status === "INSUFFICIENT_FUNDS") {
changeDueDiv.innerHTML = 'Status: INSUFFICIENT_FUNDS';
} else {
changeDueDiv.innerHTML = `Status: ${change.status} ${change.change.map(c => `${c[0]}: $${c[1].toFixed(2)}`).join(' ')}`;
}
cashInput.value = '';
}
purchaseButton.addEventListener('click', checkCashRegister);
const calculateChange = (changeDue, cid) => {
const currencyUnit = {
"ONE HUNDRED": 100,
"TWENTY": 20,
"TEN": 10,
"FIVE": 5,
"ONE": 1,
"QUARTER": 0.25,
"DIME": 0.1,
"NICKEL": 0.05,
"PENNY": 0.01
};
let totalCID = cid.reduce((sum, elem) => sum + elem[1], 0);
totalCID = parseFloat(totalCID.toFixed(2));
if (totalCID < changeDue) {
return { status: "INSUFFICIENT_FUNDS", change: [] };
}
let changeArr = [];
let reversedCid = [...cid].reverse();
for (let [denom, amount] of reversedCid) {
let value = currencyUnit[denom];
let amountOfDenom = 0;
while (changeDue >= value && amount > 0) {
amount -= value;
changeDue = (changeDue - value).toFixed(2);
amountOfDenom += value;
}
if (amountOfDenom > 0) {
changeArr.push([denom, amountOfDenom]);
}
}
if (Math.abs(changeDue) > 0.005) {
return { status: "INSUFFICIENT_FUNDS", change: [] };
}
let changeTotal = changeArr.reduce((sum, elem) => sum + elem[1], 0);
if (changeTotal < totalCID) {
return { status: "OPEN", change: changeArr };
}
// Specific format for 'CLOSED' status
return {
status: "CLOSED",
change: "CLOSED " + Object.keys(currencyUnit)
.map(denom => {
let amount = changeArr.find(elem => elem[0] === denom)?.[1] || 0;
return `${denom}: $${amount.toFixed(2)}`;
}).join(' ')
};
};
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36
Challenge Information:
Build a Cash Register Project - Build a Cash Register