-
-
Save zailleh/ca928ca85de11f6164fa3ca34109c447 to your computer and use it in GitHub Desktop.
atm bank html
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| $(document).ready(function() { | |
| const balance = { | |
| savings: 0, | |
| checking: 0 | |
| }; | |
| //CHANGING COLOR ON $0... | |
| const zeroBalance = function() { | |
| if (balance['savings'] === 0) { | |
| $("#savings-balance").css("background-color", "red"); | |
| } | |
| }; | |
| zeroBalance(); | |
| const updateScreen = function (balance) { | |
| $('#checking-balance').html("$" + balance.checking) | |
| $('#savings-balance').html("$" + balance.savings) //this it trying to update screen/dom remeber to change these strings into numbers... at the moment it is just adding the strings together | |
| }; | |
| const deposit = function (amount, account){ | |
| balance[account] = balance[account] + amount; | |
| updateScreen(balance); //calling function from above that will update the screen/dom | |
| }; | |
| const withdraw = function (amount, account) { | |
| balance[account] = balance[account] - amount | |
| updateScreen(balance); | |
| } | |
| //for dom stuff you have to pick up info from input box after a click event. | |
| //CHECKING DEPOSIT | |
| $("#checking-deposit").on("click", function() { | |
| let plusBalance = $("#checking-amount").val() + $("#checking-balance").val(); | |
| deposit(+plusBalance, "checking"); | |
| $("#checking-amount").val(''); | |
| }); | |
| //CHECKING WITHDRAW | |
| $("#checking-withdraw").on("click", function() { | |
| let minusBalance = $("#checking-balance").val() - $("#checking-amount").val(); | |
| deposit(+minusBalance, "checking"); | |
| $("#checking-amount").val(''); | |
| }); | |
| //SAVINGS DEPOSIT | |
| $("#savings-deposit").on("click", function() { | |
| let plusBalance = $("#savings-amount").val() + $("#savings-balance").val(); | |
| deposit(+plusBalance, "savings"); | |
| $("#savings-amount").val(''); | |
| }); | |
| //SAVINGS WITHDRAW | |
| $("#savings-withdraw").on("click", function() { | |
| let minusBalance = $("#savings-balance").val() - $("#savings-amount").val(); | |
| deposit(+minusBalance, "savings"); | |
| $("#savings-amount").val(''); | |
| }); | |
| }); //end of document.ready tag |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title>ATM</title> | |
| <link rel="stylesheet" href="css/atm.css"> | |
| <script src="js/jquery.js"></script> | |
| <script src="js/atm.js"></script> | |
| </head> | |
| <body> | |
| <div id="content"> | |
| <div id="nav"> | |
| <div id="logo"><img src="img/ga.png" alt="Bank of GA"/></div> | |
| <div id="title">Bank of GA</div> | |
| </div> | |
| <div class="account" id="checking"> | |
| <h1>Checking</h1> | |
| <div class="balance" id="checking-balance">$0</div> | |
| <input id="checking-amount" type="text" placeholder="enter an amount" /> | |
| <input id="checking-deposit" type="button" value="Deposit" /> | |
| <input id="checking-withdraw" type="button" value="Withdraw" /> | |
| </div> | |
| <div class="account" id="savings"> | |
| <h1>Savings</h1> | |
| <div class="balance" id="savings-balance">$0</div> | |
| <input id="savings-amount" type="text" placeholder="enter an amount" /> | |
| <input id="savings-deposit" type="button" value="Deposit" /> | |
| <input id="savings-withdraw" type="button" value="Withdraw" /> | |
| </div> | |
| <div class="clear"></div> | |
| </div> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment