djmblog.com

The making of djmblog blackjack

by Dan McKeown

Dennis Ritchie playing card

When I started working on the code for the djmblog.com blackjack game, I considered the different elements that interact to make it up: the deck of cards, the players, and the game mechanics which include dealing, drawing cards and scoring hands. Since the dealer is an opposing player as well I eventually added the idea of a player instruction set for it. In practice the game mechanics and dealer are built by the site's implementation of the core cards.js. The cards.js code contains the JavaScript classes deck, player, matchup and blackjack. Of those, matchup and blackjack are the ones that a programmer building a game would need to use. As outlined in this sample code, only two lines are needed to start up a game: creating a matchup with the players' names, and creating a blackjack [game] with that matchup as a parameter.

var a = new matchup('victor','emile');

var b = new blackjack(a);

Using just these commands will get a game going, and the blackjack class has methods for scoring hands and drawing new cards. So in order to make the graphical version of the game for this site, I had to come up with some JavaScript to translate the text data about the card "ace of spades" into the appropriate file name "aceofspades.jpg" for display and I had to create a user interface with a set of event listeners for the game buttons so it would respond to user interaction. With many options available to do this, in this case I built my game around jQuery events, wiring the UI up so that each button carries out a specific task when pressed, so the user can choose to "deal," "hit," and "stand." In addition, each event had to trigger a scoring assessment that might lead to a conclusion about the game (win, lose, bust, etc.) as well as a decision about what to do for the dealer.

The dealer needs to draw the right amount of cards, at the right point in time. So in effect the dealer instruction set is organized inside functions that are run when the jQuery events fire; so for example the number of points at which the dealer decides to stand is set in that code.

When I had the code that implements the core cards.js game code working fairly well, I went back and made a few edits to the cards.js file. Some of these were bug fixes but in addition to that I decided that since the card deck doesn't change (a secondary deck of the same size keeps track of whether cards have been dealt or not) I would change the data structure used to hold the deck from a typical JavaScript array to an Immutable.js List.

Check out the console blackjack code on GitHub.


featuring screencasts


joeypc: a JS color/randomness tool by Dan McKeownfree WordPress theme

parallax WordPress theme


eagle float in Independence Day parade
carousel WordPress theme


Ryukyu front-end framework


DJMcloud Podcast


nText
Mac text editor


apple picking in Washington


Crossing the Continental Divide: a novel by Dan McKeown
read my novel