Perforce JViews TGO Sample: JSF Network Component - Customizing Business Objects
Description
This sample shows how to perform advanced customization of the JViews TGO Look-And-Feel on a Faces application.
How to Use the Sample
- The contextual menu (right click) can be used for several operations:
- Managing the alarm state of selected objects in the Network view
- Enabling or disabling interaction of different types: selection, zooming and panning
- Zooming in or out; or showing all objects in the view
- The toolbar can be used for operations, such as:
- Enabling or disabling interaction of different types: selection, zooming and panning
- Zooming in or out; or showing all objects in the view
- The overview can be used to select the region being viewed in the Network view
- The message box shows messages that provide information to users on the name of an interactor when hovered the buttons in the toolbar
Installing the Thin-Client Sample
The sample contains a WAR file (Web Archive) that allows you to easily install the sample on any server that supports the Servlet API 2.1 or later. For your convenience, the WAR will be copied to the Tomcat web server that is supplied with the Perforce JViews installation when you start the server using the supplied scripts. Tomcat is the official reference implementation of the Servlet and JSP specifications. If you are already using an up-to-date Web or application server, there is a good chance that it already has everything you need. The sample can also be deployed to WebSphere Application Server (WAS).
Running the Sample Using Tomcat
If you intend to use the Tomcat Web server provided with this
installation, follow these instructions to start the server:
Running the Server-Side Samples.
The scripts to start the server can be found in the
tools/tomcat-jsf directory.
Note: if you are running on Windows then you will find menu items in
the Windows "start" menu to start and stop the Tomcat server.
Once the server is running, you can see the sample by opening the following page:
- Perforce JViews TGO Sample: JSF Network Component - Customizing Business Objects
http://localhost:8080/jsf-network-customization
Running the Sample Using WebSphere Application Server
In addition to the instructions provided for using Tomcat, the samples can be
viewed on WebSphere Application Server. Follow the instructions:
Running the Server-Side Samples
and use the scripts to start the server and deploy the sample.
Once the server is running, you can see the sample
by opening the following page:
http://localhost:9443/jsf-network-customization
The WAS administrative console can be used to verify or modify server settings:
http://localhost:9043/ibm/console/
Note: the WAS server can start on a range of port numbers, therefore the value
is not guaranteed to remain the same.
The scripts provided with the samples can be used to obtain the port numbers used
by the Admin Console
and by the deployed Web applications.
To retrieve a list of all the WAS port numbers, run the command line instruction:
ant -f build_was.xml ws.list.ports
Topics Covered
- Advanced Customization of the business objects' Look-And-Feel
- JViews TGO Faces Network View Component
- JViews TGO Faces Select Interactor
- JViews Framework Faces Overview within JViews TGO
- JViews Framework Faces Contextual Menu within JViews TGO
- Integration of Server Actions in the Contextual Menu
- Integration of Client Actions in the Contextual Menu
- JViews Framework Faces Interactors within JViews TGO
- JViews Framework Faces Image Button within JViews TGO
- JViews Framework Faces Message Box within JViews TGO
- JViews Framework Faces Contextual Menu Control
- Advanced Look-And-Feel customization
- Styling Customization of JViews Framework and TGO Faces Components
Detailed Description
This sample shows how to perform advanced customization of the JViews TGO Look-and-Feel on a Faces application. It uses part of the customization illustrated in the samples/integration/customization
sample and adapts it to be used in a Faces application scenario.
It is important to understand that this sample uses as an implementation of the AbstractSampleContext
, namely the SampleContext
, that serves as:
- A context holding the beans needed by this sample
- The abstraction in charge of initializing the sample for execution
AbstractSampleContext
.
This sample uses the following types:
-
SampleContext
This implementation of theAbstractSampleContext
:- Creates an
IlpNetwork
in itscreateComponent
method - Initializes this
IlpNetwork
with the default TGO projectproject.itpr
located inwebpages/resources/configuration/projects
- Initializes this JViews TGO runtime with the custom settings defined in the
settings.css
file located inwebpages/resources/styles
which contains the customizations that define the custom network element type and the adjustments in the representation of links, links states and information window that are illustrated in this sample
- Creates an
-
action.AlarmStateHandler
This is thejavax.faces.event.ActionListener
implementation that handles the management of alarm changes in the TGO object state when triggered by the contextual menu -
popup.PopupMenuFactory
This isilog.views.util.servlet.IlvMenuFactory
implementation that populates the contextual menu for theIlpNetwork
when right clicked -
renderer.NEBaseRendererFactory
This is theilog.tgo.graphic.renderer.IltNEDirectImageBaseRendererFactory
implementation that provides anilog.tgo.graphic.renderer.IltBaseRenderer
implementation that is used to render the custom network element type. This implementation,renderer.NEBaseRendererFactory.NEBaseRenderer
extends theilog.tgo.graphic.renderer.IltNEDirectImageBaseRendererFactory.BaseRenderer
in that it draws additional borders for objects that are selected
index.jsp
that is located in webpages
directory. This JSP file defines all the JViews Framework and JViews TGO Faces components that compose and support the sample's user interface. For example, the Network View Faces component is initialized in this file to use as its IlpContext
and its associated IlpNetwork
, the IlpContext
and IlpNetwork
instances that are contained in the SampleContext
. The standard JSF Expression Language syntax is used to specify this association: <jvtf:networkView context="#{sampleContext.context}" network="#{sampleContext.network}" ... >
.
This sample has the following directory structure:
-
webpages/resources/configuration/deployment
Contains the JView TGO deploment settings (deploy.xml
) -
webpages/resources/configuration/projects
Contains the JViews TGO project that is used by theIlpNetwork
(project.itpr
) -
webpages/resources/data
Contains the network data file that is displayed in the Network view (network.xml
) -
webpages/resources/images/backgrounds
Contains the image that is used as the Network view background (background.jpg
) -
webpages/resources/images/customization
Contains the images that are used to customiza the Look-And-Feel -
webpages/resources/images/popup
Contains the images that are used by the contextual menu -
webpages/resources/images/toolbar
Contains the images that are used by the toolbar -
webpages/resources/styles
Contains the CSS files that define the sample's:- Network configuration (
network.css
) - Look-And-Feel (
alarm.css, bellcore_desktop.css, bellcore_laptop.css, bellcore_network.css, bellcore_printer.css, bellcore_server.css, object.css and sonet.css
) - JViews TGO settings that define the custom network element type and the adjustments in the representation of links, links states and information window (
settings.css
) - HTML CSS styles that customize the Look-And-Feel of the HTML page itself (
style.css
)
- Network configuration (
resource
and source
files themselves.
Installation Directory
The JSF Network Component - Customizing Business Objects sample is installed here.
Classes Involved
- ilog.tgo.faces.service.IltFacesDefaultContext
- ilog.tgo.graphic.renderer.IltBaseRendererFactory
- ilog.tgo.graphic.renderer.IltBaseRenderer
- ilog.cpl.util.IlpI18NUtil
- ilog.views.faces.dhtml.IlvDHTMLConstants
- ilog.views.faces.dhtml.event.FacesViewActionListener
- ilog.views.util.servlet.IlvMenuFactory
- ilog.views.util.servlet.event.JavaScriptActionListener
- ilog.views.util.servlet.model.IlvMenu
- ilog.views.util.servlet.model.IlvMenuItem
- ilog.views.util.servlet.model.IlvMenuSeparator
- ilog.views.util.servlet.event.ServletActionEvent
Source Files
- SampleContext
- AbstractSampleContext
- action.AlarmStateHandler
- popup.PopupMenuFactory
- renderer.NEBaseRendererFactory