HTML and CSS Reference
In-Depth Information
to you if you have read those chapters. If you have not, it's especially a good idea to read
Chapter 2 , which covers drawing and shading objects drawn with paths.
Let's now take a quick look at the functions we have created in bsbingo.html .
The initLists() function
The first game-related function you will encounter is initLists() . For our simple game im-
plementation, we have created a single list of words based on some common business jargon.
The standardJargonList application scope variable will contain a single-dimension array
of words that will be placed randomly on the player's bingo card. We can add more types of
lists if we would like to target other types of jargon-speak, such as pure IT process-speak,
marketing-speak, or even sports- or geek-speak.
The initButtons() function
This function creates a grid of 25 TextButton instances, 85 pixels in width and 25 in height.
These are stored in the application scope buttons two-dimensional array so that they can be
accessed via the [row][column] syntax.
The initSounds() function
The initSounds() function needs to initialize only a single sound referenced in an HTML5
<audio> tag. Because we are targeting the iOS platform, we need to provide only a single
.mp3 -formatted sound. We do not need .ogg or .wav because we are not targeting any other
browsers. Here is the HTML5 <audio> tag:
<audio id= "clicksound" preload= "auto" >
<source src= "click.mp3" type= "audio/mpeg" //>
Your browser does not support the audio element.
The chooseButtonsForCard() function
This function creates a local array called tempArray and fills it with the contents of the
standardJargonList .Next,itrandomlychoosesanelementfromthe tempArray foreachof
the 25 row/column combinations on the bingo card. As it selects a word, it splices it from the
tempArray so that it cannot be selected again, leaving the card with no duplicates.
The drawScreen() function
This function loops through the buttons two-dimensional array and draws the initial 25 but-
tons with text onto the canvas.
Search WWH ::

Custom Search