Lazarus 3 and Pas2JS missing

[zendrael]

Hi!

Lazarus 3 was released with already built-in options to build pas2js projects but no pas2js compiler is shipped within it.
 
As it requires 2.2.1 (for projects like PWA), where can I get pre-built binaries of pas2js 2.2.1 instead of compiling it from sources?

Thank you in advance.

[TRon]

Lazarus 3 was released with already built-in options to build pas2js projects but no pas2js compiler is shipped within it.

pas2js is 'shipped' with Free Pascal commandline compiler.
 

As it requires 2.2.1 (for projects like PWA), where can I get pre-built binaries of pas2js 2.2.1 instead of compiling it from sources?

I was unable to find precompiled binaries (downloads but snapshot is older). FPC 3.2.2 contains an even older version. FPC trunk contains pas2js 3.2.? and you would need to compile that yourself from source (a full FPC build (make) will create it for you and is located in the bin directory on a successful build).

I have no idea if FPC distribution packages contain pas2js (by default) because I always build the compiler/IDE from source.

[zendrael]

Yeah, I need the precompiled ones as no matter what I do, I don't get it properly compiled, maybe missing something for sure.

I also found that ftp://ftpmaster.freepascal.org/fpc/contrib/pas2js/snapshot maybe has the most recent ones, but every time I try to access, it asks for a user and password...

Any ideas?

[TRon]

Yeah, I need the precompiled ones as no matter what I do, I don't get it properly compiled, maybe missing something for sure.

How are you compiling/building pas2js then and on/for which platform ?

As said, pas2js compiler is part of the FPC project and FPC can be build by invoking make. See also installing the Free Pascal compiler (subsection installing from source for your selected platform).

Alternatively (and in case you did not do so already) you can verify your compilation/setup with the instructions on the pas2js subgroup project. Though I haven't verified the instructions from there.

I also found that ftp://ftpmaster.freepascal.org/fpc/contrib/pas2js/snapshot maybe has the most recent ones, but every time I try to access, it asks for a user and password...

That will point to the same location that I linked to (and the snapshot is out of date)

[teos]

I have download Lazarus in the last weeks to learn that as beginner, I have to install pas2js in Lazarus. When I did so, I seems that only bootstrap alike components are actively developed, involved with writing code as you would with HTML and Javascript.

Excuse me if this is offtopic but I get the impression that Pas2Js is not interesting for the Lazarus community or am I wrong?

[Thaddy]

Exactly where do you experience problems?
Pas2Js is well maintained and also comparatively new.
For beginners it is not really easy to setup correctly.
Again, well maintained and by some of the core fpc developers.

So, yes, you are wrong.

[teos]

Hi Thaddy,

In older versions of Lazarus, pas2js was with the distribution. I have to know where the compiler is, what the packages are that are with the distribution, where to put them and then it looks as if I still have not everything to install a set of components in Lazarus.

Composer is not helpfull at all. That just creates a bunch of files but I learned multiple times that you're lost if something is not very clear.

The developer who is putting Composer dependencies up, is the experienced user, the developer who has to install -with a very subtile document- new and unknown sources/environment is left to himself.

If I use the last Lazarus before 3.0, I have the designpackage. When I install that, create a new project and try start the debugger, I get a AV because the IDE thinks that firefox is not a valid application. Without debugging all works fine.

Next isseu: New webproject with widgets. Drop a stringgrid on a new webform and you get a blank box. Add colums and try to run it. Doesn't work: columnwidths and other settings are not supported. Fixed row in a TStringgrid is drawn too low: the first row is blank. TDrawgrid is not implemented at all.

Most of the time when I drop or delete a component from jsGUI on my form, the component is not added to the source (A component that I drop on the form editor is not added to the pas file) or other way around when I delete one, it is not removed from the pas file.

The last Github repository that I found is the same code.

The last new widgets that I see are component and are used to build Bootstrap GUI. What I don't understand: You can add classes. You can derive Bootstrap components from standard VCL objects/classes and style them with HTML class property.

But that way a developer is not bound to the Bootstrap classes.

But bottom line for my question: I see old code in Github and I have not found recent versions. I hope there are. I am looking forward to develop a new application for Windows, the web, Android, Linux and iOS with Lazarus.

