Icon View Thread

The following is the text of the current message along with any replies.
Messages 1 to 5 of 5 total
Thread Component with external files
Wed, Jun 20 2018 8:54 PMPermanent Link

Stephen P

Prokon Software Consultants (Canada) Ltd.

I want to create a reusable EWB component that uses external JavaScript files. This does not seem possible; the button to add external files is greyed out in the Project Manager when making a component.

What I am hoping to accomplish is a component that incorporates the Three.js (WebGL) library that we can use in many projects:. The component would comprise the following files:
1) EWB component unit, base on TBasicPanel.
2) EWB component interface.
3) External file: The Three.js JavaScript file. Not a show-stopper if this should still be an external file that needed to be added to each EWB project, but better if it can be part of the component.
4) External files: Additional JavaScript files with helper functions. Again, I could add this as external files to each project, but would prefer it just be part of the EWB component.
5) External files: EWB files that contains the interfaces for the Javascript files in 4 and 5.

I have a working test project where all the different parts are present as external files. Moving forward into real projects, I would love to encapsulate all of the external files in a EWB component for easy re-use. This leave the question: how do I link 3, 4 and 5 into the EWB component?

Thank you for your suggestions.
Thu, Jun 21 2018 10:36 PMPermanent Link

Stephen P

Prokon Software Consultants (Canada) Ltd.

I am making little bits of progress here, and hope to report back in due course with a solution (in case anybody else wonders about this). Right now, the major obstacle seems to be the inability to use WebDom in a control...
Fri, Jun 22 2018 1:15 PMPermanent Link

Tim Young [Elevate Software]

Elevate Software, Inc.

Avatar

Email timyoung@elevatesoft.com

Stephen,

<< 3) External file: The Three.js JavaScript file. Not a show-stopper if this should still be an external file that needed to be added to each EWB project, but better if it can be part of the component. >>

This will need to be added to each project that uses the referenced external JS file.  I've never really thought about adding such a feature, though, so I'll take a look and see if, perhaps, there might be a way to have the compiler perform the binding and inclusion of the external JS file, similarly to how the control interfaces are bound to an application.

<< 5) External files: EWB files that contains the interfaces for the Javascript files in 4 and 5. >>

These can be normal EWB units, and as such, they will be picked up by the compiler using the compiler search paths.

Tim Young
Elevate Software
www.elevatesoft.com
Fri, Jun 22 2018 1:21 PMPermanent Link

Tim Young [Elevate Software]

Elevate Software, Inc.

Avatar

Email timyoung@elevatesoft.com

Stephen,

<< I am making little bits of progress here, and hope to report back in due course with a solution (in case anybody else wonders about this). Right now, the major obstacle seems to be the inability to use WebDom in a control...
>>

You cannot use the WebDOM unit at *design-time*, so you have to use IFDEFs to control when you reference specific browser features vs. normal language run-time features.

If you look at the WebUI unit, you will see a lot of these constructs:

{$IFDEF DESIGN}
uses WebDesign, WebCore;
{$ELSE}
uses WebDOM, WebCore, WebHTTP;
{$ENDIF}

Also, in the WebComps unit:

  TLocationServices = class
     private
        {$IFNDEF DESIGN}
        FGeolocation: TGeolocation;
        {$ENDIF}
        FError: TLocationError;
        FHighAccuracy: Boolean;
        FLocation: TLocation;
        FMaxAge: Integer;
        FTimeout: Integer;
        FWatchID: Integer;
        {$IFNDEF DESIGN}
        FPositionHandler: TPositionHandler;
        FErrorHandler: TPositionErrorHandler;
        {$ENDIF}

It's kind of a pain, but it's the nature of the dual-usage of the code for design-time and run-time.

Tim Young
Elevate Software
www.elevatesoft.com
Fri, Jun 22 2018 5:41 PMPermanent Link

Stephen P

Prokon Software Consultants (Canada) Ltd.

Thank you kindly for your comments Tim.

My mixed success so far:


<< 3) External file: The Three.js JavaScript file. Not a show-stopper if this should still be an external file that needed to be added to each EWB project, but better if it can be part of the component.

This will need to be added to each project that uses the referenced external JS file.  I've never really thought about adding such a feature, though, so I'll take a look and see if, perhaps, there might be a way to have the compiler perform the binding and inclusion of the external JS file, similarly to how the control interfaces are bound to an application.>>

My current workaround for loading the external JavaScript in the component is to use TScript. That works perfectly, but I am still lacking the ability to define a proper external interface (directly in the component, or through using an EWB unit).


<< 5) External files: EWB files that contains the interfaces for the Javascript files in 4 and 5.

These can be normal EWB units, and as such, they will be picked up by the compiler using the compiler search paths.>>

Thank you, this works for projects that use the component. The component itself, on the other had, is unable to access the EWB units with the external interfaces. I want the component to bootstrap the ThreeJS canvas, render etc., meaning it requires access to the external interfaces.


<< I am making little bits of progress here, and hope to report back in due course with a solution (in case anybody else wonders about this). Right now, the major obstacle seems to be the inability to use WebDom in a control...

You cannot use the WebDOM unit at *design-time*, so you have to use IFDEFs to control when you reference specific browser features vs. normal language run-time features.
>>

This has helped me understand a few things, thanks! I am still hitting a brick wall though. With conditional use of WebDom, I can build the library. But then the component cannot use the "external" keyword to interface with external classes. The example below demonstrates this.

Questions:

1) Here is an example of a component that descends from TPanel. If I want to use the JavaScript eval function by defining the external interface, then I am unable to build the library. Is there a way to do this?

-----------------------
unit TestComponent_Unit1;

interface

uses WebCore, WebUI, WebCtrls,
{$IFNDEF DESIGN}
WebDOM,
{$ENDIF}
WebCtnrs;

type

  TTestComponent = class(TBasicPanel)
     private
        { Private declarations }
     protected
        { Protected declarations }
     public
        { Public declarations }
     published
        { Published declarations }
     end;

  external function eval(s: string): variant;

implementation

end.
-----------------------


2) In this Forum post you mention an undocumented function CreateObject:
https://www.elevatesoft.com/forums?action=view&category=ewb&id=ewb_general&msg=10220&start=1

I have been using CreateObject with some success from within the component to access the JavaScript. If one can ensure that the JavaScript is loaded (e.g. with TScript), then one can use CreateObject instead of an external interface. But doing this makes me feel like I am sinking deeper and deeper into the abyss of typecasting and general fudging! Can I count that CreateObject will continue to be available in future versions of EWB?
Image