Define the App Constructor

In most cases, apps are defined as a unique class, identified as the jslcass in the App Specification. The constructor for this class is defined in the JavaScript library for the app, SampleTable/js/app.js.

Open app.js in the editor of your choice. This contains the constructor for the Sample.Hello class for the Hello World sample app:

Sample.Hello = function( app ) {
jQuery( app.rootElement ).find( '.helloString' ).html(
app.getPropertyValue( 'helloString' )
)
};

It is a best practice to define your app classes in a unique name space to ensure there are no JavaScript conflicts with other apps or with the containing page where apps are deployed. To do this, remove the sample code and declare your name space:

The Presto.namespace function is defined in PC4JS and thus automatically available in any app.

Next, we define a constructor for the app class:

Presto.namespace("Sample");
Sample.SimpleTable = function( app ) { };

The App framework uses this constructor to instantiate the app and passes a reference to the app to the constructor.

Note:

This example defines the constructor directly in the class for the app. For some apps, you may need to define the class constructor using the onLoad method instead. See Create the App Constructor Using onLoad for more information.

Next we take care of two very common requirements: getting a reference to the root node for the app and getting a connection to the Presto Server:

Presto.namespace("Sample");

Sample.SimpleTable = function( app ) {
var rootDiv = jQuery(app.getRootElement);
var myTbl = rootDiv.find('.myTable');
var connection = app.getConnection();

};

The app.getRootElement() function from the Presto App API returns the app root node. (See The Structure of a Presto App and Presto App API documentation for more information.) For later simplicity, this also gets a reference to the table in the app, using jQuery find(selector) starting from the app’s root node.

Lastly, it uses app.getConnection() to get the default connection to the Presto Server. The default connection connects to the Presto Server that hosts the app, which in this case is the Presto Server hosted in the same application server as your sample custom app.

Note:

For detailed API information, see the . Presto App API Reference.

The last step is to update the App Specification to use this class. Open SampleTable/app.xml if needed and change the jsclass attribute to use the new class name:

<app id="SampleTable" name="SampleTable"
jsclass="Sample.SimpleTable" height="200" width="200"
draggable="false" minimizable="false">
<title>Sample Table</title>
...
</app>