FlexTron

FlexTron is a technology that allows the usage of web controls within windows desktop applications. This will allow the creation of nicer looking user interfaces by using the styling options available for the web. It can also be a migration path from windows to web and provide an alternative to ActiveX controls.

FlexTron allows web controls to be used in windows applications. Web controls are the controls of the WebApp Framework normally used in webapps. Web controls are always subclasses of cWebObject and they use web properties to communicate with the user interface. When using web controls in windows applications, you also use WebSet and WebGet to change and read their values at runtime. 

Projects that use FlexTron do need the JavaScript Engine to be available. To copy the JavaScript Engine into the workspace, go to Tools > Add JavaScript Engine (or Update JavaScript Engine if it is already available.). The Studio will remember, in a project property, whether the JavaScript Engine should be kept up to date in this workspace. This also means that the AppHtml folder needs to be deployed with the application. 

 

A project template is now available for creating FlexTron Applications. When using this template, the Studio will also support creating / adding web views.

 

cLocalWebControlHost 

Use the cLocalWebControlHost class to host one or more web controls in a windows view or dialog. It is positioned like a windows control using the Location, Size and peAnchors properties and it can be positioned using the windows designer. Web controls can be placed as child objects inside the cLocalWebControlHost object and they are positioned using the web layout logic (piColumnIndex, piColumnSpan). They can be dropped onto the cLocalWebControlHost in the windows designer.

The cLocalWebControlHost class does not support views or navigation, the cLocalWebAppHost class should be used for that.

Toggle the Class Palette between windows and web classes using the toggle button in its toolbar or the context menu.

 

Querying using WebGet

The following example shows a slider within a web control host and a windows button shown outside of the host. In the OnClick event of the button, we query the value of the slider using WebGet.

Object oLocalWebControlHost1 is a cLocalWebControlHost 

    Set Size to 30 231 

    Set Location to 8 9 

    Set piColumnCount to 12 

 

    Object oWebSlider1 is a cWebSlider 

        Set psLabel to "Slider:" 

        Set pbShowMarkers to True 

        Set piColumnSpan to 12 

    End_Object 

End_Object 

 

Object oButton1 is a Button 

    Set Location to 57 64 

    Set Label to 'Query' 

 

    // fires when the button is clicked 

    Procedure OnClick 

        Integer iValue 

         

        WebGet piSliderValue of oWebSlider1 to iValue 

        Send Info_Box (SFormat("Slider value is %1", iValue))         

    End_Procedure 

End_Object 

 

Handling Events 

In the following example, we implement the OnChange event and keep the value of the cWebSlider in sync with the windows SpinForm. Note that we do have to enable the OnChange event using pbServerOnChange

Object oLocalWebControlHost1 is a cLocalWebControlHost 

    Set Size to 30 231 

    Set Location to 8 9 

    Set piColumnCount to 12 

 

    Object oWebSlider1 is a cWebSlider 

        Set psLabel to "Slider:" 

        Set pbShowMarkers to True 

        Set piColumnSpan to 12 

        Set pbServerOnChange to True 

        Set piSliderValue to 1 

        Set piMaxValue to 20 

        Set piMinValue to 1 

 

        Procedure OnChange String sNewValue String sOldValue 

            Integer iValue 

 

            WebGet piSliderValue to iValue 

             

            Set Value of oSpinForm1 to iValue 

        End_Procedure 

    End_Object 

End_Object 

 

Object oSpinForm1 is a SpinForm 

    Set Size to 12 100 

    Set Location to 48 114 

    Set Minimum_Position to 1 

    Set Maximum_Position to 20 

    Set Value to 1 

 

    // OnChange is called on every changed character 

    Procedure OnChange 

        String sValue 

     

        Get Value to sValue 

 

        WebSet piSliderValue of oWebSlider1 to sValue 

    End_Procedure 

End_Object 

 

Multiple Controls 

The cLocalWebControlHost class supports multiple controls and can even contain panels (cWebPanel).  

Object oLocalWebControlHost1 is a cLocalWebControlHost 

    Set Size to 199 298 

    Set Location to 1 1 

    Set peAnchors to anAll 

    Set piColumnCount to 12 

 

    Object oWebCheckbox2 is a cWebCheckbox 

        Set piColumnSpan to 12 

        Set psCaption to "Checkbox 1" 

    End_Object 

 

    Object oWebCheckbox1 is a cWebCheckbox 

        Set psCaption to "Checkbox 2" 

        Set psCSSClass to "FlipSwitch" 

        Set piColumnSpan to 12 

    End_Object 

 

    Object oWebButton1 is a cWebButton 

        Set piColumnSpan to 5 

        Set psCaption to "Save" 

     

        Procedure OnClick 

        End_Procedure 

    End_Object 

End_Object 

 

 

cDbLocalWebControlHost 

This class extends the cLocalWebControlHost class with the capabilities to host data aware controls. The controls can bind themselves to data dictionaries that are outside of the cDbLocalWebControl host.  

The example below shows a data aware cWebList showing customer information inside a windows views.

Deferred_View Activate_oTestDbList for ; 

Object oTestDbList is a dbView 

    Object oCustomer_DD is a cCustomerDataDictionary 

    End_Object 

 

    Set Main_DD to oCustomer_DD 

    Set Server to oCustomer_DD 

 

    Set Border_Style to Border_Thick 

    Set Size to 200 300 

    Set Location to 2 2 

    Set Label to "TestDbList" 

 

    Object oDbLocalWebControlHost1 is a cDbLocalWebControlHost 

        Set Size to 200 300 

        Set Location to 0 0 

        Set peAnchors to anAll 

 

        Object oWebList1 is a cWebList 

            Set pbFillHeight to True 

            Set Server to oCustomer_DD 

 

            Object oCustomer_Name is a cWebColumn 

                Entry_Item Customer.Name 

                Set psCaption to "Customer Name" 

                Set piWidth to 342 

            End_Object 

 

            Object oCustomer_City is a cWebColumn 

                Entry_Item Customer.City 

                Set psCaption to "City" 

                Set piWidth to 219 

            End_Object 

 

            Object oCustomer_State is a cWebColumnCombo 

                Entry_Item Customer.State 

                Set psCaption to "St." 

                Set piWidth to 219 

                Set pbHidden to True 

            End_Object 

 

            Object oCustomer_Zip is a cWebColumn 

                Entry_Item Customer.Zip 

                Set psCaption to "Zip" 

                Set piWidth to 219 

            End_Object 

             

            Procedure OnLoad 

                Send FindFromTop 

            End_Procedure 

        End_Object 

    End_Object 

 

Cd_End_Object 

 

cLocalWebAppHost 

The cLocalWebAppHost class is capable of hosting entire applications, including views. It implements the navigation logic and would normally be placed on a BasicPanel. You would use this to develop desktop applications with a full web UI. Windows user interface elements can only be mixed in by using dialogs. Inside the cLocalWebAppHost class, views can be included using the Use statement. This is the FlexTron version of cWebApp.

 

cLocalWebResourceManager 

For consistency and portability of code with WebApps, the same APIs for working with local files (upload and download) are available. So there is a global singleton resource manager object that can be used to generate download URLs (DownloadUrl) and for handling file uploads. Registration of download and upload folders is not required (although the APIs are available). The resource manager should use the cLocalWebResourceManager class instead of cWebResourceManager.

Use cLocalWebResourceManager.pkg 

 

Object oWebResourceManager is a cLocalWebResourceManager 

End_Object