Skip to content

Instantly share code, notes, and snippets.

@Andsbf

Andsbf/bet_game.html

Created April 7, 2015 00:04
Show Gist options
  • Save Andsbf/a2b38640602e3a62de0d to your computer and use it in GitHub Desktop.
Save Andsbf/a2b38640602e3a62de0d to your computer and use it in GitHub Desktop.
Download ZIP
Raw
bet_game.html
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Bet game</title>
<meta name="description" content="Bet gamed">
<meta name="author" content="Anderson">
</head>
<body>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="">
<meta name="author" content="">
<link rel="icon" href="../../favicon.ico">
<title>Bet Game</title>
<!-- Bootstrap core CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<!-- Custom styles for this template -->
<link rel="stylesheet" href="http://getbootstrap.com/examples/starter-template/starter-template.css">
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Bet Game</a>
</div>
<!-- <div id="navbar" class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</div><!--/.nav-collapse --> -->
</div>
</nav>
<div class="container">
<div class="starter-template">
<h1>Make your bet!!</h1>
<p class="lead">Your money: $<span id='money'></span> </p>
<p class="text-info" id='bank_money'></p>
<p class="text-info" id='info_result'></p>
<div class="form" style="width: 500px; margin: auto">
<div class="form-group">
<label class="sr-only" for="bet_value">bet_value</label>
<div class="input-group">
<div class="input-group-addon">$</div>
<input type="text" class="form-control" id="bet_value" placeholder="Bet Value Amount (in dollars)">
<div class="input-group-addon"></div>
</div>
<label class="sr-only" for="bet_guess">bet_guess</label>
<div class="input-group">
<div class="input-group-addon">?</div>
<input type="text" class="form-control" id="bet_guess" placeholder="Guess a Number(1..10)">
<div class="input-group-addon"></div>
</div>
</div>
<button class="btn btn-primary" id="make_bet">Bet</button>
<button class="btn btn-primary hidden" id="restart_btn">Restart Game</button>
</div>
</div>
</div><!-- /.container -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<script src="scripts.js"></script>
</body>
</html>
Raw
scripts.js
$(document).ready(function(){
var money = 20;
var rightNumber;
var bet_value ;
var bet_guess ;
var money_balance;
$('#money').text(money)
$('#bank_money').text('$'.repeat(money))
$("#make_bet").on('click',function(){
rightNumber = Math.floor((Math.random() * 10) + 1);
bet_guess = parseInt($('#bet_guess').val(),10);
bet_value = parseInt($('#bet_value').val(),10);
if (bet_value > money) return alert("HEYYY, you can't bet more money than you have");
if (isNaN(bet_value)) bet_value = 0;
switch(bet_guess) {
case rightNumber:
money += bet_value * 2;
msg = "Right on! the right number was: " + rightNumber ;
break;
case (rightNumber + 1):
case (rightNumber - 1):
msg = "Close, you didn't lose your money, the right number was:" + rightNumber ;
break;
default:
money -= bet_value;
msg = "better luck next time the right answer was : " + rightNumber;
};
$('#info_result').text(msg);
$('#money').text(money);
money <= 0 ? $('#bank_money').text(String.fromCharCode(9785)) : $('#bank_money').text('$'.repeat(money)) ;
money_balance = parseInt($('#money').text(),10);
if (money_balance <= 0) {
$('#make_bet').addClass('hidden');
$('#info_result').text('Looks like you have loose all your money');
$('#restart_btn').attr('class', 'btn btn-primary');
};
});
$("#restart_btn").on('click',function(){
money = 20;
$('#money').text(money);
$('#bank_money').text('$'.repeat(money))
$('#info_result').text('Game restarted, try again!');
$('#restart_btn').attr('class', 'btn btn-primary hidden');
$('#make_bet').removeClass( "hidden" )
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment