Programming interface

  Previous topic Next topic JavaScript is required for the print function  

The current version of "Front Panel Designer" offers a beta version of a programming interface (API), which allows users to formulate action sequences using milling and engraving objects on the current or on a newly created front panel as an executable script written in JavaScript.

Scripting window

All the following actions will be performed in the so-called scripting window, which can be opened by clicking Edit > Scripts . It opens in a simplified window, keeping a clear view of the current front panel which will possibly be edited by script. For the same reason the scripting window always reverts to the simplified view after running a script.

The full display showing the integrated script editor can be opened with the " >> " button found above the window showing the existing scripts. This editor is opened automatically when you are press the "New" button to start a new script.

The functions which can be activated in the scripting window are described below in connection with various actions.

The documentation for the API is offered at the bottom of the relevant section as a PDF download.

Organizing scripts

After opening the scripting window (see above) the topmost area displays all the scripts which have either been created by the user ("User scripts") or were supplied with "Front Panel Designer" ("FPD scripts"). The user scripts are stored under:

Windows: %APPDATA%\FrontDesign\Scripts
Mac: $HOME/.FrontDesign/Scripts
Linux: $HOME/.FrontDesign/Scripts

If you change the contents of the relevant path e.g. using a file manager, you can update the display of the existing scripts in the scripting window at any time using the button to the left of the "PastePad" button (above the script lists display field) .

You can open the dialog box to rename a user script by pressing the "Rename..." button in the scripting window.

If the script refers to HPGL engravings or free contours and their associated PLT or DXF files, you can collect all of the files in a single folder which can then be stored at the relevant location. Details on this can be found at the bottom of the section entitled "File related script, engraving and free contour data as bundle".

The description of a script (middle display field in the simplified view) is derived from a comment line in the script beginning with "#de#:", "#en#:" or "#fr#:" , whereby the text in the description follows from the subsequent character string (see image below).

Run current script

In order to start a listed script, you must first select it and then press the "Start" button. In order to start an external script, you can copy the code from the editor used, paste it into the "PastePad" (open using the button above the script list display) and start it by pressing the button.

While the script is running in "Front Panel Designer" then

outputs in print()
results of the script
error messages

are shown in the respective "output" display.

After the execution of the script, the front panel that has been edited or generated is shown in the workspace of "Front Panel Designer" .

Edit script

In order to be able to edit a selected script, activate the integrated script editor using the " >> " button above the display of existing scripts (this editor is opened automatically when you start a new script with the "New" button).

You can run the edited script at any time ("Start" button), save it regularly ("Save" button) or add it as an additional script under a new name ("Save as..." button).

Newly created or inserted rows can be tested individually at any time at the JavaScript prompt (for example, trying out variants of a particular milling element on the front panel, where elements created on the front panel may be deleted at any time).

The documentation for the API is offered as a download at the bottom of the relevant section.

Add external script

An external script (file extension must be "fpjs") which you have received by e-mail from another user can be added using the "Add..." button (bottom left). It is then automatically stored at the following location:

Windows: %APPDATA%\FrontDesign\Scripts
Mac: $HOME/.FrontDesign/Scripts
Linux: $HOME/.FrontDesign/Scripts

Alternatively, you may of course also copy or move the external script directly into the intended folder.

You can easily test the code of a external script in advance by copying it from a relevant application, pasting it into the "PastePad" (see the section "directly test external code" below) and running it directly from there.

Create new script

By pressing the "New" button you create a new (empty) script, which then appears in the script display field under "User scripts" as "Untitled?.fpjs" ("?" stands for a incremented index). The procedure for editing the script is described in the appropriate section above. The automatically generated file name may be changed at any time by clicking on the "Rename..." button.

Alternatively, you can of course also save an existing script under a new name.

Directly test external code

You can test the code of a external script without creating a new user script by copying it from a relevant application and pasting it into the "PastePad", which can be opened by clicking on the relevant button above the script list display field.

The PastePad is a window for users who want to copy and paste script text directly from an external source into "Front Panel Designer" and run it immediately. The PastePad consists of a text box into which text is copied, an output field and two buttons to delete the output and to run the script text.

API documentation

The document offered for download here describes the scripting programming interface of "Front Panel Designer". The scripting language is JavaScript. Basic knowledge of programming with JavaScript is required (our book recommendation: "Javascript: The Good Parts" by Douglas Crockford). Example scripts are supplied with Front Panel Designer, offering an overview of the structure of a script.

You can download the description of the scripting programming interface of "Front Panel Designer" here:


File related script, engraving and free contour data as bundle

If a script refers to engraving and/or free contour files, addressing is simplest if all the files are located in the same directory. All the relevant files can be collected together in one folder which is set in the script directory; this "bundle" is then listed in the script list display field under the folder name, in which the underlying script can be edited and run as usual.

Note: The contents of such a folder will only be recognized as a bundle if the script within it is named "script.fpjs".

The directory can also be zipped and added to the user scripts from any location. Through this procedure, the contents of the zip file are permanently unzipped to the intended directory.