I’d like to send a ‘click’ event to a button. In the script I’m writing, I access the button through an attribute, so I have its entity. The button has registered an event handler for ‘click’, as: this.entity.element.on('click', this.onClick, this);
…and I’d like to make use of it.
I would expect to following to work: targetEntity.fire('click');
I’ve confirmed that the ‘targetEntity’ is valid, but it is not calling the “onClick” function. How can I fire this event directly to the button, via its entity?
I am trying to avoid calling the ‘onClick’ function directly, as it seems more generic.
I don’t use fire events as much, so I’m not as experienced in it (@Leonidas might know more about that). But as far as I can tell you, doing something like this.attributesEntity.element.on('click', this.onClick, this); would work. As for the fire event, I’m not as experienced in firing events, so sorry if I didn’t give you any useful info.
There isn’t any official way to do this. Looking at the internals of the engine, you can call a private method with the right arguments (fake mouse event) like this:
Well, what if an entity has multiple scripts that respond to the ‘click’ event to do different things? I don’t want to have have to iterate through every script.
Also, I’d like to avoid having to know exactly the spelling of the function. “on_click”, “do_click”, “OnClick”, “onClick”, “onclick”, “onClickEvent”…these are all perfectly good names for handlers, and I should not need to care about the spelling.
I don’t want the buttons that receive these fake clicks to have to be built in ANY special way. They should not have to comply with any coding conventions or naming schemes. If they handle the “click” event, they should work with a fake-click event.
These are my design considerations. The goal is to be able to layer this “fake click” event system on top of an existing UI, and drive it via events to achieve remote control. Sounds simple, right?
In theory, you can trigger a browser click event in the right place on the screen/canvas which will propergrate through to the engine. If you want to trigger the click event on the element, you can do element.fire('click')
As long as the click handlers are not doing anything with the event param that would normally get passed in the callback, that should be enough
I think yaustar has it right. My web programmer (who is a genius!!) was able to get this code functional using targetEntity.element.fire('click');
(note the inclusion of “.element”)
We are still testing that it works for multiple scripts with click handlers. But, this is progress, at least!
And, of course, the event will be [null] but I think this is workable. And, we could, theoretically in the future, pass along a “fake event” data structure, as we fire the event, to provide x,y coordinates, etc.
In my scene the camera is moving by moving your mouse on the screen.
I want to make a target point in the middle the screen. So whenever you are clicking anywhere on the screen, the click should execute on a certain x and y position on the screen.
I have tried using document.elementFromPoint(75, 75) to test as there is a button on those coordinates.
This seems to work as console.log(document.elementFromPoint(75, 75)); gives me this:
However, when I want to click that element on those coordinates by using: document.elementFromPoint(75, 75).click();
nothing happens even though there is a button there.
Can a simulated click through that function reach the buttons in the canvas?
Another way might be the one @Leonidas mentioned, but I am not sure how to use: ElementMouseEvent(event, element, camera, x, y, lastX, lastY)
