You are on page 1of 43

IBM Software Group

Adding a Graphical User Interface to your WebSphere Application Server Jython Scripts with Swing
Bob Gibson <bgibson@us.ibm.com> Advisory Software Engineer 8 November 2011

WebSphere Support Technical Exchange

IBM Software Group

Agenda

Intentions Starting simple Challenges and opportunities Jython advantages Using rapid prototyping Putting things together

WebSphere Support Technical Exchange

2 of 43

IBM Software Group

Background / impetus: ugly is easy


With little effort, we can show what ports are in use:
print AdminTask.listServerPorts( 'nodeagent' )

WebSphere Support Technical Exchange

3 of 43

IBM Software Group

A simple script to show port numbers

WebSphere Support Technical Exchange

4 of 43

IBM Software Group

Simple text input / output: a little harder


Text output is relatively easy, but user hostile

WebSphere Support Technical Exchange

5 of 43

IBM Software Group

Swing is all about Input & Output


High level presentation object include:
Trees, Tables, and Lists

Low level presentation objects include


Labels, fields, text areas radio buttons, check boxes, sliders trees, tables, buttons, images

WebSphere Support Technical Exchange

6 of 43

IBM Software Group

Components and containers


Most swing objects are components Some components are also containers Component class names start with J
Note: In order to be seen, a component must be within a container Top level containers: heavyweight JFrame, JApplet, JWindow, JDialog Cant be put into other containers Lightweight containers: used to group components

WebSphere Support Technical Exchange

7 of 43

IBM Software Group

Good news / bad news


Good news:
There are lots of swing books, articles, tutorials, demonstration applications, web sites, and documentation

Bad news:
Not all of the examples you see are good Best practices have changed (somewhat) over time

WebSphere Support Technical Exchange

8 of 43

IBM Software Group

Learning to use swing


Look for swing examples, demos, tutorials Practice converting Java swing apps to Jython
Read, study, experiment (play), repeat Things to consider: Some examples derive from ActionListener Jython doesnt have anonymous inner classes Some examples dont use dispatch thread Note: Be prepared for bad examples
9 of 43

WebSphere Support Technical Exchange

IBM Software Group

A trivial Jython swing application


import the required Java & Swing classes Define our application class Define a Runnable class Use SwingUtilities.invokeLater() for thread safety
(to use dispatch thread cycle) Notes: Application class is derived from JFrame Our class is instantiated by a Runnable class We need to keep script running (raw_input())

WebSphere Support Technical Exchange

10 of 43

IBM Software Group

Trivial Jython swing application (cont)

WebSphere Support Technical Exchange

11 of 43

IBM Software Group

Trivial application what it can do


This application can already be:
Moved Resized Maximized Minimize Restored, and Closed (terminated) All of this with no additional code!
WebSphere Support Technical Exchange 12 of 43

IBM Software Group

Do we really need to invokeLater?


Swing applications are event driven
e.g., keystrokes & mouse clicks Events are generated and passed to the application Events are received and processed by event handlers Event handlers are executed on the event-dispatch thread, not your application thread So, our applications should be implemented accordingly

WebSphere Support Technical Exchange

13 of 43

IBM Software Group

Challenges (part 1)
Fight the temptation to throw things together

Try to avoid the urge to keep everything in 1 class

WebSphere Support Technical Exchange

14 of 43

IBM Software Group

Opportunities
Jython scripts have complete access to all of the
Java Swing object / classes / components Converting Java Swing examples to Jython can be quite simple (as long as you can read & understand Java) Remember: Jython isnt strongly typed like Java Unlike Java, Jython object attributes arent fixed; we can add to, and remove from them

WebSphere Support Technical Exchange

15 of 43

IBM Software Group

Simple Button Example

WebSphere Support Technical Exchange

16 of 43

IBM Software Group

More challenges and opportunities


Often, there are many ways to do something
e.g., Positioning application window using AWT

vs. using a possibly obscure method

There are many, many more examples

WebSphere Support Technical Exchange

17 of 43

IBM Software Group

Some Jython advantages


Java frequently requires many statements:

Jython lets us do more things at once:

WebSphere Support Technical Exchange

18 of 43

IBM Software Group

Positioning components
Given a container (e.g., JFrame), and some
number of components, how do we position them? By selecting a Layout Manager for the container
LayoutManager Description FlowLayout BorderLayout GridLayout BoxLayout SpringLayout Positions components left-to-right, top-to-bottom Positions components within the center or the borders of the container (default) Lays out components within a grid Lays out components vertically or horizontally within a box Lays out components subject to a set of constraints

WebSphere Support Technical Exchange

19 of 43

IBM Software Group

Layout can be somewhat challenging

WebSphere Support Technical Exchange

20 of 43

IBM Software Group

Where were we?


Initial idea
Display AppServer port numbers using a GUI Where should we start? How can we show the server in our cell? One way is to use a tabbed pane What would that look like?

WebSphere Support Technical Exchange

21 of 43

IBM Software Group

Using JTabbedPane

WebSphere Support Technical Exchange

22 of 43

IBM Software Group

What have we learned?


Advantages:
Simple to implement JTabbedPane allows easy traversal using keys Disadvantages For anything other than a simple (small) cell, its easy to get lots (too many) tabs The relationship between servers isnt obvious Can we display the cell hierarchy in a tree form?

WebSphere Support Technical Exchange

23 of 43

IBM Software Group

Using JTree to show the cell hierarchy

WebSphere Support Technical Exchange

24 of 43

IBM Software Group

JTree: Pro & Con


Advantages
Simple to implement Cell hierarchy maps well to this format Built in keystroke traversal Wrapping the JTree in a Scrolled Pane allows for large cells to be displayed easily Disadvantages You may not like the default JTree attributes