Would it be an idea to have a ready install of Lazarus 3.0 with pas2js onboard to at least get a start?

Like I learned playing accordion: I started not by learning music notes but by playing some music and learned reading sheet music on the go.

[Thaddy]

I did the following to test your issues:

1) With a properly installed FPC+ Lazarus - with fpcupdeluxe -, startup fpcupdeluxe.
2) Go to the modules tab
3) select pas2js-rtl
4) select install module, this can take a looong time, be patient, be VERY patient on slow hardware!!!!!! Just learn to be patient.... Up to 15 minutes....on slow hardware like my old AMD two core.
5) select pas2js-ws
6) select install module, again be patient, very patient. By now you should have the patience I have for my wife and kids: endless [edit] I am well over an hour in now for the old AMD, Pi is nearly finished.PATIENCE.
When finished you can select pas2js as target and use the pas2js widgets for design.
Actually, I am compiling for Raspberry Pi 4 too and that seems much faster, the compile cycle takes more cores. Starting up Raspberry Pi 5 later.

The process amounts to a humongous amount of re-compiling Lazarus, but it is hopefully a one time operation on fresh installs.
[edit]
succeeded on both the slowboat AMD as on the Pi4, Now starting RPi5....
succeeded too.
I only installed nodejs from https://nodejs.org to make local applets. Do not forget to tick the box for install tools too. You need to add the path to nodejs.exe to the application or set the path globally.
This should do the trick.

Everything works out of the box. Let me know if there are still issues.

[teos]

Dankjewel Thaddy,

You don't mention which Lazarus and which pas2js versions you installed. That might be better to make things reproduceable.

I have de-installed and installed Lazarus prior to every effort to install pas2js. But what I did not know is fpcupdeluxe. That is a new option. Fine with me, I guess that only will make things easier.

But I will do a clean install and see what I run into and I post my findings with some screenshots to explain what I see.

Best regards,
Teo

[Thaddy]

On both Raspbery Pi's, I used 3.2.2 and Laz trunk 3.99.
On Windows 11, I used trunk and Laz trunk. All succeeded.
Actually the versions stable should be OK too because I use them on my default install. For this test I clean roomed.

[teos]

I found fpcupdeluxe and installed Freepascal and Lazarus with the tool.
(The only way to be able to install fhe packages you installed afterwards.)

Installation went fine, I have a very recent laptop. So I installed pas2js-rtl and after that pas2js-ws in only a few minutes.

fcpupdeluxe has installed lazarus and a shortcut that I should use. So I do. When I start Lazarus, I can indeed select a Web GUI application.

But when I do, I get "missing packages", "The following package failed to load: WCL".

When I find WCL.lpk and open it, It won't compile because of "Dialogs.pas"
procedure ShowMessageFmt(const AMessage: string; const AArguments: array of JSValue);
begin
  ShowMessage(Format(AMessage, AArguments));
end;   

The error is: dalogs.pas(507,32) Error: Incompatible type for arg no. 2: Got "open array", expected "array of const"

Okay.. Showmessage without format will do for now. The package compiles and is enabled in my newly created project.

To repeat my test: I created a new project and dropped a WStringgrid on a wform.

I can't start the debugger (button is not enabled) but the project is compiled and I see a stringgrid when I load the project html file in the browser. Clearly there are enhancements. Nice.

I have to do that myself, Lazarus is not opening my browser. The Stringgrid is drawn correctly so that is a plus. But it has none of the events that are available in the VCL variant.

But my code "WStringgrid1. cells[1,1] := 'hoi, hier' is not visible until I click in the grid to give it focus.

None of the events of the VCL grid are implemented (at least not designtime) so no drawcell etc.

But for a starter: Run FPCUpDeluxe, follow the steps from Thierry and you can at least start and get impressed.

[Thaddy]

The WCL issue is strange, because on all my 3 test computers I have a nice WCL tab in lazarus and the components work. Frankly I just tested the basics.
pas2js has  dependencies, did you really, honestly, check the box I referred to? (tools)
Essential info is
- platform
- os version
- browser default

Report back if it still does not work. I would suggest to test against nodejs first.
Ik ben toch met pensioen en heb tijd zat.

