Handling Multiple Update or Render Scripts

From Spherical
Jump to: navigation, search

Hi, so if you are wondering how to add multiple update or render scripts to your game you came to the right place. I'll teach you some good tricks to manage several update codes in a game.

--Radnen (talk) 06:23, 4 March 2014 (UTC)

The Problem

We are trying to solve the multiple-update-script problem. This is a very early and common problem with new Sphere users. Say you have a tile movement update script that runs in a SetUpdateScript. Then you also have a screen fade effect that you wrote, and it also uses the update script. You try this, and get nowhere:


Only to see that the last item in the list is what runs. This is because SetUpdateScript or SetRenderScript overwrite the last script used. What we need then is a way to manage all these updates.

Method 1 (Beginner): the long-ass string

Since SetUpdateScript takes a string we can conceivably tack on everything as one long string.

SetUpdateScript("tile_mover.update(); fader.update(); something_else();"); // only once!

The only problem with this message is the string. It just gets longer and longer, which is not too pretty to look at. We can do better.

Method 2 (Beginner): the function

By far the simplest and easiest method is to make sure you use only one update function. This is accomplished by using one function and adding into it the other functions you are using.

SetUpdateScript("Update()"); // only once!

Then in Update you put all your other update scripts:

function Update() {

Method 3 (Intermediate): the manager

By far the smartest way is the manager. We can do some neat tricks. For one we can remove specific updates, and add or remove others at will. Even though this is called UpdateManager it works for the SetRenderScript too.

function UpdateManager() {
    this.updates = [];

// runs each update function you add to it:
UpdateManager.prototype.update = function() {
    for (var i = 0; i < this.updates.length; ++i) {

// creates a meta object with a name and a function:
UpdateManager.prototype.add = function(name, call) {
    this.updates[i].push({ name: name, call: call });

// searches for the update with the specified name and removes it
UpdateManager.prototype.remove = function(name) {
    for (var i = 0; i < this.updates.length; ++i) {
        if (this.updates[i].name == name) {
            this.updates.splice(i, 1);

To add an update we can contain them in lamda functions like so.

var MyUpdates = new UpdateManager();
MyUpdates.add("movement", function() { tile_mover.update(); });
MyUpdates.add("fader", function() { fader.update(); });
MyUpdates.add("other", function() { my_function(); });

We add the update manager like so:

SetUpdateScript("MyUpdates.update()"); // only once!

And at any time we can remove something if we no longer need it, such as the tile movement by saying MyUpdates.remove("movement");

That's it! If you are even more advanced you can continue with the manager and add priorities as well as other neat features, but this is the core gist of it.