Drop objects between different scenes?

How would you handle dragging one object onto another if they are in different scenes?
It is required to drop one object on another so that the event of ondrop can be called.

I need two scenes, because the phaser does not ignore the zooming of objects along with their scroll factor.

If I used two cameras, then I would have to seriously rework all the game logic, which I would like to avoid, since it would take a lot of time.

I would think you may need to fake this because each game object lives in its scene. You can communicate across scenes (Communicate between scenes so you drag a game object across the scene and you destroy it when its middle touches the edge of the scene. Then you communicate the height level of where it was destroyed and what the game object was to the other scene, which immediately creates it and adds it right where the old game object was and continues the dragging to its final location. I am not sure if you will be able to use the actual drag-and-drop functionality as I don’t know if you can start and stop the process that way. You may have to code it all from scratch, sync the game object with the mouse/finger yourself and then test for a drop zone yourself.

There may be a better way to do this. Maybe there is some functionality I am not aware of that would allow you to use the actual drag-n-drop feature between scenes. Or maybe there is a better strategy all together. But this would be how I would approach this problem.

Hey, thx for the Reply.

I don’t understand, why scrollFactor mean x and y factor, and does’nt mean z axis (see zooming). It’s so logicly - scrollFactor(x,y,z)… ok, nwm.

Why it’s so many traps with phaser…

I think it works that way because in 2D games, “scrolling” typically means in the X and Y dimensions while movement through the Z axis is considered “zooming”. They typically have to be handled in entirely different ways in most traditional 2D games. In 3D games, even though it isn’t typically called “scrolling”, you do handle movement through all 3 axes in the same way.

ok, scrollFactor(x,y,ZOOM).

Ok, i will try to realize this functionality, and what i think this moment.

I have a Pen, i have an apple… stop :slight_smile:

I have SceneMain.input.activePointer.worldX
SceneMain.input.activePointer.worldY
cam._scrollX
cam._scrollY
cam._zoom
object.width
object.height
object.x
object.y

i think, when i drop object i can calculate a point of droping between scenes relying on all the above variables.
When it;s works fine, i will report about this.

I think using two cameras in one scene would be simpler than using two cameras in two scenes.

1 Like

The problematic stay in field of concept my game. When i will using two container, then i can’t controll object ordering!
I move player around a scene, and they z-ordering is Grid Y coordinate!
Container does not allow adjusting the order parameter, only globally moveback and moveontop.

Each object on the scene has its own group, of course I could make a function that, through iteration, would add ignore for a specific camera, but wouldn’t this result in a performance problem?

It turns out that every object on the scene that is outside the inventory will be ignored by camera 2, and everything that is inside the inventory will be ignored by camera 1.

Maybe emitter can help solve my problem?

And so, after several days of trying in various ways to make the phaser work with an inventory from which you can drop objects to other objects that are on the stage, I came to the understanding that the phaser has fundamental problems in this regard.

Initially, my inventory was in a different scene, and when I tried to transfer objects from the inventory to the second scene, they simply did not lead to anything (another scene refuses to see the drop events, etc.).

Then I followed the advice to create two cameras, and separate objects by ignoring. But what is interesting, in this case, the drop events also do not work, that is, if your object is in the inventory and the scene camera ignores it, then in this case the objects that are on the scene simply do not see the objects that are in the inventory ( are ignored by the main camera).

At the same time, if I remove the ignoring of the object by the scene camera and the interface camera, everything will work, but this is simply not an option.

In general, all this is upsetting.

Hi,
If the sceneB refuses to detect the drop from sceneA, perhaps you can fake it with a tranparent image(or a zone, etc) that catch the drop, and then emit from sceneA to sceneB. It’s just an idea…

Okay, okay, okay …
I found a crutch method that can probably help solve this issue quite simply.

scene1.input.on ('dragend', function (pointer, obj) {
  scene2.input.once("gameobjectover",function(pointer,obj){
      console.log(obj.name);
   })
 scene2.time.addEvent({
delay: 0.1,
callback: function(){
	scene2.input.off("gameobjectover");
   }
});
})

You have to use timer then, to remove this once event in <1ms, when no object over pointer jet, or this event will be triggered later, when pointer will be over an game object.

Stupid but workable method.

Some time after I found what I thought was a working method, I noticed that it does not always work.

As a result, I spent some more time, and came to the most correct solution in my opinion.

The fact is that the engine processes the active pointer based on the object under it. If you have any object that is tied to any scene, then at the moment this object is under the pointer, it will return the coordinates of the scene to which this object belongs.

(scene_game.input.activePointer.worldX) - will not return the cursor position of the “scene_game” located under the object from “scene_inventory”, even if you pass a link to this “scene_game”. As long as the cursor is over an object of a “scene_inventory”, it always returns the active pointer to the coordinates of this active scene!

Let’s say you move an object to the “scene_game” from the “scene_inventory”.
The object you are moving the cursor is in scene_inventory, and you need to move it to “scene_game”.

First, I define the position of the inventory, and if the object goes beyond its scope, then I transfer the certain variable to the scene / inventory mode.

Further, after we release the object and the “dragend” function is triggered.

1 - then “drag_object” must be destroyed (after which “scene_game” will appear under the pointer).
2 - Next, I create a timer that is triggered immediately after the object is deleted, which creates an event for “scene_game”.
3 - This timer will work approximately 10ms after the destruction of the object. You can iniziate a user trigger ON_OBJECT_DESTROY, but i suspect - it’s does’nt work.

Now in the coordinates of the cursor there will be “scene_game” with a real “worldX” coordinate.

Next, we need a simple rectangle collision math function.

   drag_obj.destroy();
    game_scene.time.addEvent({
    	delay: 10,
    	callback: function(){
    		var a={
    			x:game_scene.input.activePointer.worldX,
    			y:game_scene.input.activePointer.worldY,
                //it's cane be drag_obj.width and height (don't forgeth about origin like below)
    			width:5,
    			height:5						
            }
    		var b = {
    			//game_scene obj origin_x 0.5
    			x:game_scene_ob.x-game_scene_obj.displayWidth/2,
    			//game_scene obj origin_y 1
    			y:game_scene_obj.y-game_scene_obj.displayHeight,
    			//we have to consider a scale of object
                width:game_scene_obj.displayWidth,
    			height:game_scene_obj.displayHeight
    		}
    		if (a.x < b.x + b.width &&   a.x + a.width > b.x && a.y < b.y + b.height && a.y + a.height > b.y) {
    			console.log("Collision");
    		}
    	}
    });

But before the function starts detecting collisions, we need to place the objects in a group that will show which objects require collision handling.

I put the game objects in the drag group.
Then you have to search for the objects from group “drag”, and using collision function to detect collision of dropped “inventory_objects” with a “game_scene” objects.

Now, every time an object falls on the scene, I iterate over the objects in the drop group, and check for collisions.

This method allows you to catch the intersection of even those objects that are behind other objects. There can be an unlimited number of them. Next, you need a function that will determine what to do if this or that object has intersected.