[PascalDragon]

But when I do, I get "missing packages", "The following package failed to load: WCL".

When I find WCL.lpk and open it, It won't compile because of "Dialogs.pas"
procedure ShowMessageFmt(const AMessage: string; const AArguments: array of JSValue);
begin
  ShowMessage(Format(AMessage, AArguments));
end;   

The error is: dalogs.pas(507,32) Error: Incompatible type for arg no. 2: Got "open array", expected "array of const"

That is now fixed.

I have to do that myself, Lazarus is not opening my browser.

Lazarus is supposed to be able to do that, but I haven't yet managed to get that working myself either...

The Stringgrid is drawn correctly so that is a plus. But it has none of the events that are available in the VCL variant.

But my code "WStringgrid1. cells[1,1] := 'hoi, hier' is not visible until I click in the grid to give it focus.

Please provide an example. If I put the following code in the OnCreate handler of the form I get the content without any issues:

Code: Pascal  [Select][+][-]

1. procedure TWForm1.FormCreate(Sender: TObject);
2. var
3.   r, c: LongInt;
4. begin
5.   for r := WStringGrid1.FixedRows to WStringGrid1.RowCount - 1 do
6.     for c := WStringGrid1.FixedCols to WStringGrid1.ColCount - 1 do
7.       WStringGrid1.Cells[c, r] := IntToStr(r * WStringGrid1.ColCount + c);
8. end;

None of the events of the VCL grid are implemented (at least not designtime) so no drawcell etc.

Currently the TCustomStringGrid is a direct descendant of TCustomGrid, because

• I hadn't any need for more yet
• more often than not drawing is not required for the grid, thus having it work without is a good first step

Thus all the draw related events are not implemented and only the most important events. If you're missing specific things, then please report bugs on the WCL project.

[teos]

I test very simple:

Create a new project, drop a wStringgrid and a wbutton on a wform.
In the onclick of the button I have "WStringGrid1.cells[1,1] := 'hoi hier'.
The cell is white untill I click on the Grid.

The other isse: add a column by using the "columns" property editor and set the width. You can leave that as is, when you open or start the project, you get the error "Error reading TColumn.Width: unknown property: Width".

What cell painting and drag and drop makes possible: Create a simple planner. The paint event allows to draw "events" in the correct cells, draw "merged" cells and drag and drop those events.

Am I correct that I can edit grids.pas by opening the file in Lazarus, add my changes and recompile both the designtime package and running build all to build the pas2js files?
Is there any documentation on how to do this?

I'm asking because I consider to help out on these components. But there is a loooooot to be done..

[PascalDragon]

I test very simple:

Create a new project, drop a wStringgrid and a wbutton on a wform.
In the onclick of the button I have "WStringGrid1.cells[1,1] := 'hoi hier'.
The cell is white untill I click on the Grid.

Ah, the button was the missing piece! I was now able to reproduce it and have implemented a fix (that is not optimal yet, but does the job for now).

The other isse: add a column by using the "columns" property editor and set the width. You can leave that as is, when you open or start the project, you get the error "Error reading TColumn.Width: unknown property: Width".

That is an issue with how the components are integrated in the IDE as the grid uses the same column class as the LCL and thus all properties of the LCL are listed instead of only those supported by the WCL. So please be sure to only change properties of the columns that are supported by TGridColumn of the WCL. Width is not yet among the supported properties. I'm trying to work on a fix now, but it isn't that easy...

What cell painting and drag and drop makes possible: Create a simple planner. The paint event allows to draw "events" in the correct cells, draw "merged" cells and drag and drop those events.

It needs to be implemented in a way that a canvas isn't required if one doesn't use that functionality and since I didn't require it myself, I didn't implement it.

Am I correct that I can edit grids.pas by opening the file in Lazarus, add my changes and recompile both the designtime package and running build all to build the pas2js files?
Is there any documentation on how to do this?

You only need to rebuild the designtime package (and thus the IDE) if you changed something that needs to be visible at design time in the IDE (e.g. when adding a new published property).

I'm asking because I consider to help out on these components. But there is a loooooot to be done..

Of course there's a lot to be done, after all a UI framework like the LCL isn't an easy one.