Tell us what’s happening:
I’m having trouble showing the status. I need help, I’m stuck. Everything is passing except for 18 and 19.
-
- When
priceis19.5, the value in the#cashelement is20,cidis[["PENNY", 0.5], ["NICKEL", 0], ["DIME", 0], ["QUARTER", 0], ["ONE", 0], ["FIVE", 0], ["TEN", 0], ["TWENTY", 0], ["ONE HUNDRED", 0]], and the#purchase-btnelement is clicked, the value in the#change-dueelement should be"Status: CLOSED PENNY: $0.5".
- When
-
Failed:19. When
priceis less than the value in the#cashelement, total cash in drawercidis equal to change due, and the#purchase-btnelement is clicked, the value in the#change-dueelement should be"Status: CLOSED"with change due in coins and bills sorted in highest to lowest order.
Your code so far
<!-- file: index.html -->
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content=" a Cash Register">
<link rel="stylesheet" href="styles.css">
<title> a Cash Register App</title>
</head>
<body>
<div class="header">
<h1 class="title">Cash Register Project</h1>
</div>
<div class="container" id="container">
<div id="change-due"></div>
<label for="cash">Enter cash from customer:</label>
<input type="number" min="0" id="cash" class="cash">
<button id="purchase-btn">Purchase</button>
</div>
<script src="./script.js"></script>
</body>
</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 cashInput = document.getElementById('cash');
const purchaseBtn = document.getElementById('purchase-btn');
const changeDueElement = document.getElementById('change-due');
// cash register function
const cashRegiseter = () => {
const cash = Number(cashInput.value);
if(isNaN(cash) || cash < price) {
alert('Customer does not have enough money to purchase the item');
cashInput.value = '';
return;
}
//calculate Change due in cents
let changeDue = Math.round((cash - price) * 100);
if(changeDue === 0) {
changeDueElement.innerHTML =
'<p>No change due - customer paid with exact cash</p>';
cashInput.value = '';
return;
}
//total cid
const totalCid = cid.reduce((acc, [_, amount]) => acc + amount, 0);
// calculate return change
const reversedCid = [...cid].reverse().map(([name, amount]) => [name, Math.round(amount * 100)]);
const denominations = [10000, 2000, 1000, 500, 100, 25, 10, 5, 1];
const result = { status: 'OPEN', change: [] };
for(let i = 0; i < reversedCid.length; i++) {
if(changeDue >= denominations[i] && changeDue > 0){
const [name, total] = reversedCid[i];
const possibleChange = Math.min(total, changeDue);
const count = Math.floor(possibleChange / denominations[i]);
const amountInChange = count * denominations[i];
changeDue -= amountInChange;
if(count > 0){
result.change.push([name, amountInChange / 100]);
}
}
}
if (changeDue > 0) {
changeDueElement.innerHTML = '<p>Status: INSUFFICIENT_FUNDS</p>';
return;
}
if (totalCid === changeDue) {
result.status = 'CLOSED';
}
changeDueElement.innerHTML = `<p>Status: ${result.status}</p>`;
changeDueElement.innerHTML += result.change
.map(
([denominationName, amount]) => `<p>${denominationName}: $${amount}</p>`
)
.join(' ');
cashInput.value = '';
};
price = 19.5;
cid = [["PENNY", 0.5], ["NICKEL", 0], ["DIME", 0], ["QUARTER", 0], ["ONE", 0], ["FIVE", 0], ["TEN", 0], ["TWENTY", 0], ["ONE HUNDRED", 0]];
//button event
purchaseBtn.addEventListener('click', () =>{
cashRegiseter();
});
/* file: styles.css */
body{
background-color: rgb(38, 38, 61);
color:#fff;
display:flex;
flex-direction:column;
align-items:center;
}
.title{
text-align:center;
font-weight:bold;
}
#change-due{
color:#fff;
font-size:18px;
display:flex;
flex-direction:column;
align-items:center;
width:100%;
}
p{
color:#fff;
text-align: center;
}
.container{
display: flex;
flex-direction:column;
align-items:center;
gap:12px;
}
button{
background-color:rgb(240, 240, 29);
cursor: pointer;
padding:6px 10px;
}
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/134.0.0.0 Safari/537.36
Challenge Information:
Build a Cash Register Project - Build a Cash Register