[Pas2js] Cross Compilable Components – any feedback?

[warleyalex]

Steve,

Thanks for the input.

The XComponents := [ XVBox, XHBox, XButton, XEditBox, XCheckBox, XScrollBox,
XTabControl, XLabel, XHyperLink, XMemo, XTree, XRadioBtns, XIFrame, XTable,
XProgressBar, XNumericSlider, XNumberSpinner, XComboBox, XDatePicker,
XColorPicker, XImage, XGroupBox ] inherits from the base class
TWrapperPanel.

a) Component based RAD development integrated in the Lazarus IDE, it worked
like a charm. 
I sincerely did not like the approach "LazarusEXE-to-Pas2JS" app (you
usually make some edits in the project, press CTRL+F9 to recompile and run
the .EXE, and then generate the respective pas2js app). You have embedded
the pas2js compiler to generate the pas2js app which it is really cool, but
I will prefer the "direct approach" --> hit F9 and see the working
application immediately.

b) for fast RAD development, I will always prefer the "direct approch", just
drop components onto 
a form and set up at the objector inspector, the events and the properties
and then generate the pas2js application, using its fast compiler (no
intermediate exe is necessary). Another drawback, you have some conditional
compilation directives everywhere. 

c) The serialization mechanism (LFM-to-PAS): This is nice! 

[code]
------------------------------------
procedure InitialisePage(dummy:string);
begin
  if dummy='notnow' then exit;

  StartingUp:=true;
  loadingSystem:=false;

  setPasteCutAreaSize();

  {$I systemintface.inc}
  MainForm:=Example1Form;
  UIRootNode.MyForm:=nil;

  {$I systemnodetree.inc}
  XMLToNodeTree(LoadedSystemString);   
  StartingUp:=false;
end;   
------------------------------------
[/code]

The InitialisePage method (create and initialize the components) is invoked
at the form startup. I believe the mecanism to integrate LFM resource {$I
rtl.lrs} maybe is not a good idea since can add some overhead in the final
JS - I will prefer serialize the .LFM forms to PAS code, for instance:

  with WebButton1 do begin
    Name:='WebButton1';
    Parent:=Self;
    Left:=204;
    Height:=25;
    Top:=40;
    Width:=75;
    Caption:='Add';
    OnClick:=@WebButton1Click;
    TabOrder:=1;
  end;

Whatsoever, It's interesting the approach XMLToNodeTree, the system node
description. In the JS output there's the XMLToNodeTree( LoadedSystemString
); it contains some kind of Component-From-XML, and nodes are added as
children of UIRootNode. The InitialisePage method also will create
statements for all interface objects in the main form.

When you click at the "CompileJSandExecute" button, it will invoke the
NodeUtils.SaveSystem method (save the system definition data). This method
will generate/write the following .inc files definitions:
"systemintface.inc" and "systemnodetree.inc". However, you may have issues
when using multiple web forms.


Pas2JS RAD Project: 
-------------------
I would prefer to use the "modified" pas2jsdsgn.lpk package instead of the
XComponentsTemplate to create pas2js RAD projects. 

When you create a simple Pas2JS web-browser based project, the wizard
creates the main project.lpr file with a start main HTML page. However, it
should also have a webform template.

Assuming "WebForm" is basically a lazarus "form unit". However, it should
also have an associated HTML page! So, the idea is the same easy-to-use
centralized place for add forms into the current project. to add a second
form to the project, you go to File -> New... -> TWebForm to add forms to
the active project. 

The form template should generates Form2 associated Unit (Unit2) and add
"Unit2" to the project uses clause. In addiction, the form template "should"
also create an associate HTML page "Unit2.html" 

The project structure:
Files
|-->project1.lpr
|--> main.pas
|
|--> unit1.pas
|--> unit1.lfm
|--> unit1.html
|
|--> unit2.pas
|--> unit2.lfm
|--> unit2.html

Regards,
warleyalex




--
Sent from: http://pas2js.38893.n8.nabble.com/