Total ZIM beginner here (with good experience in WebDev).
I am trying to capture the click event (especially its position) when it happens on the Frame. I looked into the tips and saw that f.on('EVENT_TYPE') should be possible... Why can't I see the log message when I run this code and click over the frame?
function ready() {
// given F (Frame), S (Stage), W (width), H (height)
F.on('click', (event) => {
console.log('Frame clicked!', event);
});
new Circle(100, red).center().drag();
}
I added the circle here to make sure things are running fine, and I can drag the circle and all...
Welcome! No question to small or too big ;-). Glad you are here.
The Frame is not a DisplayObject - it does have some events like "ready", "keydown" and a few others. To see the events, go to the Docs DOCS - ZIM JavaScript Canvas Framework - Documentation and scroll down to the bottom where it lists Events.
What you want, though, is to put the event on the Stage which is a DisplayObject:
S.on("stagemousedown", ()=>{}); // captures anywhere
S.on("mousedown", ()=>{}); // captures on any object on the stage
circle.on("mousedown", ()=>{}); // captures on the circle
// or for click:
circle.on("click", ()=>{}); // captures a click (down+up) on the circle
// note, to get the x and y use F.mouseX and F.mouseY at any time.
// which I guess is slightly awkward as I just said do not use the frame
// but the frame at any time tracks the mouse so... that is easiest.
