davidvandusen/betting-game.js

## betting-game.js
$(function () {

  var MAX_BET = 10;
  var MIN_BET = 5;
  var MIN_GUESS = 1;
  var MAX_GUESS = 10;

  var playerMoney = 100;
  var randomNumber;

  var $bet = $('#bet');
  var $guess = $('#guess');
  var $theNumber = $('#the-number');
  var $money = $('#money');

  function play() {
    var betAmount, guessNumber, difference;
    if (playerMoney < MIN_BET) {
      alert('Out of money.');
      return;
    }
    betAmount = bet($bet.val());
    if (betAmount === false) {
      alert('Invalid bet.');
      return;
    }
    guessNumber = guess($guess.val());
    if (guessNumber === false) {
      alert('Invalid guess.');
      return;
    }
    drawNumber();
    difference = howClose(guessNumber);
    if (difference === 0) {
      playerMoney += betAmount;
    } else if (difference > 1) {
      playerMoney -= betAmount;
    }
    updateUI();
  }

  function guess(number) {
    var guess = parseInt(number, 10) || 0;
    if (guess < MIN_GUESS || guess > MAX_GUESS) {
      return false;
    }
    return guess;
  }

  function bet(amount) {
    var dollarAmount = parseInt(amount, 10) || 0;
    if (dollarAmount < MIN_BET || dollarAmount > MAX_BET) {
      return false;
    }
    return dollarAmount;
  }

  function drawNumber() {
    randomNumber = Math.floor(Math.random() * (MAX_GUESS - MIN_GUESS + 1)) + MIN_GUESS;
  }

  function howClose(guess) {
    return Math.abs(randomNumber - guess);
  }

  function updateUI() {
    $theNumber.val(randomNumber);
    $money.val(playerMoney);
  }

  updateUI();

  $('#play').on('click', play);

});

## index.html
<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Betting Game</title>
  <script src="bower_components/jquery/dist/jquery.js"></script>
  <script src="betting-game.js"></script>
</head>
<body>
<p>
  <label>
    Bet:
    <input id="bet" />
  </label>
</p>
<p>
  <label>
    Guess:
    <input id="guess" />
  </label>
</p>
<p>
  <label>
    Money:
    <input readonly id="money" />
  </label>
</p>
<p>
  <label>
    The number:
    <input readonly id="the-number" />
  </label>
</p>
<p>
  <button id="play">Play!</button>
</p>
</body>
</html>
	$(function () {

	var MAX_BET = 10;
	var MIN_BET = 5;
	var MIN_GUESS = 1;
	var MAX_GUESS = 10;

	var playerMoney = 100;
	var randomNumber;

	var $bet = $('#bet');
	var $guess = $('#guess');
	var $theNumber = $('#the-number');
	var $money = $('#money');

	function play() {
	var betAmount, guessNumber, difference;
	if (playerMoney < MIN_BET) {
	alert('Out of money.');
	return;
	}
	betAmount = bet($bet.val());
	if (betAmount === false) {
	alert('Invalid bet.');
	return;
	}
	guessNumber = guess($guess.val());
	if (guessNumber === false) {
	alert('Invalid guess.');
	return;
	}
	drawNumber();
	difference = howClose(guessNumber);
	if (difference === 0) {
	playerMoney += betAmount;
	} else if (difference > 1) {
	playerMoney -= betAmount;
	}
	updateUI();
	}

	function guess(number) {
	var guess = parseInt(number, 10) \|\| 0;
	if (guess < MIN_GUESS \|\| guess > MAX_GUESS) {
	return false;
	}
	return guess;
	}

	function bet(amount) {
	var dollarAmount = parseInt(amount, 10) \|\| 0;
	if (dollarAmount < MIN_BET \|\| dollarAmount > MAX_BET) {
	return false;
	}
	return dollarAmount;
	}

	function drawNumber() {
	randomNumber = Math.floor(Math.random() * (MAX_GUESS - MIN_GUESS + 1)) + MIN_GUESS;
	}

	function howClose(guess) {
	return Math.abs(randomNumber - guess);
	}

	function updateUI() {
	$theNumber.val(randomNumber);
	$money.val(playerMoney);
	}

	updateUI();

	$('#play').on('click', play);

	});
	<!doctype html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<title>Betting Game</title>
	<script src="bower_components/jquery/dist/jquery.js"></script>
	<script src="betting-game.js"></script>
	</head>
	<body>
	<p>
	<label>
	Bet:
	<input id="bet" />
	</label>
	</p>
	<p>
	<label>
	Guess:
	<input id="guess" />
	</label>
	</p>
	<p>
	<label>
	Money:
	<input readonly id="money" />
	</label>
	</p>
	<p>
	<label>
	The number:
	<input readonly id="the-number" />
	</label>
	</p>
	<p>
	<button id="play">Play!</button>
	</p>
	</body>
	</html>