1nicerOli
/
blackjack
1
1
Fork 0
Code Issues 7 Pull Requests Releases Wiki Activity
Browse Source

Introduces bets.

feature/split
Nero Ignis 5 years ago
parent
7d9d9a6e25
commit
b573db30f9
3 changed files with 70 additions and 30 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 4
      css/app.css
  2. 71
      index.htm
  3. 25
      js/app.js

4
css/app.css
Unescape View File

@ -36,3 +36,7 @@ body {
#bankModal * { #bankModal * {
color: black; color: black;
} }
.bet-input {
color: white !important;
}

71
index.htm
Unescape View File

@ -14,7 +14,7 @@
<body> <body>
<div id="root"> <div id="root">
<nav class="navbar navbar-expand-lg"> <nav class="navbar navbar-expand-lg">
<a class="navbar-brand" href="#"> <a class="navbar-brand" href="/blackjack/">
<img src="img/Chips/chipBlueWhite.png" alt="logo"> <img src="img/Chips/chipBlueWhite.png" alt="logo">
BlackJack BlackJack
</a> </a>
@ -24,26 +24,26 @@
<div class="collapse navbar-collapse" id="navbarSupportedContent"> <div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto"> <ul class="navbar-nav mr-auto">
<li class="nav-item" v-if="!roundActive"> <!-- <li class="nav-item" v-if="!roundActive">-->
<a class="nav-link" href="javascript:" @click="startRound"> <!-- <a class="nav-link" href="javascript:" @click="startRound">-->
New round <i class="fas fa-play"></i> <!-- New round <i class="fas fa-play"></i>-->
</a> <!-- </a>-->
</li> <!-- </li>-->
<li class="nav-item" v-if="roundActive"> <!-- <li class="nav-item" v-if="roundActive">-->
<a class="nav-link" href="javascript:" @click="drawAnotherCard"> <!-- <a class="nav-link" href="javascript:" @click="drawAnotherCard">-->
Draw a card <i class="fas fa-hand-pointer"></i> <!-- Draw a card <i class="fas fa-hand-pointer"></i>-->
</a> <!-- </a>-->
</li> <!-- </li>-->
<li class="nav-item" v-if="roundActive"> <!-- <li class="nav-item" v-if="roundActive">-->
<a class="nav-link" href="javascript:" @click="pass"> <!-- <a class="nav-link" href="javascript:" @click="pass">-->
Stand <i class="fas fa-hand-paper"></i> <!-- Stand <i class="fas fa-hand-paper"></i>-->
</a> <!-- </a>-->
</li> <!-- </li>-->
<li class="nav-item" v-if="roundActive"> <!-- <li class="nav-item" v-if="roundActive">-->
<a class="nav-link" href="javascript:" @click="endRound"> <!-- <a class="nav-link" href="javascript:" @click="endRound">-->
Cancel round <i class="fas fa-stop"></i> <!-- Cancel round <i class="fas fa-stop"></i>-->
</a> <!-- </a>-->
</li> <!-- </li>-->
<li class="nav-item" v-if="bankIsActive"> <li class="nav-item" v-if="bankIsActive">
<a class="nav-link" href="javascript:" data-toggle="modal" data-target="#bankModal"> <a class="nav-link" href="javascript:" data-toggle="modal" data-target="#bankModal">
Bank <i class="fas fa-piggy-bank"></i> Bank <i class="fas fa-piggy-bank"></i>
@ -72,7 +72,29 @@
<!-- <button @click="endRound" v-if="roundActive">End round</button>--> <!-- <button @click="endRound" v-if="roundActive">End round</button>-->
<!-- </div>--> <!-- </div>-->
<!-- </div>--> <!-- </div>-->
<div class="row" v-if="initiated"> <div class="row">
<div class="col-md-12">
<button class="btn btn-light btn-lg" @click="startRound" v-if="!roundActive">
New round <i class="fas fa-play"></i>
</button>
<div class="form-group float-right">
<label>Money: {{ money }}</label><br/>
<label>Bet:</label>
<input class="form-control bet-input" v-model="bet" v-if="!roundActive">
<input class="form-control bet-input" v-model="bet" v-else disabled/>
</div>
<button class="btn btn-light btn-lg" @click="drawAnotherCard" v-if="roundActive">
Draw a card <i class="fas fa-hand-pointer"></i>
</button>
<button class="btn btn-light btn-lg" @click="pass" v-if="roundActive">
Stand <i class="fas fa-hand-paper"></i>
</button>
<button class="btn btn-light btn-lg" @click="endRound" v-if="roundActive">
Cancel round <i class="fas fa-stop"></i>
</button>
</div>
<div class="col-md-12 hand"> <div class="col-md-12 hand">
<h4>Dealer <h4>Dealer
<template v-if="!roundActive">({{ dealerScore }})</template> <template v-if="!roundActive">({{ dealerScore }})</template>
@ -92,11 +114,6 @@
</div> </div>
</div> </div>
</div> </div>
<div class="row" v-else>
<button class="btn btn-light btn-lg" @click="startRound">
New round <i class="fas fa-play"></i>
</button>
</div>
</div> </div>
<div class="modal fade" id="bankModal" tabindex="-1" role="dialog" aria-labelledby="bankModalLabel" aria-hidden="true"> <div class="modal fade" id="bankModal" tabindex="-1" role="dialog" aria-labelledby="bankModalLabel" aria-hidden="true">

