[Pas2js] Component Streaming implemented

[warleyalex]

When a project have many forms I think it is more efficient load form-data
inlined JSON data like EWB scheme.

For instance, a form named Accounting are stored in the file Accounting.wbs. 

// Accounting.wbs------------------------
{ 
      
      "ClassName": "TDialog", 
      "Name": "formAccounting", 
      "Properties": { 
         "Top": 0, 
         "Left": 0, 
         "Height": 535, 
         "Width": 597, 
         "Animations": {  }, 
         "CaptionBar": { "Name": "", 
            "Height": 44, 
            "Caption": "Check Accounting", 
            "Font": { "Name": "Segoe UI", "Size": 18, "Color": 4294967295 }, 
            "FontIcon": { "Name": "", 
               "Color": -16777216, 
               "Size": 16 }, 
            "Padding": {  } }, 
         "Client": { "Name": "", 
            "Background": { 
               "Fill": { "Color": 4294967295 } }, 
            "InsetShadow": {  }, 
            "Padding": {  } }, 
         "Constraints": {  }, 
         "Corners": {  }, 
         "Layout": {  }, 
         "Margins": {  }, 
         "OutsetShadow": { "Color": 1677721600, "HorzOffset": 2,
"VertOffset": 2, "Blur": 6, "Visible": true } }, 
      "Controls": [ 
      { "ClassName": "TLabel", 
         "Name": "Label1", 
         "Properties": { 
            "Top": 8, 
            "Left": 8, 
            "Height": 22, 
            "Width": 56, 
            "Animations": {  }, 
            "Background": {  }, 
            "Border": {  }, 
            "Corners": {  }, 
            "Caption": "Caption", 
            "Constraints": {  }, 
            "DisplayOrder": 0, 
            "Font": { "Name": "Segoe UI", "Color": 4285562249 }, 
            "Format": {  }, 
            "Layout": { "Consumption": 7, "Position": 1 }, 
            "LayoutOrder": 0, 
            "Margins": { "Left": 4, "Top": 4, "Right": 4, "Bottom": 4 }, 
            "OutsetShadow": {  }, 
            "Padding": {  } } }, 
      { "ClassName": "TBrowser", 
         "Name": "Browser1", 
         "Properties": { 
            "Top": 30, 
            "Left": 0, 
            "Height": 426, 
            "Width": 589, 
            "Animations": {  }, 
            "Background": { 
               "Fill": { "Color": 4294967295 } }, 
            "Border": { 
               "Top": { "Color": 4292797157, "Width": 2, "Visible": true }, 
               "Left": { "Color": 4292797157, "Width": 2, "Visible": true }, 
               "Right": { "Color": 4292797157, "Width": 2, "Visible": true
}, 
               "Bottom": { "Color": 4292797157, "Width": 2, "Visible": true
} }, 
            "Constraints": {  }, 
            "Corners": {  }, 
            "DisplayOrder": 1, 
            "InsetShadow": {  }, 
            "Layout": { "Position": 1, "Stretch": 8 }, 
            "LayoutOrder": 1, 
            "Margins": {  }, 
            "OutsetShadow": {  }, 
            "Padding": {  } } } ]
       }
------------------------
When you compile the project, the data must be embedded inline at main HTML.
By giving the JSON data a non-standard type in the 
-----------
Note: 
The type="application/json" is needed to prevent browser from parsing it
while loading.
This will work just fine in all browsers.

After that, you can use it in the main script, you can access the form data:

JSON.parse(document.getElementById('TformAccounting').innerHTML);

When you load a large document, a big project with dozens forms, the larger
is the benefit.  




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