Problem with global events. Pas2JS_Widget
lazarus / 76-Pas2JS

----------------------------------------------------------------------
yus · 2021-05-02 18:36

Hello.
I use web component library
https://github.com/pascaldragon/Pas2JS_Widget
And I try create global event for my application.

Next way.
Project -> New project -> Web GUI Application (Pas2JS)
For form unit next code.

Code: Pascal  [Select][+][-]window.onload = function(){var x1 =
document.getElementById("main_content_section"); if (x1) { var x =
document.getElementsByClassName("geshi");for (var i = 0; i unit
Unit1; {$mode objfpc}{$H+} interface uses  Js, Classes, SysUtils,
Graphics, Controls, Forms, Dialogs, WebCtrls, Web; type   { TWForm1
}   TWForm1 = class(TWForm)    procedure FormCreate(Sender: TObject); 
  procedure FormMouseDown(Sender: TObject; Button: TMouseButton;
Shift: TShiftState; X, Y: NativeInt);  private    function
MouseDownHandler(aEvent: TJSMouseEvent): boolean;  public   end; var 
WForm1: TWForm1; implementation {$R *.lfm} { TWForm1 } procedure
TWForm1.FormCreate(Sender: TObject);begin  Writeln('Form Create'); 
document.addEventListener('mousedown',
@MouseDownHandler);end; procedure TWForm1.FormMouseDown(Sender:
TObject; Button: TMouseButton; Shift: TShiftState; X, Y:
NativeInt);begin  writeln('Form MouseDown');end; function
TWForm1.MouseDownHandler(aEvent: TJSMouseEvent): boolean;begin 
Writeln('Global Mouse Down');end; end. 
But the global event doesn't fire.
May be you know why?

Thanks.

PS:
OS: Windows 10
Lazarus: 2.1.0
Date: 2021-04-17
FPC: 3.3.1
SVN Revision: 65006
x86_64-win64-win32/win64

Pas2JS: Release 2.0

----------------------------------------------------------------------
yus · 2021-05-02 20:14

I found reason.
At base class TControl for events set StopPropagation for Events.

Code: Pascal  [Select][+][-]window.onload = function(){var x1 =
document.getElementById("main_content_section"); if (x1) { var x =
document.getElementsByClassName("geshi");for (var i = 0; i function
TControl.HandleMouseDown(AEvent: TJSMouseEvent): boolean;...begin... 
AEvent.StopPropagation;...end; 
But I still can't figure out how to set the global handler.

----------------------------------------------------------------------
egsuh · 2021-05-03 01:27

Is it possible to add eventhandler to document object itself?  I think
it should be done to document.body, etc.

----------------------------------------------------------------------
yus · 2021-05-03 14:08

Quote from: egsuh on May 03, 2021, 03:27:50 amIs it possible to add
eventhandler to document object itself?  I think it should be done to
document.body, etc.
Yes, it is possible, but as I wrote above, in the event handler of the
components on the form, there is a call to AEvent.StopPropagation that
stops the transmission of messages.
The global document handler does not receive these messages.