Skip Headers
Oracle® HTML DB User's Guide
Release 2.0

Part Number B16373-01
Go to Documentation Home
Home
Go to Book List
Book List
Go to Table of Contents
Contents
Go to Index
Index
Go to Master Index
Master Index
Go to Feedback page
Feedback

Go to previous page
Previous
Go to next page
Next
View PDF

3 Running a Demonstration Application

This section describes how to run and modify the demonstration applications that install with Oracle HTML DB. Running and analyzing how an application works is an effective way to better understand how you can use Oracle HTML DB to build your own applications.

This section contains the following topics:

Viewing and Installing a Demonstration Application

Oracle HTML DB includes a number of demonstration applications you can install. Use these applications to learn more about the different types of functionality you can include in your applications.

To install the demonstration applications included with Oracle HTML DB:

  1. Log in to Oracle HTML DB as described in "Logging In to Oracle HTML DB".

    The Workspace home page appears.

  2. Click the down arrow on the right side of the Application Builder icon.

  3. From the menu, select Demonstrations.

    Figure 3-1 Application Builder Menu

    Description of app_ico_menu.gif follows
    Description of the illustration app_ico_menu.gif

    The Demonstration Applications page appears, displaying links to the following applications:

    • Sample Application offers a working demonstration that highlights basic design concepts.

    • Collection Showcase demonstrates shopping cart concepts.

    • Web Services serves an example of how you can use Web Services.

    • Presidential Inaugural Addresses demonstrates Oracle Text.

  4. To install a demonstration application, scroll down to the application you want to install and click Install.

    Installed appears in the Status column.

  5. To edit an installed demonstration application, click Edit.

  6. To run an installed demonstration application, click Run.

  7. To reinstall a demonstration application, click Re-Install.


Note:

Alternatively, you can also access demonstration applications page running the Create Application Wizard.

Running a Demonstration Application

Oracle HTML DB installs with a number of demonstration applications. Once you have installed a demonstration application you can run it from the Demonstration Applications page or from the Application Builder home page.

Topics in this section include:

Running an Application from Demonstration Applications

The simplest way to run a demonstration application is to navigate to the Demonstration Applications page.

To run a demonstration application from the Demonstration Applications page:

  1. Log in to Oracle HTML DB as described in "Logging In to Oracle HTML DB".

    The Workspace home page appears.

  2. Click the down arrow on the right side of the Application Builder icon.

  3. From the menu, select Demonstrations.

  4. On the Demonstration Applications page, locate the application you want to run.

  5. In the Action column, click Run.

  6. Enter the appropriate username and password and click Login.

    For Sample Application, enter either demo or admin for the user name and enter the current workspace name in lowercase letters for the password.

    For other demonstration applications, enter your workspace user name and password.

Running an Application from the Application Home Page

Once you have installed a demonstration application, you can run it from the Application Builder home page.

To run a demonstration application from the Application Builder home page:

  1. Log in to Oracle HTML DB as described in "Logging In to Oracle HTML DB".

    The Workspace home page appears.

  2. Click the Application Builder icon.

  3. Select an application.

    The Applications home page appears.

  4. From the View list, select Details and click Go.

  5. From the Pages list, locate the page you want to run and click the Run icon in the far right column.

  6. Enter the appropriate username and password and click Login.

    For the demonstration application Sample Application, enter either demo or admin for the user name and enter the current workspace name in lowercase letters for the password.

    For other demonstration applications, enter your workspace user name and password.

Understanding Sample Application

Each demonstration application shows a different set of features. This section describes the demonstration application, Sample Application.

Sample Application shows an easy-to-use interface for viewing, updating, and searching order and customer information for electronic and computer products. Users can navigate among the pages using the Home, Customers, Products, Orders, and Charts tabs.

Figure 3-2 Sample Application, Home Page

Description of sampl_app_plain.gif follows
Description of the illustration sampl_app_plain.gif

