CS333 Lab T-2:
Distributed Program Visualization
Goals of this lab:
By the end of this lab, you should
- know how to use EUPHORIA, Playground's user interface management system,
to construct direct-manipulation graphical interfaces for distributed applications.
- have more experience with asynchronous communication and
connection management in Playground.
Playground's user interface management system,
is a drawing tool that allows you to create direct-manipulation
graphical user interfaces for interaction with dynamically changing distributed
applications. Like ordinary drawing editors, EUPHORIA lets you create
graphics objects like lines and rectangles, but it also lets you create
persistent constraints among the graphics objects and it lets
you publish attributes of graphics objects so that they are
available for forming logical connections in the connection manager.
Refer to the
EUPHORIA Reference Manual for more details.
Read over the entire assignment before starting.
Then, follow the instructions step by step, keeping lab notes
as you go.
- Start a Playground session:
Start up the connection manager GUI,
as described in Step 2 of Lab T-1.
- Start EUPHORIA:
In a shell on your local host,
type PGeuphoria to start up the user interface
You should see a window that looks like an ordinary drawing editor.
You will also see a module labeled EUPHORIA show up in the connection
manager with no presentation items.
EUPHORIA can also be started up on remote hosts (it runs slower this
way due to X windows communication), but since it creates an X window,
steps must first be taken to (1) allow the remote host to put an X
window on your display and (2) inform the remote host of your display
location. This can be accomplished as follows.
- In a shell on your local host, type
is the host on which EUPHORIA will run.
- In the shell where you plan to start EUPHORIA, type
setenv DISPLAY localhost:0.0
where localhost identifies your display.
- Graphics objects and attributes in EUPHORIA:
With the left mouse button, click on the rectangle drawing tool.
While the rectangle tool is highlighted, drag a rectangle in
the drawing area. Select the rectangle. Notice the handles
that identify attributes of the rectangle. Grab
various handles and move them around.
- Constraints in EUPHORIA:
Draw some more rectangles. (You can double click on a drawing
tool to remain in that mode until selecting another tool.)
With the middle mouse button, form a constraint
between the lower-left handle of one rectangle and the
upper-right handle of another rectangle by dragging a line from
one to the other. When you let go, the two corners should be
'attached.' Try moving the rectangles around. What happens?
Constraints can be viewed and edited. Choose Show Constraints
from the Constraint menu and select a rectangle whose corner
you have constrained to a point on another rectangle.
You should see a circle and flashing on and off
(more things will be flashing if you have more objects with constraints
selected), representing the constraints that you have formed.
Choose Taffy Pull Mode from the Constraint menu
and move one of the rectangles.
You should see an arrow moving with the
corner. Clicking on an arrow with the right
mouse button will delete the constraint associated with the arrow.
Choose Taffy Pull Mode again. What happens?
Use the file menu to save your drawing. Since EUPHORIA does not
provide an "undo" operation, you should get in the habit of saving
- Publishing attributes in EUPHORIA:
Draw an oval.
With the middle mouse button, drag a
line from the center handle to the area marked 'NEW' at
the bottom left of EUPHORIA. A new presentation entry will show up in
EUPHORIA, and also in the connection manager. Bring up another
EUPHORIA and, in it, publish a point from another graphics object.
In the connection manager, create a bidirectional
connection between the two variables you published.
What happens when you move the objects around?
What happens if you delete the logical connection?
Try renaming a presentation entry in EUPHORIA by double-clicking
on the text. Does the new name show up in the connection manager
- Solve the mystery program: You can use EUPHORIA to
construct graphical direct-manipulation interfaces for distributed
applications created from other Playground modules. In two different
xterm windows, type mystery1 and
mystery2 to bring up two Playground modules with
mysterious presentations. Your job is to configure a distributed
application out of the two modules in the connection manager, and
construct a sensible graphical visualization and control for that
program in EUPHORIA. The names of the modules should give you
reasonable clues as to their behavior. Begin by experimenting with
connections between graphics objects and presentation entries of the
mystery modules. Note the kinds of behaviors you get and proceed from
there. (No, you can't look at the code!) Using the file menu, save
your visualization and write down the final configuration among the
mystery modules in your lab notes.
Turn in your lab notes to receive credit for completing this tutorial.