Build a Cash Register Project - Build a Cash Register

Tell us what’s happening:

Describe your issue in detail here.
//
When

price

is

19.5

, the value in the

#cash

element is

20

,

cid

is

[["PENNY", 0.5], ["NICKEL", 0], ["DIME", 0], ["QUARTER", 0], ["ONE", 0], ["FIVE", 0], ["TEN", 0], ["TWENTY", 0], ["ONE HUNDRED", 0]]

, and the

#purchase-btn

element is clicked, the value in the

#change-due

element should be

Status: CLOSED QUARTER: $0 DIME: $0 NICKEL: $0 PENNY: $0.5

//// the upper instruction is not passing inded the output is correct Status: CLOSED PENNY: $0.5,NICKEL: $0,DIME: $0,QUARTER: $0,ONE: $0,FIVE: $0,TEN: $0,TWENTY: $0,ONE HUNDRED: $0
Purchase

Your code so far

function check(cashValue,price,cid) {

let changecash = cashValue - price;
//total cash in drawer
let totalcid = Number(cid.reduce((sum,elem)=> sum + elem[1],0)).toFixed(2);
if(changecash > totalcid){
result.textContent=“Status: INSUFFICIENT_FUNDS”
}else if (totalcid == changecash.toFixed(2))
{
let cidArray = cid.map(item => item[0] + “: $” + item[1])
result.textContent="Status: CLOSED "+ cidArray
}
else {

<!-- 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</title>
<link rel="stylesheet" href="./styles.css"></head>
<body>
<div class="header">
  <h1>Project</h1>
  <h3>Cash Register</h3>
</div>  
<div id="inputbtn">
  <p>Enter cash from customer</p>
  <input id="cash" type="number" placeholder="Cash">
  <div id="change-due"></div>
  <button id="purchase-btn" type="button">Purchase</button>
</div>
<div class="price">
  <h3>Price: 1.87</h3>
</div>
<script src="script.js"></script>
</body>
</html>  

/* file: styles.css */
body {
  margin:0;
  padding: 0;
  background: radial-gradient(circle, rgba(238,174,202,1) 0%, rgba(148,187,233,1) 100%);
}
.header {
  text-align: center;
  justify-content: center;
  margin-top: 30px;
}
.header h1{
  font-family: fantasy;
  font-size: 50px;
}
.header h3{
  font-family: sans-serif;
}
#inputbtn {
  text-align: center;
  margin-top: 60px;
}
#inputbtn input {
  border-radius: 3px;
  border: #ffc8dd;
  height: 30px;
  font-size:20px;
  width: 180px
}
#inputbtn button {
  margin-top: 20px;
  padding: 5px;
  background-color: #f77f00
}
.price {
  text-align: center;
  margin-top: 30px;
  color: red;
  background-color: white;
  width: 120px;
  margin: 0 auto; 
}
/* file: script.js */
let price = 19.5;
let cid = [
  ["PENNY", 0.5], 
  ["NICKEL", 0], 
  ["DIME", 0], 
  ["QUARTER", 0], 
  ["ONE", 0], 
  ["FIVE", 0], 
  ["TEN", 0], 
  ["TWENTY", 0], 
  ["ONE HUNDRED", 0]
];

const currencyUnit = {
  "PENNY": 0.01,
  "NICKEL": 0.05,
  "DIME": 0.1,
  "QUARTER": 0.25,
  "ONE": 1,
  "FIVE": 5,
  "TEN": 10,
  "TWENTY": 20,
  "ONE HUNDRED": 100
};

let cash = document.getElementById("cash");
const result =document.getElementById("change-due");
const purchasebtn =document.getElementById("purchase-btn");

 //purchase button
purchasebtn.addEventListener('click',()=>{
  const cashValue =parseFloat(cash.value)
  if(cashValue < price){
    alert("Customer does not have enough money to purchase the item")
  }else if(price == cashValue)
  {
    result.textContent="No change due - customer paid with exact cash";
  }else {
    check(cashValue,price,cid)
  }
});

// btn function end


function check(cashValue,price,cid) {

let changecash = cashValue - price;
//total cash in drawer
let totalcid = Number(cid.reduce((sum,elem)=> sum + elem[1],0)).toFixed(2);
    if(changecash > totalcid){
        result.textContent="Status:   INSUFFICIENT_FUNDS"
      }else if (totalcid == changecash.toFixed(2))
          {
            let cidArray = cid.map(item => item[0] + ": $" + item[1])
            result.textContent="Status: CLOSED  "+ cidArray
          } 
            else  {

    let changeArr=[];
    
       
    for(let i=cid.length-1; i >=0 ;i--){

      let currencyUnitName = cid[i][0];
      let currencyTotal = cid[i][1];
      let currencyValue = currencyUnit[currencyUnitName];
      let valueByTotal = Number((currencyTotal/currencyValue).toFixed(0));
      let returnUnit=0

        while(changecash >= currencyValue && valueByTotal > 0){
              changecash -= currencyValue;
              changecash = Number(changecash.toFixed(2));
              valueByTotal--
              returnUnit++
            }   

        if (returnUnit > 0){
            changeArr.push([currencyUnitName, returnUnit * currencyValue])
             }
      }
      if (changecash > 0){
              return result.textContent="Status:   INSUFFICIENT_FUNDS"
            }else {
              let changeArray = changeArr.map(item => item[0] + ": $" + item[1])
               return result.textContent="Status:  OPEN  Change: "+changeArray
            }      
    }
}

Your browser information:

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

Challenge Information:

Build a Cash Register Project - Build a Cash Register

You appear to have created this post without editing the template. Please edit your post to Tell us what’s happening in your own words.

anyone has any idea?