Sample Application demonstrates the following functionality:

The following sections describe specific functionality available on each page.


See Also:

"What Is a Page?"

About the Home Page

The Home page contains four regions:

  • My Quota

  • My Top Orders

  • Sample Application 1.6

  • Tasks

My Quota demonstrates the use of a new SVG chart called a Dial Chart. This chart displays a value based on an underlying SQL statement. Although not demonstrated in this example, you can enable an asynchronous refresh by editing the attributes of any SVG chart.

My Top Orders is a simple report based on a SQL query. This report displays a subset of the information that appears on the Orders page. Users can link to order details by selecting the Edit icon.

Sample Application 1.6 is a simple HTML region that displays static text. You can create this type of region to display explanatory information to users.

Tasks contains an Oracle HTML DB list with links to other pages in Sample Application. Links available on the Home page Tasks list include:

  • About this Application links to an informational page that describes this application.

  • Enter a New Order links to a wizard for creating a new order.

  • Add a New Customer links to a form for entering new customer information.

  • Add a New Product links to a form for adding new products.

About the Customers Page

The Customers page enables users to view and edit customer information. The Customers page consists of two main regions:

  • Customers

  • Top Customers

Figure 3-3 Sample Application, Customers Page

Description of customer.gif follows
Description of the illustration customer.gif

Customers is an updatable report for tracking customer information. This region is also based on a SQL query. To search for a customer, enter a customer name in the Search field and click Go. To sort by customer name, click the column heading. A Sort icon appears to the right of the heading, Customer Name. To update existing customer information, click the Edit icon.

Top Customers ranks customers by order amount. This report is based on a SQL query that returns top customers based on their orders.


See Also:

"Creating Reports"

About the Products Page

The Products page enables users to view and edit product information. The Products page consists of two main regions:

  • Products

  • Top 10 Products

Figure 3-4 Sample Application, Products Page

Description of products.gif follows
Description of the illustration products.gif

Products displays an updatable report for tracking product information. This region is based on a SQL query that uses of a custom function for displaying images stored in the database. To sort by product category, click the column heading. A Sort icon appears to the right of the heading. To edit a product description, click the Edit icon. To add a new product, click the Create Product button at the bottom of the page. Users can export the data in the Products report to a spreadsheet, by clicking Export to Spreadsheet.

Top 10 Products is also a SQL report. This report outlines the top ten products based on quantities sold.


See Also:

"Creating Reports"

About the Orders Page

The Orders page enables users to view and edit customer orders. The Orders page contains two regions:

  • My Orders

  • Order by Day

Figure 3-5 Sample Application, Orders Page

Description of orders.gif follows
Description of the illustration orders.gif

My Orders is an wizard report which summarizes the current orders in the system. To sort a column, click the column heading. A Sort icon appears next to column heading. To edit an existing order, click the Edit icon. To add a new order, click the Enter New Order button.

Order by Day is a Calendar report. This report displays the amount of an order on its corresponding date in a calendar. Users can select a calendar entry to view order details.

About the Charts Page

The Charts page illustrates three of the several types of SVG charts available in Oracle HTML DB: cluster bar, pie chart, and stacked bar. To view a chart, select a chart type.


See Also:

"Creating Charts"

About the Admin Page

The Admin page displays only if you log in to Sample Application using the user name admin. Sample Application makes use of a custom authentication scheme that stores user names and obfuscated passwords in a table. The Manage Users page enables you to manage additional users.

Note the this custom authentication scheme does not use any user names or passwords associated with Oracle HTML DB developers.

Viewing Pages in Printer Friendly Mode

Clicking Print in the upper right corner of the page displays the current page in Printer Friendly mode. When in Printer Friendly mode, the HTML DB engine displays all text within the HTML form fields as text.

To enable your application to display in Printer Friendly mode, you need to create and then specify a Print Mode Page Template on the Edit Application Attributes page.

