Table of Contents
Previous Chapter
Table of Contents
Previous Chapter
This chapter describes how to use CODE's graphical interface. It explains how to perform the tasks you must know how to do in order to program in CODE. For example, you must be able to draw nodes and arcs and fill out attribute forms. Perhaps the best way to learn is to run CODE and try the operations described below as you read about them. To run CODE, enter
at the UNIX prompt. This will run CODE and open a program called "progname", creating it if necessary. Of course, code2 must be on your UNIX path. Also, it is possible that you will need a configuration file called ".coderc" in your home directory in order to set a path variable that CODE requires. See the code2 UNIX man page and installation instructions. You must be running some form of X-windows to use CODE. We have run it under X11R4, X11R5, and OpenWindows.
When CODE starts, it opens a single window. All activity will take place within it. The window is divided into two parts, a black banner line full of buttons and labels at the top, and an area of empty space in which you will draw graphs. Figure 4.1 shows the CODE window. Several of the buttons and the banner line have been labeled. All operations involve clicking (press the mouse button and release without moving the mouse) on some part of the window. Only a single mouse button is needed. Use the left button on multiple button mice. As a note to Macintosh users, CODE does not use double clicking or dragging for drawing operations.
CODE's user interface can be considered as two separate components. There are facilities for drawing graphs and facilities for annotating graphs by filling out forms. They will be discussed separately.
CODE provides a numbers of "tools" for drawing graphs. There is a tool for creating nodes and arcs, a tool for moving them, a tool for deleting them, etc. Each tool has a cursor associated with it. Figure 4.2 shows the CODE cursors. Their names and uses are as follows.
Create Creates (draws) objects such as nodes, arcs, and graphs.
Open Opens attribute forms of objects.
Copy Permits nodes, arcs, and graphs to be copied.
Travel Permits display of different graphs and programs.
Move Moves nodes, arcs, etc. on the screen.
Erase Deletes objects. Use the Undo button to bring them back.
Square Changes arcs to run only vertically and horizontally. Click on an arc to square it.
The default cursor is the Create cursor. When you first run CODE, this cursor will be active. It is shaped like a pencil and is used to create (meaning draw) things.
You change from one cursor to another by clicking (left button) on the Tool button in the banner line. A menu of tools will appear. You click once to make the menu appear and then click again to make a choice from it.
There is also an optional shortcut for changing tools. Click the right mouse button. A graphical menu of tools will appear. This is the only use CODE makes of the right button. The middle button is never used.
You draw a node by clicking on empty space with the Create cursor. A menu of node types will pop up. Pick one by clicking on it. A node will appear where you first clicked. Remember to click with the left mouse button.
Draw an arc by clicking the create cursor on the tip of an outgoing arrow on a node. Click again on the end of an incoming arrow to complete the arc. See "Drawing an Arc" in section 4.3.
Click the Move cursor on an object to move it. Click the Erase cursor on an object to delete it, and so on.
CODE programs actually consist of a set of graphs, not just one. You draw and work on them one at a time. When you first run it, CODE creates a graph with the default name "main." You can create a new graph by clicking the Create cursor on the Graph button and entering a name for the new graph. You can view a different graph in the set of graphs you have created by clicking the Travel cursor on the Graph button. A menu (with scroll bars in case you have many graphs) will appear.
When you click the Open cursor on an object, its attribute form appears. These are discussed in the next section. For now, note that attributes that apply to the entire program are (logically enough) in the Program attribute form. Open it by clicking the Open cursor on the Program button. Open the current graph's attribute form by clicking the Open cursor on the Graph button.
Notice that the tools have a faintly object-oriented flavor. They do the right thing when you click them on different parts of the screen. The program button represents the entire problem. You open the program's attribute form by clicking the Open cursor on the Program button. Make a form go away by clicking on empty space outside of it. You can travel to (load) another CODE program by clicking the Travel cursor on the Program button. The Graph button represents the currently displayed graph. Click the Open cursor on it to open the graph's attribute form. Click the travel cursor on it to display a different graph. Click the Create cursor on it to make a new graph, and so on.
Once you have drawn a graph, you must annotate it. As has been mentioned, you click the Open cursor on an object to open its attribute form. This works for nodes, arcs, the Program button, and the Graph button. Figure 4.3 show a UC node's attribute form.
Forms are hierarchical. They contain fields that are references to other things called entry methods. These include forms, menus, scrolling tables, and text editor boxes. For example, the Node Name field is a small text editor box. Click on it, and a text box will appear. You can enter a name for the node in this box. The name will be displayed next to the node, but you can move it with the Move cursor. You make forms, menus, text boxes, etc. go away by clicking on something else. You go to what you clicked on. After you finish entering a node name, click on white space in the UC form to return to it. Click on empty space outside the form to exit it altogether.
Figure 4.4 shows a large text box open on top of a form. You may move an entry method by clicking in its title bar and dragging. This is useful in case you need to slide something out of the way. CODE's text editor boxes use emacs key bindings, although only a small subset are supported. For large editing tasks, press ESC-e (the escape key followed by e) to bring up a window running the editor defined by your EDITOR environment variable. You may also define this editor in your ".coderc" file using the "editor" variable.
Here is a summary of some of the important key bindings used in text editor boxes. The symbol "^" means to hold down the control key. A "region" is the set of lines between the mark and the current location of the cursor, inclusive.
Click the left mouse button to position the cursor.
Click outside the form to exit it.
This section describes many of the important operations you will have to be able to do in order to use CODE. It also summarizes some of the information in mentioned previously.
To exit CODE, click any cursor on the Exit button. You will be asked if you wish to save changes.
Click the on the Save button. Do this often as protection against crashes.
Click the Create cursor on empty space. Pick a node type from the menu that will appear. Figure 2.5 shows the different node types. Figure 4.5 shows the menu.
To create an arc, begin by clicking (press and release!) the Create cursor on the tip of an arrow leaving a node. You are now in arc drawing mode. Click on empty space to create intermediate points (elbows). Click on the beginning on an incoming arrow on a node to complete the arc. Click on the point at which you started the arc to cancel drawing it, or you can finish it and then delete it with the Erase cursor. It is necessary to aim the mouse with some care when you are drawing arcs, but it is easy after a little practice. Figure 4.6 show points on a node at with an arc can be started and finished.
Click the Create cursor on the Graph button. Select "create" from the menu and enter a name for the graph.
Exit CODE and start it again using the program name as the command line argument.
Click the Open cursor on the object-- node, arc, Program button, or Graph button. When clicking on an arc, avoid clicking on its intermediate points. Click outside of the form to close it. There will be a beep when you close a the form if you have made a syntax error within it. Semantic errors are not caught until you translate your program.
Click any Cursor on the Tool button or click the right mouse button.
What do you do if your graph is too large for the CODE window? The best advice is to use more graphs and Call nodes to hierarchically structure your program. You can also use your X window manager to resize the CODE window, or you can scroll by clicking any cursor on the Scroll button. A scroll window will appear. Use its scroll bars to scroll the graph view one node at a time. The scroll window itself shows a zoomed-out view of the CODE graph. Every node is represented by a single pixel. Click in this area to jump to a particular part of the graph. Figure 4.7 shows the scroll window.
CODE programs consist of a set of graphs that are drawn independently. There is no way to view more than one graph at a time. To view a particular graph, click the Travel cursor on the graph button. A scrolling menu of graphs will appear. Click to pick one. Figure 4.8 shows this scrolling menu.
Once a Call node has been annotated with the name of the graph that it calls, you can travel to that graph by clicking the travel cursor on the Call node. Click on the Return button to return to the Calling graph.
Once you have drawn and properly annotated a CODE program, you can translate it into parallel C source code for a particular architecture by clicking any cursor on the Translate button and selecting an architecture. Error messages will be written onto the terminal window from which you ran CODE. See the chapter on translation in this manual. The "List" menu pick dumps a text-based representation of your program to the terminal window. It is primarily a debugging tool for CODE's developers but may be of some use to others.
Delete a node arc, etc. by clicking on it with the Erase cursor. Undo undoes this. Redo undoes the undo!
Clink on a node, label, arc intermediate point, etc. with the Move cursor. Move the mouse to the desired location and click again.
You can write comments right on the graph by clicking the Open cursor on empty space. A text box will appear. Enter your comment into it and click outside it to make it go away. The comment can be moved with the Move cursor, edited with the Open cursor, and deleted with the Erase cursor.
Use the Copy cursor to copy things, along with their attributes. For example, to copy a node, click on it with the Copy cursor. Click again on empty space, and the copy will appear at that point.
CODE has an elaborate online help system that uses hypertext. Click any cursor on the Manual button to bring up the online manual. The What and How buttons enable two kinds of context-sensitive help. The How button describes how to use the user interface. For example, if you click on it while a UC attribute form is open, it will tell you how to manipulate forms. The What button tells you what you are supposed to do with the user interface at a given point. If you click on it while a UC attribute form it open, it will describe the purpose and meaning of the various fields in the form. Figure 4.9 shows the help box that would appear if you clicked on the How button while a text editor box is active. Click on the underlined (or highlighted on color monitors) text for more help on that subject.
Figure 4.10 shows the form that would appear if you clicked on "drag" in the help box. Click on the hooked arrow icon to return to the previous help box. Click on the house icon to return to the home (or root) help box. Click on the little square icon at the upper left of the help box to turn help mode off.
code2 progname.grf
-----------------------------------------------------------------------------
^f Forward character ^b Backwards character
^n Next line ^p Previous line
^a Beginning of line ^e End of line
^v Next page ESC-v Previous page
^z Scroll forward one line ESC-z Scroll back one line
^d Delete character DEL Delete character to the left
^k Delete to end of line ^@ Set mark at cursor
^w Delete to region to yank buffer ESC-w Copy region to yank buffer
^y Paste at cursor
-----------------------------------------------------------------------------
Next Chapter