Mouse/Touch Event bug with multiple stages one renderer

[wellcaffeinated]

I've found that stages lose interaction management when several are used with one renderer.

Steps to reproduce:

1. Create a renderer
2. Create a few stages with interaction enabled
3. Add event callbacks to the stages
4. Render first stage (eg with anim frame)
5. use events
6. Render next stage
7. use events
8. Render first stage again... events won't work

Here is a js fiddle demonstrating the bug: http://jsfiddle.net/wellcaffeinated/27fsywLn/

I'd love any advice for a workaround in the meantime... it's delaying my progress on a project... any help would be appreciated :)

[englercj]

You shouldn't be using multiple stages, one stage per renderer. If you need to group or show/hide different sprites, use a DisplayObjectContainer.

[wellcaffeinated]

Oh. Shame. Seemed like that's why the renderer was separated from the stage in this way. Wouldn't that be an ideal feature?

[wellcaffeinated]

Looking at the code there is also logic like this:

http://www.goodboydigital.com/pixijs/docs/files/src_pixi_renderers_webgl_WebGLRenderer.js.html#l159

// if rendering a new stage clear the batches..
    if(this.__stage !== stage)
    {
        if(stage.interactive)stage.interactionManager.removeEvents();

...implying multiple stages are expected.

[photonstorm]

To be fair if you'd copied in the next line of code it does actually say:

// TODO make this work

:)

I agree that Pixi seems set-up to allow you to swap between rendering Stages quite easily. Objects can change their stage reference easily for example and the renderer is decoupled from the Stage.

It does also appear to do quite a bit of house-keeping when rendering a new Stage (batch clearing, filter resets, etc) which may also imply it wasn't meant to do it simultaneously.

[wellcaffeinated]

My use-case is not one that requires 60FPS. I think a bit of housecleaning is fine for the benefit of being able to trade off stages. I can't imagine anyone expecting to switch between stages rapidly enough for it to be a problem.

Consider this both a bug report and feature request :)

[englercj]

@wellcaffeinated What feature do you get from swapping stages instead of using containers? I can't think of a case where containers wouldn't be a better choice.

[wellcaffeinated]

It's just easier maintenance.
With containers:

• Create a stage.
• Create 3 containers.
• set each container to be interactive
• set the hit area of the container to match the stage (and setup resize events to maintain this).
• Turn on and off the visibility of the containers when switching.

With stages

• Create three stages.
• Render one at a time.

[englercj]

set each container to be interactive
set the hit area of the container to match the stage (and setup resize events to maintain this).

Not necessary, you can do the interaction in the same manner you do with stage, just add it to the active container instead of directly to the stage.

In your example:

stage.mousedown = function(e){
     var c = new PIXI.Graphics();
     c.beginFill(0xcc0000, 0.6);
     c.drawCircle(e.global.x, e.global.y, 30);
     c.endFill();
     activeContainer.addChild( c ); //use the activeContainer instead of the stage
};

You are talking about a couple lines of code difference, not some huge maintenance burden. Plus having different container branches and not touching the root of the tree makes a lot more sense IMHO.

Its more like:

Containers

• Create stage
• Setup interactivity for single stage
• Create 3 containers
• Switch active container as necessary
• Render single stage

Stages:

• Create 3 stages
• Setup separate interactivity for 3 stages
• Switch active stage as necessary
• Render active stage

I see only a one step difference that is creating the containers, and you actually have less interactivity code by using a single stage (in your case).

[photonstorm]

You could also do some cool transition effects going from one displayobject to another :)

[GoodBoyDigital]

Stage is outta here for v3. This issue should no longer persist. Cheers all! 👍

[lock]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.