Modifying a Demonstration Application

Once you understand the type of functionality available in a demonstration application, the next step is to learn more about how each page is constructed. You edit an application using Application Builder. Using Application Builder you can edit existing pages in an application, add pages to an application, or create entirely new applications.

Topics in this section include:

About the Developer Toolbar

The Developer toolbar is a quick way to edit the current application, the current running page, create a new page, control, or component, view session state, or turn edit links on or off.

Figure 3-6 Developer Toolbar in Sample Application

Description of d_toolbar_149.gif follows
Description of the illustration d_toolbar_149.gif

The Developer toolbar consists of the following links:

  • Edit Application links you to the Application Builder home page. See "About the Page Definition".

  • Edit Page accesses the Page Definition for the current running page. See "About the Page Definition".

  • Create links to a wizard for creating a new page, region, page control (item, button, branch, computation, process, or validation), or a shared control (navigation bar icon, tab, list of values, list, or breadcrumb). See "Creating an Application"

  • Session links you to session state information for the current page. See "Viewing Session State".

  • Debug toggles the page between Debug and No Debug mode. See "Accessing Debug Mode".

  • Show Edit Links toggles between Show Edit Links and Hide Edit Links. Clicking Show Edit Links displays edit links next to each object on the page that can be edited. Each edit link resembles two colons (::) and appears to the right of navigation bar items, tabs, region titles, buttons, and items. Clicking on the link displays another window in which to edit the object.

Editing a Demonstration Application

There are two ways to edit a demonstration application:

  • From Demonstration Applications page, click Edit next to the desired application.

  • If you are running an application, click Edit Page on the Developer toolbar.

The Application Builder appears. The application ID and application name display at the top of the page.

Figure 3-7 Application Builder

Description of bldr_home.gif follows
Description of the illustration bldr_home.gif

You can run the current application, edit application attributes, create shared components, export and import information, or create a new page by clicking one of the following:

  • Run Application submits the pages in the current application to the HTML DB engine to render viewable HTML.

  • Edit Attributes displays the Edit Application Attributes page.

  • Shared Components links to a new page for building shared application components and user interface controls.

  • Export/Install links you to the Export/Import Wizard.

  • Create Page links to a wizard for creating a new page.

The Pages that make up the application display at the bottom of the page. To access a specific page, select it. To search for a specific page, enter a case insensitive query for the page title or page ID in the Find field and click Go.

Viewing Underlying Database Objects

The HTML DB engine renders applications in real time based on data stored in database tables. You can view the database objects for any demonstration application in Object Browser.

To view the database objects used for an application:

  1. Navigate to the Workspace home page.

  2. Click SQL Workshop.

  3. Click Object Browser.

    Object Browser appears.

    Figure 3-8 Object Browser

    Description of o_brws.gif follows
    Description of the illustration o_brws.gif

  4. Select an object type from the Object list in the upper left corner of the page. For example, to view tables, select Tables.

  5. To search for an object name, enter keywords in the search field beneath the Object list.

    A list of matching objects appears.

    Figure 3-9 Object Browser Search

    Description of o_brws_srch.gif follows
    Description of the illustration o_brws_srch.gif

  6. To perform a specific task related to the selected object, select the object and the the appropriate task button.

    For example, to modify a column in the DEMO_CUSTOMERS table:

    1. From the Objects list, select Tables.

    2. From the Tables list, select DEMO_CUSTOMERS.

    3. Click Modify Column.

  7. To view additional object details, select a tab beneath the object name. For example, to view the data in the DEMO_CUSTOMERS table:

    1. From the Tables list, select DEMO_CUSTOMERS.

    2. Select the Data tab.

      A report appears that displays the data in the DEMO_CUSTOMERS table appears.

    Figure 3-10 Data Report on DEMO_CUSTOMERS

    Description of o_brws_tab.gif follows
    Description of the illustration o_brws_tab.gif