Build a Cash Register Project - Build a Cash Register

endispiri4 · September 13, 2024, 5:14pm

This rounds the sum cuz sometimes it would be like 237.999999999999999999

ILM · September 13, 2024, 5:17pm

in the scope of your cash register what’s the usefulness of that line? (ignoring the rounding)

endispiri4 · September 13, 2024, 7:34pm

Just for accurate calculations. To have no numbers like the one i mentioned (2.99999999999991)

ILM · September 13, 2024, 7:35pm

I said ignoring the rounding, if we ignore the rounding there is

what does this do? and what are you doing with it later?

endispiri4 · September 13, 2024, 8:21pm

Hmm… it shouldnt be like that now that I’m thinking about it more.

I modified the code again to this:

let cash = document.getElementById("cash");
let btn = document.getElementById("purchase-btn");
let change = document.getElementById("change-due");
let drawer = document.getElementById("cash-in-drawer");
let changeDue = [];

let price = 1.87;
// let price = 0.5;

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]
];

// Display cash on the drawer

function displayDrawer() {
  for(let i = 0; i < cid.length; i++) {
    let el = document.createElement('p');
    el.textContent = `${cid[i][0]}: ${Math.round(cid[i][1] * 100) / 100}`;
    drawer.appendChild(el);
  }
}

//Event listener

btn.addEventListener("click", () => {

  change.textContent = "";

  //Sum of the cash in the drawer
  let sum = 0;
  for(let i = 0; i < cid.length; i++){
    sum += cid[i][1];
  }

  sum = Math.round(sum * 100) / 100;

  console.log(sum);

  if(cash.value < price){
    alert("Customer does not have enough money to purchase the item");
    cash.value = "";
  }else if(cash.value == price) {
    change.textContent = "No change due - customer paid with exact cash";
    cash.value = "";
  }else if(cash.value > price) {
    console.log(cash.value);
    let changeStatus = document.createElement('p');
    if((cash.value - price) === sum){
      changeStatus.textContent = "Status: CLOSED";
    }else {
      changeStatus.textContent = "Status: OPEN";
    }
    
    change.appendChild(changeStatus);

    const reversedCid = cid.map(item => Math.ceil(item[1] * 100)).reverse();
    // [10000, 6000, 2000, 5500, 9000, 425, 310, 205, 101]
    let oldReversedCid = cid.map(item => Math.ceil(item[1] * 100)).reverse();

    const billValue = [10000, 2000, 1000, 500, 100, 25, 10, 5, 1];
    let cashToChange = cash.value * 100 - price * 100;
    
    let i = 0;
    while(i < billValue.length){
      if(cashToChange >= billValue[i] && reversedCid[i] !== 0){
        cashToChange -= billValue[i];
        reversedCid[i] -= billValue[i];
      }else{
        i++;
      }
    }

    cash.value = "";

    if(cashToChange > 0){
      change.textContent = "Status: INSUFFICIENT_FUNDS"
    }else{
      for(let i = 0; i < oldReversedCid.length; i++){
        changeDue.push(oldReversedCid[i] -= reversedCid[i]);
      }
      console.log("Change due not reversed: " + changeDue);
      changeDue.reverse();
      console.log("Change due: " + changeDue);

      for(let i = 0; i < cid.length; i++){
        cid[i][1] = Math.round((cid[i][1] - changeDue[i] / 100) * 100) / 100;
      }

      for(let i = 0; i < changeDue.length; i++){
        if(changeDue[i] > 0){
          let changeDueEl = document.createElement('p');
          change.appendChild(changeDueEl);
          changeDueEl.textContent = `${cid[i][0]} : ${changeDue[i] / 100}`;
        }
      }

      changeDue = [];
      drawer.innerHTML = "";
      //Console log UPDATED CID on CASH IN DRAWER
      console.log("New Cid Updated " + cid);
      displayDrawer();
      console.log("New sum: " + sum);
    }
  }
})

displayDrawer();

I subtracted the price from cash.value to be able to check if the cash.value is equal with sum, but it still wont work.

Here is the condition:

if(cash.value < price){
    alert("Customer does not have enough money to purchase the item");
    cash.value = "";
  }else if(cash.value == price) {
    change.textContent = "No change due - customer paid with exact cash";
    cash.value = "";
  }else if(cash.value > price) {
    let changeStatus = document.createElement('p');
    if((cash.value - price) === sum){
      changeStatus.textContent = "Status: CLOSED";
    }else {
      changeStatus.textContent = "Status: OPEN";
    }

It looks like the code just ignores the if() inside of the last if else() but i still cant figure out why.

ILM · September 13, 2024, 9:27pm

don’t you think you are missing something here?
hint:

endispiri4 · September 14, 2024, 6:04am

Should i use Math.round in that one too?

ILM · September 14, 2024, 7:29am

check what the value of that operation is, does it need to be rounded?

endispiri4 · September 14, 2024, 9:45am

The value is fine, just tested it but I’m not gonna remove the Math.round just to make sure there are no errors later.

ILM · September 14, 2024, 12:20pm

so you checked the value of cash.value - price?

endispiri4 · September 14, 2024, 12:32pm

Yes, i tested it in the global scope and it was accurate (only 2 numbers after the comma)

ILM · September 14, 2024, 12:37pm

did you test it with all possible values?

endispiri4 · September 14, 2024, 1:23pm

Ill have to try with all of the possible values

endispiri4 · September 17, 2024, 6:19pm

Hey, when i run the tests some of them fail even though when i test them myself they work.

Here is the tests that fail:

ILM · September 17, 2024, 6:49pm

what’s your latest code?

if you test them manually and it works, but tested by the tests it doesn’t, it could be your app is relying on some calculations that happens only when the app is first starting, the tests work that the app is started and then the tests change the values and test the output consecutively.

It would be like having this code at the very end of your editor, repeated as many times as there are tests, with the appropriate values

cid = [...]
price = ...
cash.value = ...
document.querySelector('#purchase-btn').click();
// now the tests check that the values on the page are as expected

cid = [...]
price = ...
cash.value = ...
document.querySelector('#purchase-btn').click();
// and so on

endispiri4 · September 20, 2024, 7:41am

My latest code is this one:

let cash = document.getElementById("cash");
let btn = document.getElementById("purchase-btn");
let change = document.getElementById("change-due");
let drawer = document.getElementById("cash-in-drawer");
let changeDue = [];

let price = 1.87;
// let price = 0.5;

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]
];

