Workbench User Guide > Workbench User Guide > Creating Web Applications Using WebGen
Was this helpful?
Creating Web Applications Using WebGen
You can generate web applications in HTML/JavaScript from OpenROAD frames. This web application deploys on a web server such as Apache tomcat.
Using WebGen functionality, you can quickly create and deploy a web application with the same functionality as a desktop application. OpenROAD widgets convert to HTML elements. For example, an EntryField is converts to <input> and a ButtonField is converts to <button>.
You can deploy your application on a web server and use that web application in browsers such as Google Chrome, Mozilla Firefox, and Microsoft Edge. You also can debug these web applications in the browser. Although you cannot change the web application directly, you can change the OpenROAD frame and regenerate the web application.
Widgets That Can Convert
FreeTrim
BoxTrim
EntryField
EntryField Multiline
ButtonField
The WebGen transpiler generates code that allows a ButtonField’s textlabel to exceed the ButtonField’s width that overflows into the adjoining area.
Instead, the textlabel written will be truncated, and if the ButtonField has its Text Display Behavior set to TDB_END_ELLIPSIS, an ellipsis (..) is added to the end.
The Text Display Behaviors of TDB_PATH_ELLIPSIS and TDB_WORD_ELLIPSIS are unsupported.
ToggleField
RadioField
OptionField
ListField
SliderField
SegmentShape
RectangleShape
EllipseShape
ImageTrim
TableField
Prerequisites
You can a servlet-based HTTP server installed such as Apache Tomcat. (This is needed for JSON-RPC related testing. For GUI-related testing, any web server can be used.)
Java JDK must be installed for war creation.
Limitations
Any SQL database-related statements (for example, SELECT, DELETE, UPDATE, INSERT, Execute Immediate, Inquire_sql) are not converted and a compilation error reports. All database queries are performed within an OpenROAD server application. Access to the OpenROAD server applications relies on JSON RPC calls.
There is partial support for the following OpenROAD non-UI system classes:
ArrayObject
RemoteServer
StringObject
SessionObject (w/ only JSON-related support)
JSON-related classes
There is support for OpenROAD system variables (for example, CurEventScope, CurSession, CurFrame, CurProcedurem, CurMethod, IIDBMSError), with the exception of all CurFrame, CurProcedure, and CurMethod 4GL ProcExec references are converted to a CurExec. CurExec has one JavaScript method Trace(), which has a single parameter named 'text'. It currently has no attributes (InputFocusField, et al.)
OpenROAD WebGen functionality is useful for OpenROAD applications containing only Frames with GUI elements, 4GL procedures, and UserClasses.
The current look of generated web application is similar to OpenROAD desktop application. OpenROAD field properties are used to generate the CSS for each field.
CLICK and SETVALUE are the only Field events that have support.
Fields can only have one event activation script (e.g ON CLICK, ON SETVALUE).
NOT NULL datatype declarations ignore the NOT NULL (all JS variables are nullable).
OpenROAD component and variable names must conform to the JS and CSS rules for valid identifiers (no @, $ or # characters, cannot start with an integer as first character, etc.). Field and variable names containing # characters will have the # characters converted to _ (underscore) characters.
Using TableField [] and [*] notations to retrieve the object in the currently selected row.
CurExec has the following JavaScript methods:
Trace(), which has a single parameter named 'text'.
infopopup(), confirmpopup() and replypopup()
inputfocusfield()
topform()
settodefault()
All supported UI field-related System Classes (e.g. EntryFields and ButtonFields) have only the following methods/attributes:
SetToDefault()
HasDataChanged
CurBias
BgColor
FgColor
BgPattern
Height
Width
OutlineStyle
OutlineWidth
OutlineColor
YTop
XLeft
IsInvisible
IsBold
IsDimmed
Not Supported
The following items are not supported in WebGen.
Feature Not Supported
Notes
OpenROAD UI-related system classes
 
These system classes include:
TreeView
ListView
TabFolder
FlexibleForm
ControlButton
PopupButton
ScrollBar
PaletteField
ViewportField
4GL CASE statement
 
TableFields do not support:
ControlButton
Header Buttons
Resulting TableField conditions:
HasControlButton property must be set to FALSE
HasHeaderButtons property must be set to FALSE
TableFields can only contain EntryFields
Nested TableFields
 
Horizontal TableFields
 
3GL procedure calls
 
EXEC 4GL statements
 
Database procedure calls
 
PROMPT statements
 
External Active X class libraries
 
Using variables for procedure and method names
For example, a = objectref.:varmeth()
SQL predicates BETWEEN, IN, and LIKE
 
UserClass constructors
 
4GL Dynamic Expressions
 
Microsoft Internet Explorer browser
 
UI System Class InputMasking and FormatString properties
 
Ingres date literals 'today', 'now', 'dow' and date functions (e.g. interval(unit,interval))
 
FrameExec CurMode attribute
 
Labels within FOR loops
 
EntryField InputMasking and FormatString properties
 
GroupBoxLabel property
 
LayerSequence (z-order) property
 
Assumptions
The latest OpenROAD patch is installed.
A servlet-based HTTP server such as Apache Tomcat is used. (This is needed for JSON-RPC-related testing. For GUI-related testing, any web server may be used.)
Java JDK is used for war creation.
Create a Web Application from an OpenROAD Application
To create a web application from an OpenROAD application
1. Create or import your OpenROAD application with a frame.
2. Create a folder named as an OpenROAD application name appname.
3. Issue the following command in cmd/bash with the OpenROAD environment inside the appname folder, substituting the name of the OpenROAD application and database name:
w4gldev compileapp dbname appname -js appname.js
A single JS file (the one named after the -js flag) will be created. HTML files (with the .html extension) will be created for each application frame. These HTML files will have the same name as the OpenROAD frame they were derived from.
4. Copy core.js and orfields.js into the appname folder.
5. Copy the appname folder into the CATALINA_HOME\webapps folder.
6. Alternatively, you can create single file using this command:
jar -cvf appname.war *
7. Copy the generated appname.war file into the CATALINA_HOME\webapps folder.
8. Open the web application in a web browser such as Firefox, Chrome, or Edge under localhost:port/appname/framename.html.
9. You can create a test for the previous URL with test utility such as Robot test framework/TestComplete.
Viewing Transpilation Errors
You can view any 4GL compiler errors and warnings by specifying the -e (errors) and -w (treat warnings as errors) flags. If transpiling a module generates transpilation errors, those errors will also be viewable using the -e (errors) flag. Any errors and the 4GL source code that generated them will be written to the Trace log file.
 
Last modified date: 12/20/2023