25
js/app.js
Unescape View File

@ -12,10 +12,11 @@ let app = new Vue({
handScore: 0, handScore: 0,
dealerScore: 0, dealerScore: 0,
status: '', status: '',
bet: 0,
bankIsActive: false, bankIsActive: false,
bank: 0, bank: 0,
money: 0, money: 5000,
toBank: 0, toBank: 0,
toMoney: 0, toMoney: 0,
username: null, username: null,
@ -132,6 +133,13 @@ let app = new Vue({
}, },
startRound() { startRound() {
if (this.bet > this.money) {
alertify.notify('Not enough money for bet.');
return false;
}
this.money -= this.bet;
this.initiated = true; this.initiated = true;
this.endRound(); this.endRound();
@ -164,9 +172,11 @@ let app = new Vue({
if (this.dealerScore === this.handScore) { if (this.dealerScore === this.handScore) {
this.roundActive = false; this.roundActive = false;
alertify.notify('Draw!'); alertify.notify('Draw!');
this.draw();
} else if (this.dealerScore > 22) { } else if (this.dealerScore > 22) {
this.roundActive = false; this.roundActive = false;
alertify.notify('Dealer is plus, you win'); alertify.notify('Dealer is plus, you win');
this.win();
} else if (this.dealerScore > this.handScore) { } else if (this.dealerScore > this.handScore) {
this.roundActive = false; this.roundActive = false;
alertify.notify('Dealer Wins'); alertify.notify('Dealer Wins');
@ -176,10 +186,19 @@ let app = new Vue({
this.pass(); this.pass();
} else if (this.handScore > this.dealerScore && this.handScore < 22) { } else if (this.handScore > this.dealerScore && this.handScore < 22) {
this.roundActive = false; this.roundActive = false;
alertify.notify('You win!'); alertify.notify('You win ' + this.bet * 1.5 + '!');
this.win();
} }
}, },
draw() {
this.money += this.bet;
},
win() {
this.money += this.bet * 2;
},
endRound() { endRound() {
this.roundActive = false; this.roundActive = false;
this.lastCard = null; this.lastCard = null;
@ -204,7 +223,7 @@ let app = new Vue({
vue.$forceUpdate; vue.$forceUpdate;
if (Number(vue.bank) <= Number(0)) { if (Number(vue.bank) <= Number(0)) {
// Removed default money here if bank empty / dead vue.money = 5000;
} else { } else {
alertify.notify('Welcome back, ' + vue.username + '!', 'custom') alertify.notify('Welcome back, ' + vue.username + '!', 'custom')
} }

Write Preview
Loading…
Cancel
Save