How SAS Helped Me Make Our Best-Selling Educational Game: Part 2

Last time, I gave a bit about the requirements of a game to match the most synonyms in one minute, and how what I learned using SAS was a basis for several parts of the game. This activity is going into Making Camp Premium, which will be a paid version of our best-selling game, Making Camp Ojibwe. I don’t know if you can call it best-selling because you can download it for free, and Spirit Lake has been around longer so has more players, but Making Camp gets more new downloads each month than any of our other games. This is surprising since the game is written in JavaScript and we have other games made with Unity that have way cooler effects. Just goes to show you can’t predict perfectly what kids will like.

While you are waiting for me to finish this game, head to the app store and get Making Camp Ojibwe , free, for your iPad.

Now, back to the synonyms game.  We’d finished the timer, which, when it ended, showed your title points and a happy or sad image.

Okay, this first part is boring, just initializing a bunch of variables I will use later.

var thisone = 0;
var boxmove = 0;
var thisel;
var thesepts = 0;
var question ;
var correct = 0 ;


// This is the array of words. The first is displayed as the word to match ;
// The next three words are synonyms and the last four words are incorrect answers ;

var words = [
  ["large", "big","enormous","gigantic","awkward","introspective","sane", "bulbous"],
    ["fast", "rapid","quick","speedy","awkward","boring","dull", "bulbous"],
    ["fat", "stout", "thick", "overweight", "thin", "unprofitable", "sense", "dazzling"],
    ["bad", "terrible", "not good", "awful", "couch", "sad", "ugly", "usual"],
    ["angry", "mad", "furious", "livid", "happy", "simple", "connected", "personal"],
    ["tale", "story", "fable", "yarn", "hind leg", "hippo", "newspaper", "earnest"],
    ["little", "small", "tiny", "itty bitty", "large", "thoughtless", "sleek", "perturbed"],
    ["strange", "odd", "queer", "weird", "couch", "sad", "ugly", "happy"],
    ["rare", "uncommon","unusual","not typical","irate","musical","aromatic", "within"]
];

I need more rows in this array. If you feel creative and want to help a sister out, post a word and 3 synonyms in the comments. Getting back to SAS, I have used SAS arrays since they first came out and were implicitly indexed. In other words, it’s been a minute. If one-dimensional arrays were great, two-dimensional arrays were great-squared. Some people will tell you that JavaScript does not have two-dimensional arrays and rather, you have an array of arrays. To those people, I say, “Bah, humbug!”

Systematic Random Sampling Saves the Day

Alrighty, then, on to creating the synonym problem. Sometimes you can be too clever. My challenge was to make sure that the choices were put in random order so that the first 3 boxes weren’t always the correct answer. I went through a lot of possible solutions where I tried to splice the array to pull out a word randomly used, then pull another random choice from the shortened array, using the length attribute.

After all of that, I realized there was a really simple solution. Pull out a random number. Take that and the rest of the items in the row, then start at the beginning again. Systematic random sampling. Yep. Super simple. Every useful programming language on earth has a random number function, including SAS, of course. First, we randomly pull a row out of the array. Then, we start with the n+1 word in that array, when n is a random number between 1 and 7. (Look at qnum to see how we get that). We pull the word that is in the n+1 position in the row and assign it to the first box. Then, the next box gets the next word in order. When we get to the end of the row,  the next box will have the first synonym. So, if my random number is 5, the boxes for the choices are words # 5, 6, 7, 1 , 2, 3, 4 and boxes 4-6 are the correct answers.

Next, we have a

for (var i=1; i < 8; i++) {

some code

}

Really it is the exact same as

DO i = 1 to 7 ;

*** some code ;

END ;

After that, there are some IF- THEN – ELSE and assignment type statements. The only thing not really applicable to SAS is draggable function and appending some divs to the page.

I started this post writing about how everything in SAS made it easy for me to develop games using JavaScript but now that I think of it, it would work just as well the other way and if you know some JavaScript, learning SAS would be a piece of cake.  You can check out the code below. It’s getting late here in Santiago, Chile and I still want to call my infinitely patient husband back in California so I’ll pick up next time on scoring the answers right or wrong.

/* THIS CREATES THE PROBLEM.
A word is selected randomly from the array, then the start point in the list of synonyms is randomly selected.
This is systematic random sampling. The words are put in boxes for the divs starting with
the random number and when it gets to 7, it goes back to the beginning of the word list
(but after the word you are finding the synonym for, that's why you need the 1+ )
Divs that get the first 3 synonyms in the array are assigned a class of 'right'
and the others are assigned a class of 'wrongb'.
Draggable function is assigned to each of the choice boxes created.
If the choice is correct, the variable thisone is assigned the value of 1 when the box is dragged;
*/

function createProblem() {
    question = Math.floor(Math.random()* words.length);

    $("#segment2").text(words[question][0]);
    var qnum =1 +Math.floor((Math.random() * 7)) ; // Start at random number ;

    for (var i=1; i < 8; i++) {

        divid = "#div" + i ;
        var boxid = "#box" + i ;

        if (qnum < 4) {   $(divid).append('<div class="smallbox draggable right" id="' + boxid + '">'+ words[question][qnum] + '</div>');
        }
        else {  $(divid).
                   append('<div class="smallbox draggable wrongb" id="' + boxid + '">' + words[question][qnum] + '</div>');}

        $('.draggable').draggable({

            start: function (event, ui) {
                if ($(this).hasClass('right')) {
                    thisone = 1;
                    thisel = this;
                }
                else { thisone = 0; }
            }


        });
        if (qnum < 7) {qnum++;}
        else {qnum = 1; }

    }
}

// END CREATION OF WORD BANK PROBLEM ;