Untitled

<html>
	<head>
		<title> Black Jack </title>
		<style type="text/css">
			body{
				background: #093028;
				background: -webkit-linear-gradient(to top, #093028 , #237A57);
				background: linear-gradient(to top, #093028 , #237A57);
			}

				hr{
					width: 50%;
				}

				td{
					width: 100px;
					height: 50px;
					vertical-align: center;
				}

				html{
					font-family: "Lato", sans-serif;
				}

				table {
					box-shadow: rgba(0,0,0,.4) 0 4px 8px;
    			background: rgba(35, 81, 64, 0.7);
					border-collapse: collapse;
					padding:1em;
					color:white;
				}

				table,th,td{
					border: none;
					text-align: center;
				}

				button {
					height: 50px;
					width: 120px;
					color: white;
					background-color: #701D15;
					padding:.25em;
					border: none;
					box-shadow: rgba(0,0,0,.4) 0 4px 5px 1px;
					margin-bottom:1em;
					margin-left:.5em;
					margin-right:.5em;
				}

				#betId::before,
				#cashId::before {
					content: "$";
				}

				[data-value]::after {
					content: attr(data-value);
				}

		</style>
		<script type="text/javascript">
			var player, dealer, bet, cash, name

			var player=0;
			var dealer=0;
			var bet=0;
			var cash=500;
			var name="Rachel";

			function showBet ()
			{
				document.getElementById("betId").dataset.value = bet;
			}

			function incrementBet() {
				if(bet+10<=cash) {
					bet+=10;
				} else {
					alert("You can't bet that much! Add more money!");
				}
			}

			function getBet()
			{
				var value = prompt("How much money would you like to bet?");
	      if (value[0]=="$")
					value = value.slice(1);
	      value= parseInt(value);
	      if (value>cash){
          alert("You can't bet that much! Add more money!");
        } else if(value<0) {
					alert("Nice try you scamp. You can't bet negative money unless you're the IRS.")
				} else{
	          bet=value;
	      }
			}

			function play()
			{
				player += Math.floor((Math.random()*11) + 1);
				document.getElementById("playerId").dataset.value = player;
				if (player >= 21)
					calculateWinnings();
			}

			function calculateWinnings()
			{
				while (dealer < 18)
				{
					dealer += Math.floor((Math.random()*11) + 1);
				}
				cash = cash - bet;
				document.getElementById("dealerId").dataset.value = dealer;
				if(player > 21)
					{
						document.getElementById("resultId").innerHTML = "Busted! You lose!";
					}
				else if (dealer > 21)
					{
						document.getElementById("resultId").innerHTML = "Dealer Busted! " + name + " wins!";
						cash += bet * 2;
					}
				else if (player == 21)
					{
						document.getElementById("resultId").innerHTML = name + " got 21!" + name + " wins!"
						cash += bet*3;
					}
				else if (player > dealer)
					{
						document.getElementById("resultId").innerHTML = name + " wins!"
						cash += bet * 2;
					}
				else if (dealer >= player)
					{
						document.getElementById("resultId").innerHTML = "Dealer wins!"
					}

				document.getElementById("cashId").dataset.value = cash;
				bet = 0;
			}

			function newGame()
			{
				player = dealer = bet = 0;
				document.getElementById("playerId").dataset.value = player;
				document.getElementById("dealerId").dataset.value = dealer;
				document.getElementById("betId").dataset.value = bet;
				document.getElementById("resultId").innerHTML = "";
				document.getElementById("cashId").dataset.value = cash;
			}

			function addMoney()
			{
				var value = prompt("How much money would you like to add?");
				cash += parseInt(value);
				document.getElementById("cashId").dataset.value = cash;
			}

		</script>

	</head>
	<body>
		<center>
			<h1> Welcome to Black Jack! </h1>
				<table>
					<tr>
						<th> Your Total </th>
						<th> Dealer Total </th>
						<th> Bet Amount </th>
						<th> Cash Remaining </th>
					</tr>
					<tr>
						<td> <p id='playerId' data-value="0">&nbsp;</p></td>
						<td> <p id='dealerId' data-value="0">&nbsp;</p></td>
						<td> <p id='betId' data-value="0">&nbsp;</p></td>
						<td> <p id='cashId' data-value="500"></p></td>
					</tr>

				</table>

				<p> Game Result: <b id="resultId"></b></p>

				<button onclick="incrementBet(); showBet();"> $10 </button>
				<button onclick="getBet(); showBet();"> Custom Bet </button>
				<button onclick="newGame();"> New Game </button>
				<br/>
				<button onclick="play();"> Deal Card </button>
				<button onclick="calculateWinnings();"> Reveal Cards </button>
				<button onclick="addMoney();"> Add Money </button>
				<br/>


		</center>

	</body>


</html>