We have prepared the game environment in the last example and decided the game logic should be the same as playing a real deck. It is time to code the JavaScript logic now:
Let's begin from our last matching game example. We have styled the CSS, and now, it is time to add the game logic in the
js/matchgame.js
file.The game is to match pairs of playing cards. We have 12 cards now, so we need six pairs of playing cards. Put the following code in the
js/matchgame.js
file. The array declares six pairs of card patterns:var matchingGame = {}; matchingGame.deck = [ 'cardAK', 'cardAK', 'cardAQ', 'cardAQ', 'cardAJ', 'cardAJ', 'cardBK', 'cardBK', 'cardBQ', 'cardBQ', 'cardBJ', 'cardBJ', ];
We aligned the cards in jQuery's
ready
function in the previous chapter. Now we need to prepare and initialize more code in theready
function. To do this, change theready
function into the following code. The changed code is highlighted here:$(function...