Question

I’m working on a 3D learning-based game which mainly utilizes C++ and Javascript. I’m trying to design a notification system for when the player has information sent to their notebook.

I had a system set up, but the supervisor thinks it can be made better. This is where I need y’alls help!

The very basic way it went:

The player would do something that triggered information to be sent to the notebook. In the same method where this happened, I turned on the notification. The notification would then show up on the player’s screen by flashing two div’s of an image (making a blinking effect). When either one of these divs is clicked, it shows the player the notebook. Anytime the player views or exits the notebook, the notification is turned off.

Now here is the code I was using:

In the main GameState

int GameModeState::notify(int query)
{
    static int notified;
    if(query == 1)
    {
        notified = 1;
        return notified;
    }
    if(query == 2)
    {
        notified = 0;
        return notified;
    }
    else
    {
        return notified;
    }
}

In the GameState’s update function

// checks if the unviewed information notification needs to be on or off
if(notify(0) == 1) // supposed to be on
{
    mScreen->executeJavascript("notebookNotification(1);"); // turns it on
} else {
    int nothing = notify(2); // clears out notify to 0
    mScreen->executeJavascript("notebookNotification(0);"); // turns it off
}

In my JS

var intervalID; // Needed to turn off setInterval()
//Function takes in 0 to turn off notification, anything else turns it on
function notebookNotification(setting)
{
   if(setting == 0)
   {
      if(intervalID) {
        // clears the blinking darkContainer
        window.clearInterval(intervalID);
        intervalID = null;
    }
    // hides both of the images
    $("#lightNotificationContainer").hide();
    $("#darkNotificationContainer").hide();
}
else
{
    $("#lightNotificationContainer").show();
    if(!intervalID) {
        // "animates" the blinking of the notification; the darkContainer toggles on and off every second, and covers the lightContainer
        intervalID = window.setInterval('$("#darkNotificationContainer").toggle()', 1000);
    }
}
}

I would turn off the notification using GameModeState::notify(2)

Now, what would be a better system to use rather than this?

Answer 1

Algorithm Improvements

• Don’t use a static flag. Create an id system so that you can uniquely target a notification.
  • In C++ you could keep track of a variable that auto-increments whenever you make a new notification. The id could be #notification_# where # is the id you want. Then your notify function will send the id it wants to stop/start, as well as the parameter to start or stop it.
  • In JavaScript, you then embed the id from the creation of the interval in the tag. I’d recommend using .data(). That way you can turn it off.

---

JS Improvements (not much better, really)

• Use ===/!== istead of ==/!= in most cases. Also avoid truthy stuff if you can be more specific.
• Combined the hide notification into one query.

Code:

var intervalID; // Needed to turn off setInterval()
//function takes in 0 to turn off notification, anything else turns it on

function notebookNotification(setting) {
    if (setting === 0) {
        if (intervalID !== null) {
            // clears the blinking darkContainer
            window.clearInterval(intervalID);
            intervalID = null;
        }
        // hides both of the images
        $("#lightNotificationContainer,#darkNotificationContainer").hide();
    }
    else {
        $("#lightNotificationContainer").show();
        if (intervalID === null) {
            // "animates" the blinking of the notification; the darkContainer toggles on and off every second, and covers the lightContainer
            intervalID = window.setInterval('$("#darkNotificationContainer").toggle()', 1000);
        }
    }
}