Button private exposed variable

#1 
var Button = pc.createScript('button');

Button.attributes.add('shift', {type: 'number'});

var self;
var jumpBy;
// initialize code called once per entity
Button.prototype.initialize = function() {
    self = this;
    
    jumpBy = self.shift;
    self.entity.button.on('click', this.onRelease, this); 
};



// update code called every frame
Button.prototype.update = function(dt) {
    
};

Button.prototype.onRelease = function () {
    self.app.fire('game:Next', jumpBy);
};

I’ve made a nice little button and exposed the jump param so i can control it externally.

however, i figured out that this variable is global

if I have few buttons in the scene and each has a different number, the value of the top-most button in the hierarchy will prevail and ALL buttons will be redefined to that value.

how can I create a value that will be different per instance?

#2

You have created two variables in global scope. This means that every script instance is using the same global variables.

You need to add the attribute jumpBy to the this object as mentioned in other threads.

#3

you mean jumpBy = self.shift; will change the value globally while this.jumpBy = self.shift; will change it locally?

#4

The bulk of the explanation is here: How do i edit the Create function to add params to constructor?

The corrected script is here:

var Button = pc.createScript('button');
Button.attributes.add('shift', {type: 'number'});

// initialize code called once per entity
Button.prototype.initialize = function() {
    this.entity.button.on('click', this.onRelease, this); 
};

Button.prototype.onRelease = function () {
    this.app.fire('game:Next', this.shift);
};