Panda 2 development

[enpu]

colision: function(opponent){    console.dir(arguments);    console.log('Colision!!!');    //opponent.eliminar();    return true;},

opponent is not reference to Heroe class, it's the body that you are colliding with. So you can't call opponent.eliminar, because there is no eliminar function in Body

[goide]

game.module(    'game.main').body(function() {game.addAsset('panda.png');game.addAsset('coin.png');game.createClass('Panda', 'Sprite', {		interactive: true,	mouse: {x:100, y: 100},		init: function(x, y){		this._super('panda.png', x, y, {anchor: { x: 0.5, y: 0.5 }});		this.position = {x: x, y: y};		//body        this.body = new game.Body({            position: { x: x, y: y },            velocityLimit: { x: 150, y: 150 },            velocity: {x:-100,y:-50},            collisionGroup: 1,            collideAgainst: 0,            mass: 0        });        this.body.collide = this.collide.bind(this);        this.body.addShape(new game.Rectangle(60, 60));		//add sprite to scene        game.scene.addObject(this);        //add body of this sprite to the world object        game.scene.world.addBody(this.body);        //add sprite to display container        game.scene.stage.addChild(this);	},	    collide: function(opponent) {		console.dir(arguments);		console.log("Collision!");		opponent.remove();        return true;    },    update: function(){		this.position.x = this.body.position.x;		this.position.y = this.body.position.y;        this.body.velocity.x = (this.mouse.x - this.body.position.x);        this.body.velocity.y = (this.mouse.y - this.body.position.y);    },    remove: function() {        game.scene.removeObject(this);        game.scene.world.removeBody(this.body);        game.scene.stage.removeChild(this);    },        mousemove: function(e) {		this.mouse.x = e.global.x;		this.mouse.y = e.global.y;    }    });game.createClass('Coin', 'Sprite', {	init: function(x, y){		this._super('coin.png', x, y, {anchor: { x: 0.5, y: 0.5 }});		this.position = {x: x, y: y};		//body        this.body = new game.Body({            position: { x: x, y: y },            velocityLimit: { x: 300, y: 1000 },            velocity: {x:0,y:0},            collisionGroup: 0,            mass: 0        });        this.body.remove = this.remove.bind(this);        this.body.addShape(new game.Circle(10));		//add sprite to scene        game.scene.addObject(this);        //add body of this sprite to the world object        game.scene.world.addBody(this.body);        //add sprite to display container        game.scene.stage.addChild(this);	},    update: function(){		this.position.x = this.body.position.x;		this.position.y = this.body.position.y;    },    remove: function() {        game.scene.removeObject(this);        game.scene.world.removeBody(this.body);        game.scene.stage.removeChild(this);    }});game.createScene('Main', {    backgroundColor: 0xb9bec7,    init: function() {		this.world = new game.World(0, 0);				for(var i=0; i<10; i++){			coin = new game.Coin(Math.random()*game.system.width, Math.random()*game.system.height);		}		var panda = new game.Panda(300,200);    }});});

but if you look at the example that put this as such as what you send, look at the code example.

[Legomite]

Is there a way you can make playground work on mobile devices?

Also, great work on the panda engine! Is there a place were I can see everything new in this version? The features are splattered all over this.

[goide]

@enpu

 

You can make some examples of how the works Class Camera?

 

An example: http://phaser.io/examples/v2/camera/basic-follow

 

You could put it in the Playground of Panda 2.0.

 

thanks.

[goide]

@enpu

 

I'm trying to accomplish this example: http://phaser.io/exa...ra/basic-follow

 

http://vermeire.home.xs4all.nl/panda/fiddler.html, In the examples of the fiddler, I saw an example of using the camera in panda. 

 

Ok watching these videos, I think it will help you understand a little.

 

urrently the example in the fiddle, can only do this. ( https://dl.dropboxusercontent.com/u/62623895/Images/camera%20test/fiddle-1.webm )

 

Modify it and add a line of code, and reach that work like the example I want to make. the example is made of phaser. ( https://dl.dropboxusercontent.com/u/62623895/Images/camera%20test/fiddle-3.webm )

 

Ok when all good, but I'm working with the development version panda engine 2.0.0.

 

In this video, my code works as it is the code on the fiddle. to be more clear as the first video. ( https://dl.dropboxusercontent.com/u/62623895/Images/camera%20test/tests-1.webm )

 

As you saw in the second video, just add the line of code to add the camera to the scene, in my video I make the same.but it does not work, stop working even.

watch the video. ( https://dl.dropboxusercontent.com/u/62623895/Images/camera%20test/test-2.webm ).

 

Well, so far as you can see me the code does not work, do not know why.

 

but as you see, I worked as it was the first video.

 

Now this last line, which have added, in the second line, look at the video. ( https://dl.dropboxusercontent.com/u/62623895/Images/camera%20test/test-3.webm )

 

now it works as it is the example in the fiddle and the first video. but it does not work the way I want it to work.

 

the question is that if the code is the same, but is not working. and if you help me in this small, and that is the last part that I need to put to work the camera.

 

this is my code VS the code example of the fiddle

 

My code ( https://db.tt/mjeKLH0K ), Example Fiddle ( https://db.tt/Umnn20hn )

 

Thanks for your help.

[goide]

@enpu

 

In the end I finished reading the camera.js class, to make it work.

 

I understood many things, and I managed to work, hmm but a little flawed.

 

To make it work, create a container where the objects would be captured would create, that is a general container. sprite has its own container and container text and added them to the general sprite container.

this.camera = new game.Camera();this.camera.addTo(this.contenedorMundo); //Main container, is assumed that this should be the stage.this.camera.offset.set(game.width / 3, game.height / 2);this.camera.minX = 0; this.camera.minY = 0;this.camera.maxX = 2800;  this.camera.maxY = 1800;this.camera.setSensor(10,10);this.camera.setTarget(this.contenedor); //Container sprite.

I doubt this genre. if in a scene the stage is a container, I had to create one for it to work the camera.

 

And the other as you can see in the video, the camera moves either to the right and down, but the left and top do not function. ( https://db.tt/iUVXgXTA )

[oranjoose]

Is the TilingSprite class available yet? I downloaded the latest version of the develop fork, but when I try to instantiate a TilingSprite, I get a "TypeError: Cannot read property 'resolve' of null" console message. 

 

It fails on something like this: var bg = new game.TilingSprite('graphics/bgImage.png', 200, 300);

 

Am I somehow doing this wrong?

 

Thanks!

[goide]

@oranjoose

 

look at the following:

 

http://ekelokorpi.github.io/panda.js-site/engine/playground/#tilingsprite_basic

[oranjoose]

@goide

 

Thanks for the reply. Did you test this yourself? I've done that and it doesn't work on my end. 

 

enpu stated a few weeks ago (on page 9 of this thread) that TilingSprite was "almos[t] done" while providing a link to a working TilingSprite playground. Maybe it's still not quite done?

[goide]

@oranjoose

 

My test, TilingSprite works. 

 

Panda engine 2.0.0 (dev version)

 

[oranjoose]

Weird. I still can't seem to get it to work. Downloading the most recent version of the develop branch and using the exact code from the Playground with a panda.png downloaded in the root, it won't work.

 

Erasing "Tiling" to make it a normal Sprite works just fine. Having the "addAsset" function above also seems to make the load hang even when it's just the normal Sprite.

 

This is tested using Brackets and WebStorm's built-in local server on Windows 8 with Chrome and Firefox.

 

Not sure what I'm doing wrong.

[goide]

@oranjoose

 

When you download this development version, create the media folder, in this folder copy the image or sprite. whatever you want to call, and then you try it as this in the playground.

 

Watch this video, and examples of the playground: https://db.tt/bg6FnqFD

[Ninjadoodle]

Hi @enpu

 

Just a few things I found working with the latest dev version ...

 

1. I've noticed that when I setup a sprite and set it's alpha to 0, its hitArea doesn't seem to show at the co-ordinates given to it.

Instead it gets drawn in the top-left corner of the screen, until the sprite's alpha is more than 0.

 

2. Using the 'new game.Animation.fromFrames' function seems to throw frames out of order. This doesn't happen when I setup the animation manually.

 

3. .mouseupoutside and .touchendoutside don't work (aren't implemented?).

 

Thank you!

[oranjoose]

RE: TilingSprite issue

 

I got it to work by putting in the game.addAsset statement for the graphic file. Why is addAsset required for TilingSprite but not ordinary Sprite?

 

On a separate note, is there a convenient way to add physics to particles emitted, without having to create a custom particle class and custom emitter for those particles?

 

Thanks!

[LinkTree]

Hey Enpu, I haven't found any discussion about it and I really wanted to know if it is possible to stop event bubbling in panda? lets say I have a big sprite that is clickable and many small sprites on top which are also clickable. when I click on the small sprites I don't want the big sprite event handler to be fired. I had already tried event.stopPropagation() but it didn't stop the event from bubbling.

[enpu]

@LinkTree try returning true on your mousedown function, that should skip all next objects.

[LinkTree]

@enpu Thank you for the replay. I tried returning true but it still called the handler of the object below it.

 

I sent an example on github.

[enpu]

Masking should now work.

var sprite = new game.Sprite('sprite.png');sprite.addTo(this.stage);var mask = new game.Graphics();mask.drawRect(0, 0, 100, 100);sprite.mask = mask;

[Ninjadoodle]

Hi @enpu

 

Just wondering if you've had a chance to look at a few of the bug/issues I posted above? I'm only wondering in case you missed the post

 

Thank you!!!

 

Here is the list of issues I've found ...

 

- An object with alpha 0 does not seem to respond to mouse clicks.

 

- Using the 'new game.Animation.fromFrames' function seems to throw frames out of order. This doesn't happen when I setup the animation manually.

 

- .mouseupoutside and .touchendoutside don't work (aren't implemented?).

[enpu]

@Ninjadoodle

 

Sorry for the delay.

 

When object is not visible, renderer won't update it's transform. So if it's alpha is 0 before it's first time added to stage, it's transform never gets updated, and then mouse events won't work. In that case, you can try manually update it's transform (after it's added to stage or another container). sprite.updateTransform()

 

game.Animation.fromFrames uses the order in texture cache. Are you using sprite sheets? Do you have your frames in correct order in your JSON?

 

I just pushed update with mouseupoutside implemented. Let me know if you got any issues with it

[LinkTree]

@enpu are there plans to add sprite tinting? In the previous version I used it a lot for light effects where I could have one black and white sprite representing the lighting and tint it with whatever color I wanted on the fly and then set the blend mode of this sprite to ADD.

[Ninjadoodle]

Hi @enpu

 

No problem at all, I just wanted to check if you saw the list

 

I am using sprite sheets, Ill have to have a look and see if the frames in the JSON file are ordered.

 

Also, thanks heaps for the update and explanation!!

[finnmich]

I think I've discovered a bug in the TilingSprite on iOS (iPhone) mobile safari.

The tile dissappears after some time, and then reappears. You can see it in the tilingsprite example on the playground.

[Ninjadoodle]

Hi @enpu

 

I tried loading my game on iPad Air and all the graphics look completely messed up on screen.

 

Things work fine on iPhone 4s and iPhone5s, but on Galaxy S5 only the low res assets seem to be loaded (i have @4x enabled).

 

Not really sure whats causing this, just wanted to let you know

 

Thank you!

[LinkTree]

Hi @enpu

 

I wanted to ask what are the best practices for working with custom particles? I want to define a custom particle that will have a blending mode, an anchor point, expand outwards and rotate based on the emitter's rotation for example. I got something working but it's messy and seems a lot more complicated than it should be... I had to extend a few base game modules to get it to work.

 

Edit:

Ok I think I figured what the best way to do this is. you just need to re-define the game.Emitter.addParticle function to whatever you want your particle to do. so:

var emitter = new game.Emitter();emitter.addParticle = function(){    // -- your particular particle code});