jpacora/ATM.html

## ATM.html
<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>ATM</title>
    <script>
        var balanceTotal = 666
        var operacionActual = null
    </script>
</head>
<body>
    <h1 id="balance"></h1>
    <h2 id="operacion"></h2>

    <div>
        <button onclick="elegirOperacion('retiro')">Retirar</button>
        <button onclick="elegirOperacion('deposito')">Depositar</button>
    </div>

    <div style="margin-top: 1em;">
        <button onclick="operar(10)">S/10</button>
        <button onclick="operar(20)">S/20</button>
        <button onclick="operar(30)">s/30</button>
    </div>

    <script>

        const balance = document.getElementById("balance")
        const operacion = document.getElementById("operacion")

        const mostrarBalance = () => {
            balance.innerHTML = `Balance: S/${balanceTotal}`
        }

        const mostrarOperacion = () => {
            if(operacionActual === null) {
                operacion.innerHTML = "Seleccione una operacion"
            } else {
                operacion.innerHTML = `Operacion actual: ${operacionActual}`
            }
        }

        const elegirOperacion = tipo => {
            operacionActual = tipo
            mostrarOperacion()
        }

        const operar = monto => {
            if(operacionActual === null) {
                return alert("Primero debes elegir una operacion")
            }

            if(operacionActual === "deposito") {
                balanceTotal = balanceTotal + monto
            } else {
                // es un retiro
                let total = balanceTotal - monto
                // verificamos si tiene el saldo suficiente
                if(total < 0) {
                    return alert("Saldo insuficiente")
                } else {
                    balanceTotal = total
                }
            }
            mostrarBalance()
        }

        mostrarBalance()
        mostrarOperacion()

    </script>

</body>
</html>
	<!DOCTYPE html>
	<html lang="es">
	<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>ATM</title>
	<script>
	var balanceTotal = 666
	var operacionActual = null
	</script>
	</head>
	<body>
	<h1 id="balance"></h1>
	<h2 id="operacion"></h2>

	<div>
	<button onclick="elegirOperacion('retiro')">Retirar</button>
	<button onclick="elegirOperacion('deposito')">Depositar</button>
	</div>

	<div style="margin-top: 1em;">
	<button onclick="operar(10)">S/10</button>
	<button onclick="operar(20)">S/20</button>
	<button onclick="operar(30)">s/30</button>
	</div>

	<script>

	const balance = document.getElementById("balance")
	const operacion = document.getElementById("operacion")

	const mostrarBalance = () => {
	balance.innerHTML = `Balance: S/${balanceTotal}`
	}

	const mostrarOperacion = () => {
	if(operacionActual === null) {
	operacion.innerHTML = "Seleccione una operacion"
	} else {
	operacion.innerHTML = `Operacion actual: ${operacionActual}`
	}
	}

	const elegirOperacion = tipo => {
	operacionActual = tipo
	mostrarOperacion()
	}

	const operar = monto => {
	if(operacionActual === null) {
	return alert("Primero debes elegir una operacion")
	}

	if(operacionActual === "deposito") {
	balanceTotal = balanceTotal + monto
	} else {
	// es un retiro
	let total = balanceTotal - monto
	// verificamos si tiene el saldo suficiente
	if(total < 0) {
	return alert("Saldo insuficiente")
	} else {
	balanceTotal = total
	}
	}
	mostrarBalance()
	}

	mostrarBalance()
	mostrarOperacion()

	</script>

	</body>
	</html>