Javascript in Desktop Applications

visits: 5783 | score: 3.7 

posted by sysrpl on Sunday February 6, 2011 7:53 PM

ver at stackoverflow someone asked, "Is it possible to utilize javascript in the making of windows desktop applications". Why yes, not only is it possible, but it's actually quite powerful. In this brief article I describe how you can add script support to your Windows desktop projects.

At the bottom of this page you'll find a Delphi source code package and example application demonstrating how to add javascript support to your Windows desktop applications. Feel free to translate this package to your favorite language.

To get started, create a new Windows Forms VCL application, add ScriptIntf to you uses clause, and create an instance of TJavaScript in your form create method. You have the option to hook up Scriptlet objects, which allows your javascript to access Delphi methods and properties.

1procedure TSomeForm.FormCreate(Sender: TObject);

2begin

3  // Create our javascript engine

4  JavaScript := TJavaScript.Create(Self);

5  // Make this form available to javascript under the name 'Form'

6  FScript.AddScriptlet(CreateComponentScriptlet(Self, 'Form'));

7  // Add hosting support including our Alert and Echo methods

8  FScript.AddScriptlet(CreateHostScriptlet(ScriptAlert, ScriptEcho));

9end;

To add source code to a script, assign text to the lines property. To connect a script call the Execute method:

1procedure TSomeForm.ExecuteButtonClick(Sender: TObject);

2begin

3  JavaScript.Lines := SourceMemo.Lines;

4  JavaScript.Execute;

5end;

When javascript is connected, it can optionally access your Delphi scriptlets by name:

1/* Example hosted javascript */

2 

3/* See ScriptIntf.pas for THostScriptlet's methods */

4Host.Echo("Hello from javascript");  

5 

6/* See ScriptIntf.pas for TComponentScriptlet's properties */

7Host.Alert("Save button anchors are: " + Form.SaveButton.Anchors);

8Form.ExecuteButton.Caption = "Hello";

The results of the script are shown to the left. Notice that the script was able to set the caption property of our execute button, and access the anchors of our save button. The script was also able to access our Host's Alert and Echo methods.

By writing your own scriptlets objects, you can define any number of objects with any number of methods or properties that can be accessed by scripts. See the ScriptIntf.pas to understand how THostScriptlet and TComponentScriptlet are working in this example.

You can also do the reverse of scriptlets, connecting to a script accessing javascript objects or call javascript functions from Delphi. To access these javascript items you can write code like this:

1/* Example hosted javascript */

2 

3var a = 12;

4 

5function inverse(value) {

6  return 1 / value;

7}

And in Delphi you would write:

01procedure TSomeForm.Test;

02var

03  Script, A: OleVariant;

04begin

05  if JavaScript.State = ssConnected then

06  begin

07    Script := JavaScript.Script;

08    A := Script.a;

09    ShowMessage(A.toString().length);

10    A := 0.25;

11    ShowMessage(Script.inverse(Script.a));

12    ShowMessage(Script.inverse(0.25));

13  end;

14end;

Download the compiled script test project with source code here