Application Express

APEX BY E XAMPLE : S H ARE D C OMP ONENTS IN DG

T OURN AMENT
Dimitri Gielis, Ordina Belgium
Apex Evangelists

PURPOSE OF THIS PAPER

This whitepaper covers the standard “Shared Components” in ApEx (2.2.1, updated to 3.0 beta) by giving a quick overview of
all available shared components. Afterwards it goes into more detail with an example that shows how and why a specific
shared component is implemented in the DG Tournament application (http://www.dgtournament.com).
This paper will not cover all shared components in depth, but it will show examples of how specific shared components are
used in a real world application. The goal is not to show every component completely, but I hope I can make you aware they
exist and when you’re developing, you think back “oh yes, I saw that in DG Tournament”. So you know when and how to use
them.

WHY USING SHARED COMPONENTS?

When developing an application in ApEx, did you ever ask yourself?
• How can I upload an image? Or some pdf files?
• How can I have my application look better?
• How can I add some menus to it?
• How can I add another login mechanism to it?
• How can I translate my application in French?
• How can I develop faster?

The answer on the above questions can be found in the Shared Components section of ApEx.

SHARED COMPONENTS – A QUICK OVERVIEW

Shared Components are building blocks of an application that you can use on any page in an application.
To see the Shared Components section in ApEx, follow these steps:
• Login into ApEx
• Click the “Application Builder” button
• Select (click on) your Application
• Click on the “Shared Components” button.

1 Paper #467
 Application Express

Below is a screenshot of all available shared components in APEX 2.2.1

In APEX 3.0.0 (beta) Shared Components look like this (the Application and Reports sections are new)

2 Paper #467
 Application Express

Shared Components have following sub-sections:

APPLICATION (ONLY APEX 3.0)

This section replaces the Edit Attributes button in the application section of Apex 2.2. It’s the heart of your
application. Here you define the application name, application availability and the static substitution strings. You
can also use this page to define other attributes such as build options or an application logo as well as view
associated templates and component defaults.

LOGIC
This section is used to store application information for the entire session. Also application events, the use of
external webservices or build information can be configured here. The build option is useful to only release a
specific functionality of your application when the development is completely finished.

NAVIGATION
This section allows you to make different kind of navigation. Navigation Bar, Breadcrumbs, Lists, Tabs, Trees, it’s
all there and you can combine all of them.

SECURITY
This section is about the security for your application. The way you login, through LDAP, oracle database user,
apex built-in users or a custom login mechanism. Also the use of cookies and session state information is
included. You can also define authorization schemes here, to define is a user is allowed to access a page or
component.

USER INTERFACE
This section is all about how your application looks like. There are also some reusable components included like
List of Values (LOV), user interface defaults and shortcuts.

REPORTS (ONLY APEX 3.0)

This section is completely new in Apex 3.0. Here you can create reports and configure the layout and Oracle BI
Publisher (XML Publisher) settings.

GLOBALIZATION
If you want to make a multi-lingual application, this is the section you need to look at.
You can also specify how the application language is derived. For example it can be determined via the users
browser settings or from an item.

FILES
This section gives you the possibilities to upload files into the Apex repository. Afterwards you can use these files in your
application as they reside in the database.
There are three different kinds of file groups: Cascading Style Sheets, Images and Static Files.

3 Paper #467
 Application Express

4 Paper #467
 Application Express

SHARED COMPONENTS – IN DETAIL

LOGIC

APPLICATION ITEMS

You can use Application Items to maintain session state. Application Items can be set using computations, processes, or by
passing values on a URL. Use "On New Instance" computations to set the value of items once for a session. Use Application
Items to maintain session state that is not displayed and is not specific to any one page.

In DG Tou rn ame nt

Quest ion ?
How can I keep track of who’s logged in, with which privileges and specifications?
How can I store values for the entire session?
How can I pass values from one page to five other pages?

Why ?
When you enter the application for the first time I save the “tournament name”, “id” etc. in an application item. Also
when you login, I save your credentials for example ”username”.
This allows me to know which tournament information I need to publish and who you are in every page. It also
allows me to provide user specific information.
Another useful solution is the use of Application Items for remembering the last page (navigation) the user was on or
to define date formats.

5 Paper #467
 Application Express

How ?
1. Create an Application Item

2. Populate the Application Item (through Computations, Processes, URLs)

Giving a value to the Application Item can be done on Page Level (Computation, Process, URL) or on Application
Level (Application Computation).

6 Paper #467
 Application Express

3. Use the Application Item in a Template, a Region, a Report, an Item, …

Below is anexample of using the correct tournament name and color by specifying the Application Item in the Page
Template.

7 Paper #467
 Application Express

APPLICATION PROCESSES

Application Processes run PL/SQL logic at specific points for each page in an application or as defined by the conditions
under which they are set to fire. Note that "On Demand" processes fire only when called from specific pages.

In DG Tou rn ame nt

Quest ion ?
How can I let a specific process fire?

Why ?
I integrated the ApexLib framework of Patrick Wolf in DG Tournament. The framework allows having a custom
Validation mechanism, some cascading LOVs, some Ajax in the backend etc.
Instead of adding the process on every single page, you can use an Application Process to run it on every page. The
framework recognizes when there are some cascading LOVs. This means that if I select, for example, a country in
field X that fires an AJAX call then the Auto field (dropdown) is automatically populated with data, for example, the
regions.

8 Paper #467
 Application Express

9 Paper #467
 Application Express

How ?
1. The creation of an application process

The Process Point can be “On Load”, “On Submit”, “On New Session” or “On Demand”

APPLICATION COMPUTATIONS

Use Application Computations to assign values to application and page items.

In DG Tou rn ame nt

See Application Items

Quest ion ?
How can I store values for the entire session?
How can I pass values from one page to five other pages?

Why ?
As default tournament I set the tournament that is taking place at the moment.
By using an Application Computation I set all the default parameters of the application items. (on New Instance)

10 Paper #467
 Application Express

How ?
1. The creation of an Application Computation
The below screen shows all Application Computations in DG Tournament

The detail of an Application Computation. In this case I use a SELECT to give the Application Item
“TDG_AI_TOURNAMENT_NAME” a value when the website is opened for the first time.

11 Paper #467
 Application Express

WEB SERVICE REFERENCES

The Application Express engine can use Web Service References to access a Web service across the network. The Web service
performs an action and then sends back a response.

In DG Tou rn ame nt

Quest ion ?
How can I use data from another website?
How can I integrate my site with another one?

Why ?
I used a webservice, provided by a site on the internet for accessing information about the games of the World Cup
2006. Webservices are very handy to get data from other sites or other systems. It’s a uniform recognized way of
getting the data.

12 Paper #467
 Application Express

How ?
1. Below the configured webservices of DG Tournament

2. Providing the URL of the webservice is enough for Apex to know what to do with it.

13 Paper #467
 Application Express

3. In the report you can access the webservice (xml) by following select

14 Paper #467
 Application Express

BUILD OPTIONS

Use Build Options to conditionally display specific functionalities within an application. You can use build options for almost
every attribute (page, item, …)

In DG Tou rn ame nt

Not visible from the user interface (in the backend). A specific item can be invisible when the build option is set to
exclude and becomes visible when the build option is set to include.

Quest ion ?
How can I add a new feature without interfering others?
How can I develop in production without showing the changes?

Why ?
When an application is already deployed into production and you want to add a feature which requires some work,
you can configure a build option (for ex. v1.1) and set this to exclude. When everything is ready to function and you
want to make it available you can put the v1.1 build option to include and the item/page/… will be available.

How ?
1. The detail of a Build Option

2. Build options have two possible values: INCLUDE and EXCLUDE. If you specify an attribute as being included,
then the Application Express engine considers it part of the application definition at run time. Conversely, if you
specify an attribute as being excluded, then the Application Express engine treats it as if it does not exist.

15 Paper #467
 Application Express

3. For the item you specify the build option

16 Paper #467
 Application Express

NAVIGATION

TABS

Use Standard Tabs to link users to a specific page. A Parent Tab functions as a container to hold a group of Standard Tabs.
Parent Tabs give users another level of navigation as well as a sense of place within the application.

In DG Tou rn ame nt

Quest ion ?
How can I add navigation to my application?

Why ?
I suppose everybody who already worked with Apex knows tabs. They are the most used for navigation.
In DG Tournament there’re three different parent tabs, dependent on the persons privileges one or another tab is
shown.

How ?
1. The creation of tabs is done in the below screen. You can have 1 or 2-level tabs.

17 Paper #467
 Application Express

18 Paper #467
 Application Express

2. By clicking on a tab, the below screen will be seen and the pages linked to the tab can be specified. Also the link with
a Parent tab, a logo, Authorization and when the tab will be visible can be configured.

19 Paper #467
 Application Express

LISTS

A List is a template driven, shared collection of links. Use Lists to add navigation to your application.

In DG Tou rn ame nt

Quest ion ?
How can I add navigation to my application?
How can I make drop down / DHTML menus?

Why ?
If the admin user logins into the system, he gets an extra navigation. Through this navigation he can update matches,
look at users, create new tournaments and teams etc. This navigation was created through lists.
A list allows more hierarchy in the navigation.

20 Paper #467
 Application Express

How ?
1. The screenshots of the creation of a list are below

2. A list does exists out of List Entries

21 Paper #467
 Application Express

3. Creating a new list entry

22 Paper #467
 Application Express

BREADCRUMBS

Breadcrumbs provide hierarchical navigation to any number of levels. Once a breadcrumb is created, breadcrumb entries can
be defined. To define breadcrumb entries click on the breadcrumb name.
Breadcrumb entries are associated with pages and also identify a parent page. Breadcrumbs can be displayed on a page by
adding a breadcrumb region using the create region wizard.

In DG Tou rn ame nt

I choose to not use breadcrumbs directly in DG Tournament, however do I use them much of the time when
working with ApEx.

Quest ion ?
How can I add navigation (breadcrumbs) to my application?
How can I create a wizard like application?

Why ?
A possible utilization of a breadcrumb could be to go further in the tree or a wizard like application. Go from step 1
to step 2 to step 3 to …
Breadcrumbs are used a lot in the Apex Development framework.

How ?
1. Below the screens how to create or edit a breadcrumb

2. Select the breadcrumb entry

23 Paper #467
 Application Express

24 Paper #467
 Application Express

3. Edit/Create a new breadcrumb entry

25 Paper #467
 Application Express

TREES

A Tree is a hierarchical navigation mechanism. You can create a Tree from a query that specifies a hierarchical relationship by
identifying an ID and parent ID column in a table or view.

In DG Tou rn ame nt

Quest ion ?
How can I add navigation (tree) to my application?
How can I add a hierarchy between values?

Why ?
Trees are a very interesting structure to use as navigation, as they allow you to dig deeper in the tree.
In DG Tournament they are used to show which users are registered for the tournament. Also the use of icons make
it very user friendly.

26 Paper #467
 Application Express

How ?
1. The creation of a tree comes to the basic of writing the correct select statement and to customize the lay-out.

27 Paper #467
 Application Express

28 Paper #467
 Application Express

NAVIGATION BAR ENTRIES

Navigation Bar Entries provide hypertext link based navigation. Placement is determined by page templates.

In DG Tou rn ame nt

I didn’t use navigation bar entries directly in DG Tournament, but I use them all the time by working with ApEx.
(when you logout)

Quest ion ?
How can I add navigation to my application?

Why ?
Some people prefer to use other navigation ways than the previous possibilities. This is just an extension of all
available navigation methods. This method exists out of unique/stand-alone navigation items, like
for ex. help and logout

How ?
1. The creation of a Navigation Bar Entry

29 Paper #467
 Application Express

2. Create/Edit a Navigation Bar Entry

30 Paper #467
 Application Express

SECURITY

AUTHENTICATION SCHEMES

The method users are using to identify themselves to gain access to an application.
You can establish a user's identity by selecting from a number of built-in authentication methods, or by using a wizard to
create your own custom authentication approach.
The process of establishing the identity of a user before they can access an application. Authentication may require a user
name and password, or may involve the use of a digital certificate or a secure key.

In DG Tou rn ame nt

Quest ion ?
How can I add a logon page to my application?
How can I give people access to my application?

Why ?
An Authentication Scheme is a saved configuration you can apply to your application.
You apply an Authentication Scheme to an application by designating it as current and clicking the make current link.
To turn off authentication you must create and make current a No Login Authentication scheme.

The default ApEx Authentication Scheme is only interesting for a limited amount of users. The users are created in
Apex with the possibility of three different roles: Admin, Developer or End User.
In a normal website you’ll use your own Authentication Scheme based on a users table or you’re using an LDAP

31 Paper #467
 Application Express

server to get the user information.

I’ve chosen for a custom developed Authentication Scheme based on my users table. Everyone can register for a free
account (= record in my users table) and have immediate access to the application.

How ?

1. Some pages aren’t accessible for the public, so they need Authentication.

2. The different Authentication Schemes in DG Tournament (the one with the flag is used)

3. Possibility to create a new Authentication Scheme based on a pre-configured scheme from the gallery

32 Paper #467
 Application Express

4. Below the one I use in DG Tournament. The Authentication Scheme is based on a custom made function
(tdg_fn_custom_auth) which returns a boolean. I also run a procedure at the end to retrieve some user information.

33 Paper #467
 Application Express

AUTHORIZATION SCHEMES

You manage authorization for applications, pages, and most other components using Authorization Schemes.
You associate an Authorization Scheme with an application, page, or other component on the component's attributes page.
Authorization Schemes are pass/fail checks. Common Authorization Scheme types include Exists, Not Exists SQL Queries,
and PL/SQL Function Returning Boolean.
To enhance performance, the success or failure of an Authorization Scheme is cached on a per-session or per-page view basis.

In DG Tou rn ame nt

Quest ion ?
How can I give certain people access to certain areas of my site?
How can I create roles in ApEx like I can in the database?

Why ?
A normal user can bet on the games, edit their profile, add shout messages etc. but a normal user isn’t allowed to add
games to the schedule or edit the official scores. If a user has the Editor role, he’s allowed to do this.
An Administrator in DG Tournament has access to all pages in the application.
So I use the Authorization to control who has access, can see and can do something.
34 Paper #467
 Application Express

How ?
1. If you can see the page depends on if you’re authorized to see it. The below page request the TDG_Admin
authorization.

2. The different Authorization Schemas in DG Tournament

3. The TDG_Editors authorization is based on a PL/SQL Function Returning a Boolean (True/False)

35 Paper #467
 Application Express

SESSION STATE PROTECTION

Enabling Session State Protection can prevent hackers from tampering with the URLs within your application. URL tampering
can adversely affect program logic, session state contents, and information privacy.

In DG Tou rn ame nt

Quest ion ?
How can I protect my site?
Is my site secure for hackers?

Why ?
For security reasons! URL Tampering - Web based applications, including those developed in Oracle Application
Express often pass values from one page to another through a URL. A clever enough user may observe this and
override a value by typing his own value in the location field of his browser.
For example in DG Tournament, when logged in as Admin, I can see a list of all users. When I click on that user for
his details I see the same screen as a normal user would see in the “Your Profile” page. The URL that’s doing that call
looks like this:
f?p=103:10:240848379705417::NO::P10_USER_ID:70

36 Paper #467
 Application Express

My application is 103, on page 10 with session id 240848379705417 (my session has a unique nr) you see at the end:
P10_USER_ID:70 which means that my record (Dimitri Gielis) is user_id 70. By putting this in the url, the session
knows about this value.
When “Session State Protection” is disabled you can easily see another user by changing the url to
f?p=103:10:240848379705417::NO::P10_USER_ID:71
This will give me the record (user) with user_id 71, without passing through the application I can obtain other
information.
When “Session State Protection” is enabled you get a message like on the above screenshot, which tells you that the
session state protection is violated.

How ?
1. At the moment the Session State Protection is disabled.

2. To enable, disable, or configure Session State Protection using a wizard, click Set Protection.

3. Click the Enable Session State Protection button

37 Paper #467
 Application Express

4. We can see that the Session State Protection is now Enabled

5. By clicking on the Page button you get following screen

38 Paper #467
 Application Express

6. Select the page you want to protect, in DG Tournament for example User Detail and change the Page Access
Protection.
You can also go onto Item level to set the protections.

7. That will add to the end of the url a checksum. An example of the previous url, but protected:
f?p=103:10:240848379705417::NO::P10_USER_ID:70&cs=3831E8EB498FF406064BE08337E72A9DF
When you try to change the user_id from 70 to 71 you get a message that the session state protection is violated.

39 Paper #467
 Application Express

SECURITY ATTRIBUTES

Use this page to set application wide security settings. Use application component definition pages to manage more granular
settings.

In DG Tou rn ame nt
NA

Quest ion ?
Where can I change the login and home URL?
Where can I specify which Oracle schema he should look at?

Why ?
This is mainly used to define the Home Link and Login URL. There’s also an overview of other security settings, like
Session State Protection, Authorization and Authentication Scheme.

How ?
1. A screenshot below of all available options to configure.

40 Paper #467
 Application Express

USER INTERFACE

THEMES

A Theme is a named collection of templates used to define the user interface of an application.

In DG Tou rn ame nt

See homepage.

Quest ion ?
How can I change the lay-out of my site?
I don’t want to have a standard pre-defined theme, what can I do?

Why ?
I created a new theme called TDG. That way I had a unique name and could attach my custom made templates to this
theme.

How ?
1. The Themes page

41 Paper #467
 Application Express

TEMPLATES

The Application Express engine constructs the appearance of each page in a application using Templates. Templates define
how pages, page controls, and page components display.

In DG Tou rn ame nt

Quest ion ?
How can I change the lay-out of my site?
I don’t want to have a standard pre-defined template, what can I do?

Why ?
A theme exists out of different templates: page, region, reports, buttons etc.
There are also some preconfigured templates in ApEx, but I didn’t use them in DG Tournament, I used a completely
new template. For example, on the homepage you see a page template, a region template and 3 report templates.
If you know a bit of html and css (stylesheets), anything is possible for your website design. The sky is the limit as at
the end of the day it is just html.

42 Paper #467
 Application Express

How ?
1. Below the available templates, you can create new ones or edit existing ones.

2. Below an example of how a template looks like. It is html linked with stylesheets and ApEx tags (the ##)

43 Paper #467
 Application Express

USER INTERFACE DEFAULTS

User Interface Defaults are used to populate initial values for region and item properties providing consistency across multiple
pages in an application or multiple applications.

In DG Tou rn ame nt

I didn’t use User Interface Defaults in DG Tournament, but I did use it for the Apex-Meetup application for
Collaborate 07.

Quest ion ?
How can I develop faster?
Why does ApEx always create a Textarea instead of a Textbox!?

Why ?
User Interface Defaults can be really handy when you develop a lot of screens on the same table or view. Instead of
changing the item properties on every page, you can change the properties in “User Interface Defaults” and when the
pages are created, Apex knows which properties (textfield, default value, length of field, …) he needs to set. This can
be a manner for working quicker. This shared component is also cross application.

How ?
1. In the “User Interface Defaults” page all available tables and views are shows. For these tables and views you can
define default properties. I selected the Collab07 table which contains the persons names and the dates they prefer to
have the Apex-Meetup.

44 Paper #467
 Application Express

2. Clicking on the table shows this screen. If there’re not any defaults yet, you can enable them.

3. The next screen shows all available columns. These columns are possible items. You can set some defaults for these
items, so that when a new Page / Region / Item is made, these defaults can be applied.

4. Another view on these columns. Grid Edit.

45 Paper #467
 Application Express

5. Below the screen which defaults you can set for a column. For ex. if it’s a Textfield or a Textarea. What the format
mask is, or the label etc.

6. If you create a new page based on the table where you stored some User Interface Defaults, the defaults you set are
taken instead of the ones ApEx thought they were. It works great!

46 Paper #467
 Application Express

LIST OF VALUES

A List of Values can be referenced by page items as well as report fields. It controls the values displayed and limits the user's
selection. Lists of Values can be static (based on values you enter) or dynamic (based on a SQL query).

In DG Tou rn ame nt

Quest ion ?
Do I always need to type that static/dynamic LOV?
How can I create a drop-down list?
How can I create a pop-up list?

Why ?
Instead of creating a select statement for every new drop-down list, I use LOV (List Of Values). I can reuse this LOV
on every page where I need it and I’m sure the select statement is always identical. The statements being identical have
also a positive impact on performance. More information about performance, search in Google for Oracle Cost Based
Optimizer (or look at Jonathan Lewis website or books).

47 Paper #467
 Application Express

How ?
1. Below a screenshot of all LOV’s in DG Tournament.

2. An example of a LOV, with a select statement.

48 Paper #467
 Application Express

SHORTCUTS

Use Shortcuts to write frequently used code once and then reference it in many places within your application. Shortcuts also
allow for dynamic generation of code in places that typically only support static text.

In DG Tou rn ame nt

Quest ion ?
Do I always need to type that whole javascript/text?
How can I reuse some javascript?

Why ?
Shortcuts are used to integrate the FCK Editor (rich html editor) in DG Tournament. Shortcuts, as the name says it,
are names given to pieces of code.
Why did I use Shortcuts to integrate the FCK Editor? Because a shortcut is also a “reusable component”; I’ve only on
one place my code and I can reuse it everywhere by using the Shortcut. If tomorrow I want something different, I
only need to change it in one place.

49 Paper #467
 Application Express

How ?
1. Below the Shortcuts in DG Tournament

2. By clicking on EDITOR, below the content (code) of the Shortcut

The code of the INCLUDE_EDITOR is:

<script type="text/javascript" src="/fckeditor/fckeditor.js"></script>

50 Paper #467
 Application Express

3. To integrate the FCK Editor follow these steps (based on the forum post of Guido Zeelen):
o Download (from http://www.fckeditor.net/) and copy FCK Editor to the HTTP Server
o Best Practice: Create a custom directory and place FCK Editor there.
For example: /fckeditor
This will prevent FCK Editor from being overwritten or removed when upgrading ApEx
o Create 2 Shortcuts: EDITOR and INCLUDE_EDITOR (see above)
o Add the INCLUDE_EDITOR shortcut to the HTML Header portion of the page

o Add the EDITOR shortcut to the Post Element Text section of a text area item

o Run your page again, you’ll see the new FCK Editor instead of the standard Textarea

51 Paper #467
 Application Express

GLOBALIZATION

TRANSLATE APPLICATION

Applications can be translated from the primary language into another language.

In DG Tou rn ame nt

The World Cup 2006 application was translated in Dutch, French, Japan and Chinese, but DG Tournament isn’t
translated yet.

Quest ion ?
How can I get my application in more languages?

Why ?
When you live in Europe (especially Belgium), a multi-lingual application is almost always necessary.
In the United States only English is needed.

How ?
1. To create a multi-lingual application follow the guidelines (wizard) as seen below

2. Showing every step of this translation process doesn’t make part of this whitepaper, in fact that could be another
whitepaper!
Nevertheless some tips you can use when you need to translate your application:
o A new ApEx application is created after the first step. The way you get to that application depends. For ex.
you’ve three different versions of your application (English, French, Dutch)
You can let the browser decide which language (application) is will show. Another possibility is the use of an
item or application preference. (see also: EDIT GLOBALIZATION ATTRIBUTES)
o Not only the ApEx text must be translated, but your data schema in the database should be “multi-lingual”
too.
o The translation mechanism works with XLIFF files. You can use a XLIFF editor to ease the translation job.
There exist also some applications to help you with this translation.

52 Paper #467
 Application Express

TEXT MESSAGES

Text Messages can be used to build translatable text strings with substitution variables that can be called from PL/SQL
packages, procedures, and functions.

In DG Tou rn ame nt

In use by the ApexLib framework of Patrick Wolf, which is integrated in DG Tournament

Quest ion ?
How can I get my application/custom text and error messages in more languages?

Why ?
It’s possible to specify for one Text Message multiple languages, so that dynamically the right text is shown

How ?
1. The Text Messages included in DG Tournament. By clicking on the Name you can change the values.

53 Paper #467
 Application Express

EDIT GLOBALIZATION ATTRIBUTES

Identify the globalization attributes of your application. Application translations are available by following the links provided
below.

In DG Tou rn ame nt

NA

Quest ion ?
How can I set my primary language of my application?
How does the application now which language I want to see?

Why ?
You can specify the Primary (default) language of your application as well as where the language should get derived
from.

How ?
1. A screenshot where to configure these settings

54 Paper #467
 Application Express

FILES

CASCADING STYLE SHEETS

Uploaded Cascading Style Sheets are available to any application created by your workspace. The Cascading Style Sheets are
written to the file system, so you can reference them in your HTML source code.

In DG Tou rn ame nt

Quest ion ?
How can I adapt my lay-out?
How can I add my own home-style/css?

Why ?
DG Tournament has its proper Cascading Style Sheet (css). In this stylesheet all lay-out, specific styles etc. are
specified.
The DG Tournament css has also all the necessary to let highslide to work. Highslide is the feature to enlarge a
picture (on the screenshot: in the Bet Rank page you can enlarge the users). More information about integrating this
feature (Thumbnail expander – Highslide) in an ApEx application, on my blog at:
http://dgielis.blogspot.com/2007/01/dgt-explained-1-bis-thumbnail-expander.html

55 Paper #467
 Application Express

How ?
1. Show the available Cascading Style Sheets

2. The creation of a new Cascading Style Sheet, consist out of uploading your css file.
You can use for ex. a specialist CSS software to create a new stylesheet and afterwards upload it to ApEx
This css is available for the entire workspace.

3. Once uploaded, you can edit your stylesheet through the ApEx interface.

56 Paper #467
 Application Express

IMAGES

Application Express images are divided into two categories:

- Workspace images are available to all applications for a given workspace
- Application images are available for only one application

In DG Tou rn ame nt

Quest ion ?
Where can I store my images?

Why ?
In DG Tournament another table exist with all images, however I also use the Images from the Shared Components.
In general, I use my own table for “real customer data” and the Images in Shared Components for the layout. The
above banner for ex. is in the Shared Components Images

57 Paper #467
 Application Express

How ?
1. An overview of the Images repository.
By clicking on the file name, you can add notes to it or link it with an application. If it’s not linked with an application
it’s a workspace image, so available for all applications.

2. Creating a new image requires an upload of your picture (for ex. a png, gif, jpg-image)

3. Getting the image on the screen in a template/page/region depends on if an application is associated or not. If an
application is associated you use #APP_IMAGES#, if no application associated (so workspace level) you use
#WORKSPACE_IMAGES#.
If you want to link to an image on your file system use #IMAGE_PREFIX#

58 Paper #467
 Application Express

STATIC FILES

Use this page to upload, edit, and delete static files.

You may edit static files smaller than 30,000 bytes by selecting the file. Otherwise, you must edit the file offline and upload it
again.

In DG Tou rn ame nt

Not viewable

Quest ion ?
Where can I store my files?

Why ?
If there’re only a little amount of files, it’s a good idea to upload them to the Static Files in Shared Components.
Backups, everything on one place etc. are reasons to go for that idea. However if you’ve a lot of files (for ex. for
integrating the FCK Editor) I would go for storing the files on the file system (in a separate folder).

How ?
1. The overview of the Static Files in DG Tournament. In fact these are all old files, initially for the thumbnail expander
feature and the ApexLib framework. The newest versions of these packages have more than one file, so now they’re
stored on the file system.

2. If the file isn’t too big, you can edit it online, otherwise you may need to edit it offline and upload it again.

3. Creating a new Static File is almost the same as with the upload of an image except that you can also specify the
character set of the file.

59 Paper #467