Search code examples
javascriptfunctionblackjack

Adding two functions together to make one value?

Hello amazing people of StackOverflow, I am trying to make a blackjack game using javascript. In my code I have two functions. These functions deal out a first card value when "deal" has been pressed and deals out a second card value when "Hit" has been pressed. How would I go about adding these two functions to add the value of both cards, so I can test if the player has gone over the value of 21? I appreciate the time you have spent reading this, thank you! Here is my code:

var score = 0;

var deck = ["ace", "ace", "ace", "ace", 2, 2, 2, 2, 3, 3, 3, 3, 4, 4, 4, 4, 5, 5, 5, 5, 6, 6, 6, 6, 7, 7, 7, 7, 8, 8, 8, 8, 9, 9, 9, 9, 10, 10, 10, 10, "jack", "jack", "jack", "jack", "queen", "queen", "queen", "queen", "king", "king", "king", "king"];

function deal() {
  var random = deck[Math.floor(Math.random() * deck.length)];
  document.getElementById('result').innerHTML = random;
}

function hit() {
  var random2 = deck[Math.floor(Math.random() * deck.length)];
  document.getElementById('result2').innerHTML = random2;
}

var time = new Date();
document.getElementById("time").innerHTML = time.toDateString();
#deal {
  position: fixed;
  width: 50px;
  height: 35px;
  top: 500px;
  left: 500px;
  background-color: silver;
  border-radius: 10px;
  border-style: ridge;
}
#hit {
  position: fixed;
  width: 50px;
  height: 35px;
  top: 500px;
  border-style: ridge;
  border-radius: 10px;
}
body {
  text-align: center;
  font-size: 30px;
  background: url("http://corporate.fortuna2000.be/imgs/background/red_poker3_xl.jpg");
}
#ace {
  position: absolute;
  top: 100px;
  left: 100px;
}
#time {
  position: absolute;
  top: 590px;
  right: 0px;
  border-style: solid;
  border-radius: 10px;
  background-color: silver;
}
<div id="result"></div>
<div id="result2"></div>
<div id="time"></div>
<input type="button" value="deal" onclick="deal()" id="deal">
<input type="button" value="hit" onclick="hit()" id="hit">

Solution

  • I got the number value total working, but I didn't get the suit, dealer, or turns done yet. Since you requested for only the former, this should suffice.

    I used splice to remove played cards from the deck, renamed the cards so they were easier to parse (I used radix 16 (hexidecimal) so 'a'=10 and 'b'=11) the number values.

    var score = [];
var status;
var deck = ['c-b', 'h-b', 'd-b', 's-b', 'c-2', 'h-2', 'd-2', 's-2', 'c-3', 'h-3', 'd-3', 's-3', 'c-4', 'h-4', 'd-4', 's-4', 'c-5', 'h-5', 'd-5', 's-5', 'c-6', 'h-6', 'd-6', 's-6', 'c-7', 'h-7', 'd-7', 's-7', 'c-8', 'h-8', 'd-8', 's-8', 'c-9', 'h-9', 'd-9', 's-9', 'ct-a', 'ht-a', 'dt-a', 'st-a', 'cj-a', 'hj-a', 'dj-a', 'sj-a', 'cq-a', 'hq-a', 'dq-a', 'sq-a', 'ck-a', 'hk-a', 'dk-a', 'sk-a'];
var handCards = document.getElementById('hand');
var handScore = document.getElementById('score');
var hitMe = document.getElementById('hit');

