I make a little test for drag and drop where I want to add some shadow to an image when I start dragging and remove the shadow when dragging ends.
https://www.bolleboos.be/experiments/dragdrop/
This seems to work using the pressdown and pressup events but the events don't always dire.
tile1 is a part of the image "de_emmer-min.jpg" and if you do a slow press-drag-release then everything works fine, but if you do a very quick iteration where you click-move-release in a fraction of a second, then the drag movement is done, but the event doesn't fire and the shadow isn't removed.
Could I be doing somehint wrong? Or do I use he wrong way to do this ?
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>ZIM - puzzeltest</title>
<script type="module">
import zim from "https://zimjs.org/cdn/017/zim";
new Frame(FIT, 960, 540, light, dark, ready);
function ready() {
let myShadow = new createjs.Shadow("rgba(0,0,0,0.5)", 5, 5, 10);
F.loadAssets("de_emmer-min.jpg");
F.on("complete", () => {
var tile1 = new Bitmap(new Pic("de_emmer-min.jpg"), 300, 300, 300, 300, 1).addTo(S).sca(0.4).drag();
tile1.on("pressdown", () => {
tile1.shadow = myShadow;
S.update();
console.log("dragstart");
});
tile1.on("pressup", () => {
tile1.shadow = null
S.update();
console.log("dragstop");
});
S.update();
});
}
</script>
<meta name="viewport" content="width=device-width, user-scalable=no" />
</head>
<body></body>
</html>
