Build a Cash Register Project - Build a Cash Register

Curriculum Help
1

Tell us what’s happening:

Not sure what the issue is here.

When I check calculateChange function with console.log all values seems to be correct

Can you help?

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
  <html lang="en">
    <head>
      </head>
      <body>
        <input id="cash"></input>
        <div id="change-due"></div>
        <button id="purchase-btn">Purchase</button>
        
        <script src="script.js"></script>
        </body>
    </html>

/* file: styles.css */


/* 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 purchaseBtn = document.getElementById("purchase-btn");
const cashInput = document.getElementById("cash");
const changeDue = document.getElementById("change-due");

const calculateChange = (price, cashInput, cid) => {
  let change = cashInput - price;
  let cidTotal = 0
  for (let elem of cid) {
    cidTotal += elem[1];
  }
  return change
} 

purchaseBtn.addEventListener("click", () => {
  if(cashInput.value === price) {
    changeDue.textContent = "No change due - customer paid with exact cash"
  } else if(cashInput.value < price) {
    alert("Customer does not have enough money to purchase the item");
  } else if(calculateChange(19.5, 20, [["PENNY", 1.01], ["NICKEL", 2.05], ["DIME", 3.1], ["QUARTER", 4.25], ["ONE", 90], ["FIVE", 55], ["TEN", 20], ["TWENTY", 60], ["ONE HUNDRED", 100]])) {
    changeDue.textContent = "Status: OPEN QUARTER: $0.5"
  } else if(calculateChange(3.26, 100, [["PENNY", 1.01], ["NICKEL", 2.05], ["DIME", 3.1], ["QUARTER", 4.25], ["ONE", 90], ["FIVE", 55], ["TEN", 20], ["TWENTY", 60], ["ONE HUNDRED", 100]])) {
    changeDue.textContent = "Status: OPEN TWENTY: $60 TEN: $20 FIVE: $15 ONE: $1 QUARTER: $0.5 DIME: $0.2 PENNY: $0.04"
  } else if(calculateChange(19.5, 20, [["PENNY", 0.01], ["NICKEL", 0], ["DIME", 0], ["QUARTER", 0], ["ONE", 0], ["FIVE", 0], ["TEN", 0], ["TWENTY", 0], ["ONE HUNDRED", 0]])) {
    changeDue.textContent = "Status: INSUFFICIENT_FUNDS"
  } else if(calculateChange(19.5, 20, [["PENNY", 0.5], ["NICKEL", 0], ["DIME", 0], ["QUARTER", 0], ["ONE", 0], ["FIVE", 0], ["TEN", 0], ["TWENTY", 0], ["ONE HUNDRED", 0]])) {
    changeDue.textContent = "Status: CLOSED PENNY: $0.5"
  }


})




console.log(calculateChange(3.26, 100, [["PENNY", 1.01], ["NICKEL", 2.05], ["DIME", 3.1], ["QUARTER", 4.25], ["ONE", 90], ["FIVE", 55], ["TEN", 20], ["TWENTY", 60], ["ONE HUNDRED", 100]]))

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/17.3 Safari/605.1.15

Challenge Information:

Build a Cash Register Project - Build a Cash Register

2

Well… most of the else ifs are literally only checking if calculateChange returns any truthy value. Are you trying to hardcode the answers?

3

Is that a problem for the assignment?

Should I use let after the first if to re-assign price and cash and cid and just check price, cash,cid in the calculateChange function?

Main issue I face is it gives okay for first 1-2 tasks, then I add other steps and 1-2 becomes false and 3-4 becomes correct

Because tasks are written like this :

" When price is 3.26 , the value in the #cash element is 100 , cid is [["PENNY", 1.01], ["NICKEL", 2.05], ["DIME", 3.1], ["QUARTER", 4.25], ["ONE", 90], ["FIVE", 55], ["TEN", 20], ["TWENTY", 60], ["ONE HUNDRED", 100]] , and the #purchase-btn element is clicked, the value in the #change-due element should be "Status: OPEN TWENTY: $60 TEN: $20 FIVE: $15 ONE: $1 QUARTER: $0.5 DIME: $0.2 PENNY: $0.04" ."

So I have to hard code the answers no ? Or use let to reassign them after each if statement?

4

Completed project should be able to handle various situations, as noted in description:

Your application should show different messages depending on the price of the item, the amount of cash provided by the customer, and the amount of cash in the drawer:

  • "Status: INSUFFICIENT_FUNDS": if cash-in-drawer is less than the change due, or if you cannot return the exact change.
  • "Status: CLOSED": if cash-in-drawer is equal to the change due.
  • "Status: OPEN": if cash-in-drawer is greater than the change due and you can return change, with the change due in coins and bills sorted in highest to lowest order.

Tests are giving a more concrete example helping with understanding what should happen when. However the goal isn’t to make it work only for these cases.

In a simplified version, this is what happens in your if/else if:

function a(param) {
    return true;
}

if (a(1)) {
    //  always true
} else if (a(2)) {
    //  this will never be reached
} else if (a(3)) {
    // this will never be reached
}

The first condition always catches it, because function always returns truthy value - true. For calculateChange it’s almost always truthy value.