question about constructor and extending group

[espace]

hi, how do you access the sprite number 2 in this case ?

https://jsfiddle.net/espace3d/sncxypzz/

 

var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload:preload, create: create });

function preload() {
   game.load.image('circle', 'https://s13.postimg.org/xjhlzmiev/disc_png.png');
   game.load.image('rect', 'http://s10.postimg.org/6fa6mgrd5/motif.jpg');
}
//E for external module
var E = E || {}

MonsterGroup = function (game, image, action) {

    Phaser.Group.call(this, game);

    for (var i = 0; i < 3; i++)
    {
        var sprite = this.create(game.world.randomX, game.world.randomY, image);

        if (action == 'bounce')
        {
            game.add.tween(sprite).to({ y: sprite.y - 100 }, 2000, Phaser.Easing.Elastic.Out, true, 0, 1000, true);
        }
        else if (action == 'slide')
        {
            game.add.tween(sprite).to({ x: sprite.x + 200 }, 4000, Phaser.Easing.Elastic.Out, true, 0, 1000, true);
        }

    }

};

MonsterGroup.prototype = Object.create(Phaser.Group.prototype);
MonsterGroup.prototype.constructor = MonsterGroup;

E=E || {}

function create() {
    customGroup1 = new MonsterGroup(game, 'rect', 'bounce');
//this don't work 
  //  customGroup1.sprite[2].scale.x=.5
}

[samme]

You can use

group.getChildAt(2)
// or
group.children[2]

 

[espace]

Thanks, but if i want to attach different elements to this group (sprite and circle in this case), how do you recognize them and acces them?

https://jsfiddle.net/0cuku02e/

var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload:preload, create: create });

function preload() {
   game.load.image('circle', 'https://s13.postimg.org/xjhlzmiev/disc_png.png');
   game.load.image('rect', 'http://s10.postimg.org/6fa6mgrd5/motif.jpg');
}
//E for external module
var E = E || {}

MonsterGroup = function (game, image,image2) {

    Phaser.Group.call(this, game);

    for (var i = 0; i < 3; i++)
    {
        var sprite = this.create(game.world.randomX, game.world.randomY, image);
		var circle = this.create(game.world.randomX, game.world.randomY, image2);
        

    }

};

MonsterGroup.prototype = Object.create(Phaser.Group.prototype);
MonsterGroup.prototype.constructor = MonsterGroup;

E=E || {}

function create() {
    customGroup1 = new MonsterGroup(game, 'rect','circle');
}

 

[espace]

Nobody ?

[drhayes]

If you know which sprite you need to reference, why not keep a reference to it directly? Like this.circle1 or this.circle2?

[espace]

hi, but sorry i don't see how ...because

sprite is not defined

or sprite1 is not defined

or sprite[1] is not defined

https://jsfiddle.net/espace3d/xajfLbmq/

 

[drhayes]

Inside your loop you could do something like "this['sprite' + i] = this.create..." and then you'd have access to them. Or, unroll the loop and give each one a real name like "this.cat = " or "this.dog = ".

[espace]

i achieve like this :

https://jsfiddle.net/espace3d/p926traa/

but when i do this.sprite my sprite have only one position and not random position

how do you do with "this" ?

sorry for this noob question.

var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload:preload, create: create });

function preload() {
   game.load.image('circle', 'https://s13.postimg.org/xjhlzmiev/disc_png.png');
   game.load.image('rect', 'http://s10.postimg.org/6fa6mgrd5/motif.jpg');
}
//E for external module
var E = E || {}
var sprite={}
var circle={}
MonsterGroup = function (game, image,image2) {

    Phaser.Group.call(this, game);

    for (var i = 0; i < 10; i++)
    {
        sprite[i] = this.create(100+i, game.world.randomY, image);
// don't work        
//this.sprite[i] = this.create(100+i, game.world.randomY, image);        
sprite[i].scale.setTo(.2,.2)
				circle[i] = this.create(game.world.randomX, game.world.randomY, image2);
    }
};

MonsterGroup.prototype = Object.create(Phaser.Group.prototype);
MonsterGroup.prototype.constructor = MonsterGroup;

E=E || {}

function create() {
    customGroup1 = new MonsterGroup(game, 'rect','circle');
    customGroup1.alpha=1
    sprite[1].alpha =.2
}

 

[espace]

Anybody ?

[drhayes]

Once you create a sprite by saying "this.sprite[0]" or "this.sprite[1]" you have to keep using "this" when you refer to it. And you have to define an empty array before the loop, like "this.sprite = [];".

[espace]

solved thanks

https://jsfiddle.net/8ujhhowb/

[espace]

difference in time prototype vs normal solution !

prototype : minuteur démarré_display:80
prototype : 2.53 ms_display:84
normal : minuteur démarré_display:86
normal : 2.92 ms

>> 15% more fast for prototype

https://jsfiddle.net/htqsso8x/

var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload:preload, create: create });

function preload() {
   game.load.image('circle', 'https://s13.postimg.org/xjhlzmiev/disc_png.png');
   game.load.image('rect', 'http://s10.postimg.org/6fa6mgrd5/motif.jpg');
}
//E for external module
var E = E || {}
//var sprite={}
var circle={}
MonsterGroup = function (game, image,image2) {

    Phaser.Group.call(this, game);
		this.sprite=[]
    for (var i = 0; i < 5; i++)
    {
       this.sprite[i] = this.create(100+i, game.world.randomY, image);
       this.sprite[i].scale.setTo(.2,.2)

        

    }
//return sprite
};

MonsterGroup.prototype = Object.create(Phaser.Group.prototype);
MonsterGroup.prototype.constructor = MonsterGroup;

E=E || {}

function create() {
console.time("prototype")

    customGroup1 = new MonsterGroup(game, 'rect','circle');

    console.timeEnd("prototype")
  	
    console.time("normal")
    var group1= game.add.group()
   	var sp={}
      for (var i = 0; i < 5; i++) {
      sp[i]= game.add.sprite(10,game.world.randomY,'rect')
      sp[i].scale.setTo(.1,.1)
      group1.add(sp[i])      
      }
 console.timeEnd("normal") 
}