Tell us what’s happening:
I wrote the code and it get failed in different tests at each time
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">
<title>Cash Register App</title>
<link rel="stylesheet" href="./styles.css">
</head>
<body>
<div class="container">
<h1>Cash Register</h1>
<label for="cash">Enter Cash:</label>
<input type="number" id="cash" step="0.01">
<button id="purchase-btn">Purchase</button>
<p id="change-due"></p>
</div>
<script src="script.js"></script>
</body>
</html>
/* file: styles.css */
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
background-color: #0f0c29;
background-image: linear-gradient(315deg, #0f0c29 0%, #302b63 50%, #24243e 100%);
color: #f1f1f1;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
margin: 0;
}
.container {
background-color: rgba(255, 255, 255, 0.05);
padding: 2rem;
border-radius: 15px;
box-shadow: 0 0 25px rgba(0,0,0,0.5);
max-width: 400px;
width: 90%;
text-align: center;
backdrop-filter: blur(8px);
}
h1 {
margin-bottom: 1rem;
color: #ffffff;
font-weight: 600;
}
label {
color: #d1d1d1;
font-size: 0.9rem;
}
input, button {
padding: 0.6rem;
margin: 0.5rem 0;
width: 100%;
border: 1px solid #3e3e3e;
border-radius: 6px;
font-size: 1rem;
background-color: #1c1c2b;
color: #f1f1f1;
transition: all 0.3s;
}
input:focus, button:focus {
outline: none;
border-color: #9f7aea;
}
#purchase-btn {
background-color: #9f7aea;
color: white;
font-weight: bold;
cursor: pointer;
transition: background 0.3s;
}
#purchase-btn:hover {
background-color: #805ad5;
}
#change-due {
margin-top: 1rem;
font-weight: bold;
color: #e2e8f0;
}
/* file: script.js */
let price = 19.5;
let cid = [
['PENNY', 0],
['NICKEL', 0.5],
['DIME', 0],
['QUARTER', 0],
['ONE', 0],
['FIVE', 0],
['TEN', 0],
['TWENTY', 0],
['ONE HUNDRED', 0]
];
const purchase = () => {
let changeDue = document.getElementById("change-due")
let order = cid.reverse();
let change = cash.value - price;
let cidTotal = cid[0][1] + cid[1][1] + cid[2][1] + cid [3][1] + cid [4][1] + cid [5][1] + cid [6][1] + cid[7][1] + cid[8][1]
console.log("cid:" + cid);
console.log("cash:" + cash.value);
console.log("change:" + change);
console.log("order" + order);
console.log("total" + cidTotal);
if (cash.value < price) {alert("Customer does not have enough money to purchase the item")}
if (change === 0) {changeDue.innerText = "No change due - customer paid with exact cash"}
else if (cidTotal === change) {changeDue.innerText = "Status: CLOSED"}
else {changeDue.innerText = "Status: OPEN "};
if (change > 100 && order[0][1] > 0){
let coinsAvailable = order[0][1] / 100;
console.log("Remaining change: " + change);
console.log("Coins available: " + coinsAvailable);
let coins = Math.floor(change / 100);
if (coins <= coinsAvailable) {
cid[0][1] -= coins * 100;
changeDue.innerText += ` ONE HUNDRED: $${coins * 100} `;
change -= coins * 100;
} else {
cid[0][1] -= coinsAvailable * 100;
changeDue.innerText += ` ONE HUNDRED: $${coinsAvailable * 100} `;
change -= coinsAvailable * 100;
}
};
if (change > 20 && order[1][1] > 0){
let coinsAvailable = order[1][1] / 20;
console.log("Remaining change: " + change);
console.log("Coins available: " + coinsAvailable);
let coins = Math.floor(change / 20);
if (coins <= coinsAvailable) {
cid[1][1] -= coins * 20;
changeDue.innerText += ` TWENTY: $${coins * 20} `;
change -= coins * 20;
change = change.toFixed(2);
console.log(change);
} else {
cid[1][1] -= coinsAvailable * 20;
changeDue.innerText += ` TWENTY: $${coinsAvailable * 20} `;
change -= coinsAvailable * 20;
change = change.toFixed(2);
console.log(change);
}
};
if (change > 10 && order[2][1] > 0){
let coinsAvailable = order[2][1] / 10;
console.log("Remaining change: " + change);
console.log("Coins available: " + coinsAvailable);
let coins = Math.floor(change / 10);
if (coins <= coinsAvailable) {
cid[2][1] -= coins * 10;
changeDue.innerText += ` TEN: $${coins * 10} `;
change -= coins * 10;
change = change.toFixed(2);
} else {
cid[2][1] -= coinsAvailable * 10;
changeDue.innerText += ` TEN: $${coinsAvailable * 10} `;
change -= coinsAvailable * 10;
change = change.toFixed(2);
}
};
if (change > 5 && order[3][1] > 0){
let coinsAvailable = order[3][1] / 5;
console.log("Remaining change: " + change);
console.log("Coins available: " + coinsAvailable);
let coins = Math.floor(change / 5);
if (coins <= coinsAvailable) {
cid[3][1] -= coins * 5;
changeDue.innerText += ` FIVE: $${coins * 5} `;
change -= coins * 5;
change = change.toFixed(2);
} else {
cid[3][1] -= coinsAvailable * 5;
changeDue.innerText += ` FIVE: $${coinsAvailable * 5} `;
change -= coinsAvailable * 5;
change = change.toFixed(2);
}
};
if (change > 1 && order[4][1] > 0){
let coinsAvailable = order[4][1] / 1;
console.log("Remaining change: " + change);
console.log("Coins available: " + coinsAvailable);
let coins = Math.floor(change / 1);
if (coins <= coinsAvailable) {
cid[4][1] -= coins * 1;
changeDue.innerText += ` ONE: $${coins * 1} `;
change -= coins * 1;
change = change.toFixed(2);
} else {
cid[4][1] -= coinsAvailable * 1;
changeDue.innerText += ` ONE: $${coinsAvailable * 1} `;
change -= coinsAvailable * 1;
change = change.toFixed(2);
}
};
if (change > 0.25 && order[5][1] > 0){
let coinsAvailable = order[5][1] / 0.25;
console.log("Remaining change: " + change);
console.log("Coins available: " + coinsAvailable);
let coins = Math.floor(change / 0.25);
if (coins <= coinsAvailable) {
cid[5][1] -= coins * 0.25;
changeDue.innerText += ` QUARTER: $${coins * 0.25} `;
change -= coins * 0.25;
change = change.toFixed(2);
} else {
cid[5][1] -= coinsAvailable * 0.25;
changeDue.innerText += ` QUARTER: $${coinsAvailable * 0.25} `;
change -= coinsAvailable * 0.25;
change = change.toFixed(2);
}
};
if (change > 0.1 && order[6][1] > 0){
let coinsAvailable = order[6][1] / 0.1;
console.log("Remaining change: " + change);
console.log("Coins available: " + coinsAvailable);
let coins = Math.floor(change / 0.1);
if (coins <= coinsAvailable) {
cid[6][1] -= coins * 0.1;
changeDue.innerText += ` DIME: $${coins * 0.1} `;
change -= coins * 0.1;
change = change.toFixed(2);
} else {
cid[6][1] -= coinsAvailable * 0.1;
changeDue.innerText += ` DIME: $${coinsAvailable * 0.1} `;
change -= coinsAvailable * 0.1;
change = change.toFixed(2);
}
};
if (change > 0.05 && order[7][1] > 0){
let coinsAvailable = order[7][1] / 0.05;
console.log("Remaining change: " + change);
console.log("Coins available: " + coinsAvailable);
let coins = Math.floor(change / 0.05);
if (coins <= coinsAvailable) {
cid[7][1] -= coins * 0.05;
changeDue.innerText += ` NICKEL: $${coins * 0.05} `;
change -= coins * 0.05;
change = change.toFixed(2);
} else {
cid[7][1] -= coinsAvailable * 0.05;
changeDue.innerText += ` NICKEL: $${coinsAvailable * 0.05} `;
change -= coinsAvailable * 0.05;
change = change.toFixed(2);
}
};
if (change > 0.01 && order[8][1] > 0){
let coinsAvailable = order[8][1] / 0.01;
console.log("Remaining change: " + change);
console.log("Coins available: " + coinsAvailable);
let coins = Math.floor(change / 0.01);
if (coins <= coinsAvailable) {
cid[8][1] -= coins * 0.01;
changeDue.innerText += ` PENNY: $${coins * 0.01} `;
change -= coins * 0.01;
change = change.toFixed(2);
} else {
cid[8][1] -= coinsAvailable * 0.01;
changeDue.innerText += ` PENNY: $${coinsAvailable * 0.01} `;
change -= coinsAvailable * 0.01;
change = change.toFixed(2);
}
};
console.log("end change:" + change);
console.log("end cid:" + cid);
if (change > 0.01 && order[8][1] <= 0.01) {changeDue.innerText = 'Status: INSUFFICIENT_FUNDS'};
}
document.getElementById("purchase-btn").addEventListener("click", purchase);
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/137.0.0.0 Safari/537.36
Challenge Information:
Build a Cash Register Project - Build a Cash Register