Build a Cash Register Project - Build a Cash Register

Tell us what’s happening:

I can’t get my code checked because the programme doesn’t read my global variables.

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</title>
    <link rel="stylesheet" href="styles.css">
    <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" rel="stylesheet">
    <script type="module" src="script.js"></script>
</head>
<body>
    <h1>Cash Register</h1>
    <p>Enter cash from customer</p>
    <form action="">
        <input type="number" id="cash">
        <button id="purchase-btn">Purchase</button>
    </form>
    <p id="change-due"></p>
    <p id="total"></p>
</body>
</html>
/* file: script.js */
let price = 1;
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 cash = document.getElementById("cash");
const purchaseBtn = document.getElementById("purchase-btn")
const changeDue = document.getElementById("change-due")
const total = document.getElementById("total")

total.textContent = `Total: $${price}`

purchaseBtn.onclick = e => {
    e.preventDefault()

    const change = (cash.value * 100 - price * 100)
    
    if (price > cash.value) {
        alert("Customer does not have enough money to purchase the item")
    } else if (price == cash.value) {
        alert("No change due - customer paid with exact cash")
    } else {
        calculateChange(cid, change)
    }
}



const calculateChange = (cid, change) => {
    const denominations = [
        ['ONE HUNDRED', 10000],
        ['TWENTY', 2000],
        ['TEN', 1000],
        ['FIVE', 500],
        ['ONE', 100],
        ['QUARTER', 25],
        ['DIME', 10],
        ['NICKEL', 5],
        ['PENNY', 1]
    ];

    let totalCid = 0

    let cidInPennies = cid.map(([name, amount]) => [name, Math.round(amount * 100)]);
    cidInPennies.forEach(value => totalCid += value[1]);

    if (change > totalCid) {
        return changeDue.textContent = "Status: INSUFFICIENT_FUNDS"
    }
    
    let changeArray = []

    for (let [name, value] of denominations) {
        let amountInDrawer = cidInPennies.find(item => item[0] === name)[1]
        let amountToGive = 0;
        while (change >= value && amountInDrawer > 0) {
            change -= value
            amountInDrawer -= value
            amountToGive += value
        }
        if (amountToGive > 0) {
            changeArray.push([name, amountToGive / 100]);
            let originalIndex = cid.findIndex(item => item[0] === name);
            cid[originalIndex][1] -= amountToGive / 100;
        }
    }


    if (change === totalCid) {
        changeDue.textContent = "Status: CLOSED"
    }
    else {
        changeDue.innerHTML = `Status: OPEN ${changeArray.map(item => `${item[0]}: $${item[1]}`).toReversed().join(' ')}`;
    }
}

/* file: styles.css */

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

Can you say more? What is happening exactly?

1 Like

I put the script type=module in the head and freecodecamp didn’t like it, it wants it after the body. Solved ^^’