Deploying as a Non-Console Application

A non-console application is a deployed General Interface application that occupies a portion of a web page. Multiple General Interface applications can be deployed in a single web page. This is useful if you have multiple applications that interact with each other.

Non-console applications can be inserted into an existing web page using div elements. When the web page is loaded, the General Interface Framework initializes. Then the General Interface applications are loaded.

Using a DIV Element

Use the Inline DIV tab of the Deployment Utility to automatically generate the HTML markup for the div element. Simply copy and paste this generated markup into the existing web page.

To generate the HTML markup for a div element,

1. Select Project > Deployment Utility from the General Interface Builder menu.
2. Click the Inline DIV tab.
   
   Click here to expand screenshot...
   
   
   
   
3. Copy the text in the lower pane of the tab and paste into an HTML page.
   The following template is used for creating a div element:

   <div style="width:100%;height:400px;">
        <script type="text/javascript" src="JSX/js/JSX30.js"
           jsxapppath="../workspace/JSXAPPS/MyProject">
        </script>
      </div>

   The script element contains src=" JSX/js/JSX30.js", which is the relative path from the web page to the General Interface runtime file, and jsxapppath, which is the relative path from the web page to the project directory.

4. Close the Deployment Utility.
5. Modify the HTML markup as needed to customize the page.

To insert multiple applications in one web page, the src attribute must be identical and the path to the JSXAPPS directory must be the same. For a parameterized src URI, only the attribute before the "?" needs to be identical. The query can be different. For example, these are considered identical even though the parameters are different. Note that the path to the JSXAPPS directory is the same, as required. src=" JSX/js/JSX30.js?jsxapppath=../workspace_/JSXAPPS/project1_path_"and src=" JSX/js/JSX30.js?jsxapppath=../workspace_/JSXAPPS/project2_path_". For more information on parameters, see Deployment Parameters.

Example

General Interface Builder generates the following div elements for two of the General Interface Builder sample applications:

<div style="width:100%;height:400px;">
  <script type="text/javascript" src="JSX/js/JSX30.js"
     jsxapppath="../workspace/JSXAPPS/samples/WSDL_Mapping_1">
  </script>
</div>

<div style="width:100%;height:400px;">
  <script type="text/javascript" src="JSX/js/JSX30.js"
     jsxapppath="../workspace/JSXAPPS/samples/WSDL_Mapping_2">
  </script>
</div>

When this HTML markup is inserted in an HTML page, the applications are loaded in the same HTML page.

Deployed Applications and the Progress Bar

To prevent General Interface progress bars from overlapping when deploying multiple applications in the same page, add position:relative in the div element of both deployed applications. For example,

<div style="width:100%;height:400px;position:relative;">
   <script type="text/javascript" src="/3.5/GI/JSX/js/JSX30.js"
      jsxapppath="/3.5/GIApps/JSXAPPS/chart/">
    </script>
   </div>

   <div style="width:100%;height:300px;position:relative;">
   <script type="text/javascript" src="/3.5/GI/JSX/js/JSX30.js"
     jsxapppath="/3.5/GIApps/JSXAPPS/WSDL_Mapping_1/">
    </script>
   </div>

The following figure shows an example.