Dealing Cards Array Simulation

Shows how to create an array of playing cards and deal randomly from the array.

by vzufelt

HTML

<input type="button" value="Deal Card" id="deal" />

CSS

.square1 {
  background: red;
  width: 50px;
  height: 50px;
  margin: 10px;
}
.square2 {
  background: blue;
  width: 50px;
  height: 50px;
  margin: 10px;
}
.square3 {
  background: green;
  width: 50px;
  height: 50px;
  margin: 10px;
}
.square4 {
  background: yellow;
  width: 50px;
  height: 50px;
  margin: 10px;
}
.square5 {
  background: purple;
  width: 50px;
  height: 50px;
  margin: 10px;
}

JavaScript

$('#deal').click(function () {
    dealCard(randomCard());
});

var cardsInDeck = new Array();
var numberOfCardsInDeck = 5;
//cardsInDeck[0] = square1;
//cardsInDeck[1] = square2;
//cardsInDeck[2] = square3;
//cardsInDeck[3] = square4;
//cardsInDeck[4] = square5;

function dealCard(i) {
    if (numberOfCardsInDeck == 0) return false;
    var square = document.createElement('div');
    x = Math.floor(Math.random() * numberOfCardsInDeck);
		square.className = 'square'+i;
		document.body.appendChild(square);
    removeCard(i);
}

function randomCard() {
   return Math.floor(Math.random() * numberOfCardsInDeck);  
}

function removeCard(c)
{
    for (j=c; j <= numberOfCardsInDeck - 2; j++)
    {
        cardsInDeck[j] = cardsInDeck[j+1];
    }
    numberOfCardsInDeck--;
}