Sorting arrays in PlayCanvas' JS API

I am very close to finishing ETA’s initiative functionality. However, one tough hurdle stands in my way. I’m not sure how to sort the initiative rolls from highest to lowest! I found this tutorial on W3Schools.com that I’m using to try and order an array of the four initiative scores, but I think the generic JS used by W3Schools is different from PC’s JS. So it isn’t really working.

W3Schools’ example:

My implementation:

image

Here is the ETA Launch, and here is the relevant script.

Looking at the first image, you are assigning the rolls to a function scope variable (var rolls)

Looks like you wanted to assign a new property to the pc.Script instance so change it to this.rolls = [/*etc etc etc*/]

For reference, PlayCanvas is written in ES5 JS standard so any JS code that can run in the browser will work in PlayCanvas.

I don’t think I understand your second sentence. Do you mean like this: image

I’m on my phone at the moment.

Can you post the images of code as text in the forums please?

My bad, man.

// assigns tokenInitMods equal to the current Token_Init_Mod UI texts
goldTokenInitMod = parseInt(goldTokenText, 10);
cyanTokenInitMod = parseInt(cyanTokenText, 10);
magentaTokenInitMod = parseInt(magentaTokenText, 10);
greenTokenInitMod = parseInt(greenTokenText, 10);

// generates initiative rolls for each tokenUI
goldTokenInitRoll = (pc.math.random(1, 21) + goldTokenInitMod).toFixed(0);    console.log(goldTokenInitRoll);
cyanTokenInitRoll = (pc.math.random(1, 21) + cyanTokenInitMod).toFixed(0);    console.log(cyanTokenInitRoll);
magentaTokenInitRoll = (pc.math.random(1, 21) + magentaTokenInitMod).toFixed(0);    console.log(magentaTokenInitRoll);
greenTokenInitRoll = (pc.math.random(1, 21) + greenTokenInitMod).toFixed(0);    console.log(greenTokenInitRoll);

// place the rolls in an array
var rolls = [goldTokenInitRoll, cyanTokenInitRoll, magentaTokenInitRoll, greenTokenInitRoll];
// call the position function to order the rolls from greatest to least
console.log(rolls);
this.Position();
console.log(rolls);

// print the initRolls to the initiative tracker
this.app.root.findByName("Track_1st_Place_Txt").element.text = rolls[0];
this.app.root.findByname("Track_2nd_Place_Txt").element.text = rolls[1];
this.app.root.findByName("Track_3rd_Place_Text").element.text = rolls[2];
this.app.root.findByname("Track_4th_Place_Text").element.text = rolls[3];

// disable this UI
// this.app.root.findByName("Init_Button").script.initTracker.deSelect();
this.app.root.findByName("Initiative_Gen_Group").enabled = false;
// enable the init tracker UI and bring it into frame
this.app.root.findByName("Init_Track_Group").enabled = true;
this.app.root.findByName("Init_Track_Group").setPosition(0, 0, 0);

};

// a function for ordering initRolls
InitRoller.prototype.Position = function() {
// orders the initiative rolls from first to fourth (descending order)
this.rolls = [this.rolls.sort(function(a, b){return b-a;})];
};

Console logging has revealed that all the script before calling this.Position(); works just fine.

Nevermind, I got it. Thanks for letting me bounce ideas off you!

EDIT: This was the only change I had to make to the Position() function:
// a function for ordering initRolls
InitRoller.prototype.Position = function(tokens) {
// orders the initiative rolls from first to fourth (descending order)
tokens = [tokens.sort(function(a, b){return b-a;})];
};

Note the square brackets on the “tokens” re-assignment line.

1 Like