// Display cash on the drawer

function displayDrawer() {
  for(let i = 0; i < cid.length; i++) {
    let el = document.createElement('p');
    el.textContent = `${cid[i][0]}: ${Math.round(cid[i][1] * 100) / 100}`;
    drawer.appendChild(el);
  }
}

//Event listener

btn.addEventListener("click", () => {

  change.textContent = "";

  //Sum of the cash in the drawer
  let sum = 0;
  for(let i = 0; i < cid.length; i++){
    sum += cid[i][1];
  }

  sum = Math.round(sum * 100) / 100;

  console.log(sum);

  if(cash.value < price){
    alert("Customer does not have enough money to purchase the item");
    cash.value = "";
  }else if(cash.value == price) {
    change.textContent = "No change due - customer paid with exact cash";
    cash.value = "";
  }else if(cash.value > price) {
    console.log("cash value: " + cash.value);
    let changeStatus = document.createElement('p');
      if(Math.round((cash.value - price) * 100) / 100 == sum){
        changeStatus.textContent = "Status: CLOSED";
      }else {
        changeStatus.textContent = "Status: OPEN";
    }
    
    change.appendChild(changeStatus);

    const reversedCid = cid.map(item => Math.ceil(item[1] * 100)).reverse();
    console.log("Reversed cid: " + reversedCid);
    // [10000, 6000, 2000, 5500, 9000, 425, 310, 205, 101]
    let oldReversedCid = cid.map(item => Math.ceil(item[1] * 100)).reverse();
    console.log("Old reversed cid: " + oldReversedCid);

    const billValue = [10000, 2000, 1000, 500, 100, 25, 10, 5, 1];
    let cashToChange = Math.round(((cash.value * 100 - price * 100) * 100) / 100);
    console.log("CashToChange: " + cashToChange);
    
    let i = 0;
    while(i < billValue.length){
      if(cashToChange >= billValue[i] && reversedCid[i] !== 0){
        cashToChange -= billValue[i];
        reversedCid[i] -= billValue[i];
      }else{
        i++;
      }
    }

    cash.value = "";

    if(cashToChange > 0){
      change.textContent = "Status: INSUFFICIENT_FUNDS"
    }else{
      for(let i = 0; i < oldReversedCid.length; i++){
        changeDue.push(oldReversedCid[i] -= reversedCid[i]);
      }
      console.log("Change due not reversed: " + changeDue);
      changeDue.reverse();
      console.log("Change due: " + changeDue);

      for(let i = 0; i < cid.length; i++){
        cid[i][1] = Math.round((cid[i][1] - changeDue[i] / 100) * 100) / 100;
      }

      for(let i = 0; i < changeDue.length; i++){
        if(changeDue[i] > 0){
          let changeDueEl = document.createElement('p');
          change.appendChild(changeDueEl);
          changeDueEl.textContent = `${cid[i][0]} : ${changeDue[i] / 100}`;
        }
      }

      changeDue = [];
      drawer.innerHTML = "";
      //Console log UPDATED CID on CASH IN DRAWER
      console.log("New Cid Updated " + cid);
      displayDrawer();
    }
  }
})

displayDrawer();

Yes i checked them separately and they work but when i press “Run the tests” it shows that the tests fail.

I have tried to write code inside the event listener only but there is the display drawer function on the global scope.

ILM · September 20, 2024, 8:56am

this doesn’t look inside an event listener

endispiri4 · September 21, 2024, 11:34am

I change that, even if i declare it inside the event listener the tests will still fail. I also changed the sorting of the change due element, but it still wont work. The same tests fail.

This is the output of the 12th test:

Hmm. should i add the “$” in front of the numbers of change due and cash in drawer elements?

hbar1st · September 21, 2024, 11:47am

You should match the expected output exactly including any dollar signs.

endispiri4 · September 21, 2024, 12:47pm

I added the “$” but the tests still fail…

Topic		Replies	Views
Build a Cash Register Project - Build a Cash Register JavaScript	40	773	July 22, 2024
Build a Cash Register Project JavaScript	42	676	July 27, 2024
Build a Cash Register Project - Build a Cash Register JavaScript	32	417	June 28, 2025
Build a Cash Register Project - Build a Cash Register JavaScript	89	825	June 28, 2025
Build a Cash Register Project - Build a Cash Register JavaScript	16	193	November 20, 2024

Build a Cash Register Project - Build a Cash Register

Related topics