CS333 Lab T-2:
Distributed Program Visualization

Goals of this lab:

By the end of this lab, you should

Introduction:

EUPHORIA, 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.

Directions:

Read over the entire assignment before starting. Then, follow the instructions step by step, keeping lab notes as you go.

  1. Start a Playground session: Start up the connection manager GUI, as described in Step 2 of Lab T-1.

  2. Start EUPHORIA: In a shell on your local host, type PGeuphoria to start up the user interface management system. 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.

    1. In a shell on your local host, type
      xhost +remotehost
      where remotehost is the host on which EUPHORIA will run.

    2. In the shell where you plan to start EUPHORIA, type
      setenv DISPLAY localhost:0.0
      where localhost identifies your display.

  3. 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.

  4. 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?

    Editing constraints: 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 fairly often.

  5. 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 user interface?

  6. 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.

    Good luck!

Turn in your lab notes to receive credit for completing this tutorial.