function deal(x) {
  x = parseInt(x, 10);
  if (!x) {
    var y = 1;
  } else {
    y = x;
  }

  console.log('y: ' + y);
  var suit = '';
  var hole = 0;
  var total = 0;
  for (var i = 0; i < y; i++) {
    var idx = Math.floor(Math.random() * deck.length);
    var card = deck[idx];
    deck.splice(idx, 1);
    suit = sortCard(card);
    console.log('card: ' + card);
    var num = card.split('-').pop();
    if (num === 'b') {
      hole++;
    }
    console.log('hole: ' + hole);
    console.log('num: ' + num);
    var val = parseInt(num, 16);
    console.log('val: ' + val);
    score.push(val);
    console.log('score: ' + score[i]);
    total = score.reduceRight(function(a, b) {
      return a + b;
    });
    console.log('total: ' + total);
  }

  handCards.value = suit;
  handScore.value = total;
  if (total > 21 && hole < 1) {
    status = 'bust';
  } else if (total > 21 && hole > 0) {
    hole = hole - 1;
    total = total - 10;
    status = 'prompt';
  } else if (total < 21) {
    status = 'prompt';
  } else if (total === 21) {
    status = 'stay';
  } else return false;

  session(status);
}
var sortCard = function(card) {
  var face = [];
  for (var j = card.length; j < 0; j--) {
    var ch = card.charAt(j);
    console.log('ch' + j + ': ' + ch);
    switch (ch) {
      case 'b':
        kind = 'Ace of ';
        break;
      case 'k':
        kind = 'King of ';
        break;
      case 'q':
        kind = 'Queen of ';
        break;
      case 'j':
        kind = 'Jack of ';
        break;
      case '2':
        kind = 'Two of ';
        break;
      case '3':
        kind = 'Three of ';
        break;
      case '4':
        kind = 'Four of ';
        break;
      case '5':
        kind = 'Five of ';
        break;
      case '6':
        kind = 'Six of ';
        break;
      case '7':
        kind = 'Seven of ';
        break;
      case '8':
        kind = 'Eight of ';
        break;
      case '9':
        kind = 'Nine of ';
        break;
      case 't':
        kind = 'Ten of ';
        break;
      case 'c':
        kind = 'Clubs';
        break;
      case 'h':
        kind = 'Hearts';
        break;
      case 'd':
        kind = 'Diamonds';
        break;
      case 's':
        kind = 'Spades';
        break;
      case '0', '-', 'a', '1':
        break;
    }
    face.push(kind);
    console.log('face: ' + face);
  }
  suit = face.join();
  return suit;
}

function session(status) {
  var dTotal = 0;
  var msg = document.getElementById('msg');
  var hit = document.getElementById('hit');
  var stay = document.getElementById('stay');
  if (status === 'bust') {
    msg.value = total + " Busted!";
    hit.setAttribute('disabled', true);
  } else if (status === 'prompt') {
    msg.value = total + " Stay or Hit?";
  } else if (status === 'stay') {
    msg.value = 'Dealer has ' + dTotal;
    hit.setAttribute('disabled', true);
  } else return false;
}



deal('2');
    html {
  box-sizing: border-box;
  font: 400 16px/2"Trebuchet MS";
  height: 100vh;
  width: 100vw;
}
*,
*:before,
*:after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  border: 0 solid transparent;
  outline: 0;
  text-indent: 0;
}
body {
  height: 100%; width: 100%; background: #000; color: #FFF; position: relative; text-align: center; font-variant: small-caps; background: url("http://corporate.fortuna2000.be/imgs/background/red_poker3_xl.jpg"); }
  #hit, #stay {
    position: absolute;
    width: 50px;
    height: 35px;
    border: 1px ridge #633;
    border-radius: 6px;
    top: 50%;
    background: #933;
  }
  #stay {
    left: 35%;
  }
  #hit {
    right: 35%;
  }
  input {
    line-height: 2;
    cursor: pointer;
    border: 1px solid #F93;
    border-radius: 8px;
    bacground: #900;
    color: #F90;
  }
  #msg {
    line-height: 3;
    background: #600;
    color: #FC3;
    font-size: 2rem;
    border: 2px solid #FC3;
    border-radius: 8px;
    margin: 0 auto;
    text-align: center;
  }
    <input id="msg">
<br/>
<br/>
<label for="hand">Hand:</label>
<input id="hand">
<br/>
<br/>
<label for='score'>Score:</label>
<input id="score">
<br/>
<br/>
<input type="button" value="Hit" id="hit" onclick="deal(1);return false;">
<input type="button" value="Stay" id="stay" onclick="session('stay');return false;">