WebSphere Support Technical Exchange

25 of 43

IBM Software Group

Where do we show Server port info?


We can have the JTree shown on a split pane In the other side, we can decide what to display
For branch nodes (i.e., cell and node), we have to decide what we want to display For servers, we can show a table containing the port details

WebSphere Support Technical Exchange

26 of 43

IBM Software Group

Adding a SplitPane
Start by showing the tree in the left pane:

Note: We dont want multiple entries selectable

WebSphere Support Technical Exchange

27 of 43

IBM Software Group

How do we display port number info?


JTable is very function rich Swing component What do we need to do?
Instantiate it using two arrays Data: 2 dimensional array of values Column Headings: An array of strings table = JTable( data, headings )

WebSphere Support Technical Exchange

28 of 43

IBM Software Group

Simple JTable to display port info

WebSphere Support Technical Exchange

29 of 43

IBM Software Group

JTable: Built in features / attributes


Editable cells Resizable:
Columns (width) Frame (width / height) Draggable: Columns (position) Cell selectable using keystrokes or mouse clicks Note: Use of DefaultTableModel

WebSphere Support Technical Exchange

30 of 43

IBM Software Group

With great power


You can control things (e.g., size & resizing),
col.setMinWidth( width ) col.setMaxWidth( width ) col.setPreferredWidth( width ) table.setAutoResizeMode( JTable.AUTO_RESIZE_OFF )

The number of selectable rows,


table.setSelectionMode( ListSelectionModel.SINGLE_SELECTION )

Or columns, or just cells


table.setRowSelectionAllowed( BOOLEAN ) table.setColumnSelectionAllowed( BOOLEAN ) table.setCellSelectionEnabled( BOOLEAN )

And lots, lots more


WebSphere Support Technical Exchange 31 of 43

IBM Software Group

comes great responsibility


We have the ability to:
Make only certain cells editable (e.g., port #) Fix column width, and position Maybe even allow columns to be sorted Do we want to provide ways to filter the data differently?

Perhaps, but we dont have time here

WebSphere Support Technical Exchange

32 of 43

IBM Software Group

For example
JTables have many properties AutoResizeMode can be set to one of:
AUTO_RESIZE_OFF AUTO_RESIZE_NEXT_COLUMN AUTO_RESIZE_SUBSEQUENT_COLUMNS AUTO_RESIZE_LAST_COLUMN AUTO_RESIZE_ALL_COLUMNS

What does this really mean? Lets find out

WebSphere Support Technical Exchange

33 of 43

IBM Software Group

JTable AutoResize example

WebSphere Support Technical Exchange

34 of 43

IBM Software Group

Table models
The table model used to create a JTable defines
how the table may be used You may want to define one for your application For example, to: Define column widths, Prohibit column movement, Restrict cell editing, Define how cells should be displayed (rendered)

WebSphere Support Technical Exchange

35 of 43

IBM Software Group

Table models (cont)


For an application with many similar tables, models
can make life easy Creating a class descending from TableModel lets us: Have all tables look and act the same Localize all of the table settings Experiment with our settings easily

WebSphere Support Technical Exchange

36 of 43

IBM Software Group

An application (prototype)

WebSphere Support Technical Exchange

37 of 43

IBM Software Group

Are we done yet?


No! There is lots of room for improvement
Event Handler does too much & is too slow Shouldnt be able to select a server until the port information is already available Widths (e.g., column, table) are hard coded Currently: no config changes are made Are we ever done? it depends ;-)

WebSphere Support Technical Exchange

38 of 43

IBM Software Group

Is it worth the time and effort?


Yes! Rapid prototyping can be quick and easy
Jython + swing lets us test to learn as we go We can see the implications of our choices Interaction with WebSphere configuration and environment is easy Jython is easy to read and understand Iterative improvement is easy Build the application & testing it as we go

WebSphere Support Technical Exchange

39 of 43

IBM Software Group

Summary
Graphical, event driven, applications are possible
with Jython Jython applications can access and use WebSphere administrative objects easily Jython applications can access and use Java objects easily Rapid prototyping allows us to determine where to spend our design, development, and testing time wsadmin + Jython + Swing is a big win!

WebSphere Support Technical Exchange

40 of 43

IBM Software Group

Additional WebSphere Product Resources

Learn about upcoming WebSphere Support Technical Exchange webcasts, and access previously recorded presentations at: http://www.ibm.com/software/websphere/support/supp_tech.html Discover the latest trends in WebSphere Technology and implementation, participate in technically-focused briefings, webcasts and podcasts at: http://www.ibm.com/developerworks/websphere/community/ Join the Global WebSphere Community: http://www.websphereusergroup.org Access key product show-me demos and tutorials by visiting IBM Education Assistant: http://www.ibm.com/software/info/education/assistant View a webcast replay with step-by-step instructions for using the Service Request (SR) tool for submitting problems electronically: http://www.ibm.com/software/websphere/support/d2w.html Sign up to receive weekly technical My Notifications emails: http://www.ibm.com/software/support/einfo.html

WebSphere Support Technical Exchange

41 of 43

IBM Software Group

Connect with us!


1. Get notified on upcoming webcasts
Send an e-mail to wsehelp@us.ibm.com with subject line wste subscribe to get a list of mailing lists and to subscribe

2. Tell us what you want to learn


Send us suggestions for future topics or improvements about our webcasts to wsehelp@us.ibm.com

3. Be connected!
Connect with us on Facebook Connect with us on Twitter

WebSphere Support Technical Exchange

42 of 43

IBM Software Group

Questions and Answers

WebSphere Support Technical Exchange

43 of 43