Build a Cash Register Project - Build a Cash Register

JavaScript
1

Tell us what’s happening:

Hi, I have a few issues with my code. It functions properly, but it failed some of the tests.
13. When price is less than the value in the #cash element, total cash in drawer cid is greater than the change due, individual denomination amounts allow for returning change due, and the #purchase-btn element is clicked, the value in the #change-due element should be “Status: OPEN” with required change due in coins and bills sorted in highest to lowest order.
as well as question 19.

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Cash Register</title>
        <link rel="stylesheet" href="style.css">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
    <body>
        <h1>Cash Register</h1>
        <form>
            <label for="cash">Enter cash from the customer:</label>
            <input id="cash">
            <button form="submit" id="purchase-btn">Purchase</button>
        </form>
        <span id="change-due"></span>
        <div class="cash-machine">
            <div class="price-screen">
                <div class="screen">
                </div>
                <div class="conecter"></div>
            </div>
            <div class="body">
            </div>
            <div class="key-board">
                <div class="butoon">
                    <button class="btn"></button>
                    <button class="btn"></button>
                    <button class="btn"></button>
                    <button class="btn"></button>
                    <button class="btn"></button>
                    <button class="btn"></button>
                    <button class="btn"></button>
                    <button class="btn"></button>
                    <button class="btn"></button>
                </div>
            </div>
            <div class="buttom"><button></button></div>
        </div>
        <script src="script.js"></script>
    </body>
</html>

/* file: script.js */
let price = 4.56;
let cid = [
  ['PENNY', 1.01],
  ['NICKEL', 10],
  ['DIME', 110],
  ['QUARTER', 110],
  ['ONE', 10],
  ['FIVE', 50],
  ['TEN', 110],
  ['TWENTY', 80],
  ['ONE HUNDRED', 100]
];
const currencies = [
  [100, "ONE HUNDRED"],
  [20, "TWENTY"],
  [10, "TEN"],
  [5, "FIVE"],
  [1, "ONE"],
  [0.25, "QUARTER"],
  [0.1, "DIME"],
  [0.05, "NICKEL"],
  [0.01, "PENNY"]
];
const changeDue = document.getElementById("change-due");
const purchaseBtn = document.getElementById("purchase-btn");
const totalPrice = document.getElementsByClassName("screen")[0];
totalPrice.innerHTML = `<p>Price total: $${price}<p>`

const chargeInDrawer = document.getElementsByClassName("body")[0]
chargeInDrawer.innerHTML = `<p>Change in drawer:</p>`;
for (let [key, value] of cid) {
  chargeInDrawer.innerHTML += `<p>${key}: $${value}</p>`
}


const changer = (cash) => {
  let cidCopy = cid.map(arr => [...arr]);

  if (cash < price) {
    alert("Customer does not have enough money to purchase the item");
    return;
  }
  if (cash === price) {
    changeDue.innerHTML = "No change due - customer paid with exact cash"
    return;
  }

  let cashValue = cash - price;
  let change = {};

  for (let [key, value] of currencies) {
    key = Number(key);
    while (key <= cashValue && cidCopy.find(item => item[0] === value)[1] > 0 && cashValue > 0) {
      cashValue -= key;
      cashValue = Math.round(cashValue * 100) / 100;
      cidCopy.find(item => item[0] === value)[1] -= key;
      change[value] = (change[value] ?? 0) + key;
    }
  }

  if (statusCash(cidCopy, cashValue)) {
    Object.entries(change).forEach(([key, value]) => {
      changeDue.innerHTML += `<p>${key}: $${value}</p>`
    })
  };
}

function statusCash(cid, cashValue) {
  if (cashValue > 0) {
    changeDue.innerHTML = "<p>Status: INSUFFICIENT_FUNDS</p>";
    return false;
  }
  let isDrawNotEmpty = false
  for (let item of cid) {
    if (item[1] > 0) {
      isDrawNotEmpty = true;
    }
  }
  if (isDrawNotEmpty) {
    changeDue.innerHTML = "<p>Status: OPEN</p>";
    return true;
  } else {
    changeDue.innerHTML = "<p>Status: CLOSED</p>";
    return true;
  }
}

purchaseBtn.addEventListener("click", () => {
  const cash = Number(document.getElementById("cash").value); 
  changer(cash); 
});

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/127.0.0.0 Safari/537.36

Challenge Information:

Build a Cash Register Project - Build a Cash Register

2

This is a situation that doesn’t work

cid = [ [ 'PENNY', 0.09 ],
     [ 'NICKEL', 0.05 ],
     [ 'DIME', 0.6 ],
     [ 'QUARTER', 0.75 ],
     [ 'ONE', 0 ],
     [ 'FIVE', 5 ],
     [ 'TEN', 0 ],
     [ 'TWENTY', 0 ],
     [ 'ONE HUNDRED', 0 ] ];
price = 73.51;

with a cash of 80

the status should be CLOSED because the change due is everything there is in the register, isntead it doesn’t give that

3

I am not sure why your condition is right, but when I woke up from a nap and ran the test, it passed all of the conditions.
But for all that, thank you, and I improved my code after your comment.

4

some tests use different values each time, if you have unreliable behavior sometimes it pass sometimes it doesn’t.
it would be great if you would fix that bug because it means that sometimes your app doesn’t work

1 Like