drag and drop brings dragged element to front
This commit is contained in:
parent
874c5591d5
commit
6220f44cf0
2 changed files with 10 additions and 2 deletions
|
|
@ -1,3 +1,10 @@
|
||||||
|
import { Container } from "pixi.js";
|
||||||
|
|
||||||
|
let maxZIndex = 0; // heretic method to bring dragged sprite to the front,
|
||||||
|
// will technically overflow if you play long enough,
|
||||||
|
// it is also shitty because if you externally use zIndex on the sprites in the same container, it may not bring to front
|
||||||
|
// clean solution would be to make a draggable container class
|
||||||
|
|
||||||
function onDragMove(node, event, shift = { x: 0, y: 0 }) {
|
function onDragMove(node, event, shift = { x: 0, y: 0 }) {
|
||||||
// shift is a tuple representing the shift between the coords of the node and the pointer
|
// shift is a tuple representing the shift between the coords of the node and the pointer
|
||||||
const dragPoint = event.global;
|
const dragPoint = event.global;
|
||||||
|
|
@ -43,6 +50,7 @@ function onDragStart(node, onDrop, event) {
|
||||||
node.on("pointerupoutside", () => onDragEnd(node, onDrop));
|
node.on("pointerupoutside", () => onDragEnd(node, onDrop));
|
||||||
node.parent.eventMode =
|
node.parent.eventMode =
|
||||||
node.parent.eventMode == "dynamic" ? "dynamic" : "static";
|
node.parent.eventMode == "dynamic" ? "dynamic" : "static";
|
||||||
|
node.zIndex = ++maxZIndex;
|
||||||
const dragShift = node.parent.toLocal(event.global.clone(), null);
|
const dragShift = node.parent.toLocal(event.global.clone(), null);
|
||||||
dragShift.x -= node.x;
|
dragShift.x -= node.x;
|
||||||
dragShift.y -= node.y;
|
dragShift.y -= node.y;
|
||||||
|
|
|
||||||
|
|
@ -100,10 +100,10 @@ function switchToGame(gameContainer, newGame) {
|
||||||
const fridge = new Fridge();
|
const fridge = new Fridge();
|
||||||
const smartMonday = new SmartMonday();
|
const smartMonday = new SmartMonday();
|
||||||
const cleanupHS = new CleanupHS(root.width, root.height);
|
const cleanupHS = new CleanupHS(root.width, root.height);
|
||||||
//gameContainter.addChild(fridge.gameContainer);
|
gameContainter.addChild(fridge.gameContainer);
|
||||||
//gameContainter.addChild(opinator.gameContainer);
|
//gameContainter.addChild(opinator.gameContainer);
|
||||||
//gameContainter.addChild(smartMonday.gameContainer);
|
//gameContainter.addChild(smartMonday.gameContainer);
|
||||||
gameContainter.addChild(cleanupHS.gameContainer);
|
//gameContainter.addChild(cleanupHS.gameContainer);
|
||||||
|
|
||||||
root.addChild(gameContainter);
|
root.addChild(gameContainter);
|
||||||
})();
|
})();
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue