Zigzag® for Web Browsers

Last updated Thu Dec 20 00:02:52 GMT 2001

Useful Files

Here is the version 0.6 ZIP file, containing

Quick Summary

e c s fGo up, down, left or right a cell
n [ecsf]Make a new cell above/below/before/after
QEdit the contents of the current cell
# [ecsf]Delete the cell above/below/before/after the current cell
~ [ecsf]Hop the current cell over the cell above/below/before/after
mMark the current cell
- [ecsf]Link the marked cell to the current cell in the indicated direction
u [ecsf]Unlink the marked cell from the current cell in the indicated direction
^ [ecsf]Jump to the top of the current rank (in the indicated direction)
v [ecsf]Jump to the bottom of the current rank (in the indicated direction)
!Save the current Zigzag data as XML
WSave the current Zigzag data as HTML

Usage

This implementation is fairly minimal! It only supports ONE window, and currently implements much of the Zigzag infrastructure directly as JavaScript variables rather than Zigzag cells (e.g. dimensions).
Navigation
The e, c, s and f keys are supported, as well as the x and y keys to rotate dimensions. Capitalised versions of the letters map onto the SAME actions currently. (Clicking on a cell, or using the arrow buttons and dimension menus in the top region perform the same actions for those more familiar with the Web than Zigzag.) Each cell shows how it is linked to its neighbouring cell with a large (colored) arrow. Small (diagonal) arrows show how the cell is linked in other (unmapped) dimensions. Hovering over one of these arrows indicates the dimension and cell value, clicking on the arrow will move you to that cell and rotate to make that dimension visible.
Tutorials
Each dataset can have an accompanying tutorial which will be displayed step-by-step in the top left-hand part of the Web page. A change in instructions is triggered when the user navigates to the correct cell with the correct dimensions displayed.
Editing
The 'Q' key will allow you to edit the contents of the current cell. In IE5, the cell itself will turn editable, and you can make selections, insertions, deletions and changes until you press 'ESC' when the changes will be comitted. (BUG: you must click on the cell to make it receive the keyclicks after pressing 'Q'.) In NS/Mozilla, a dialog box will be presented to you to allow you to type in the new cell contents.If the contents of a cell are a URL or absolute file name, the cell will be displayed as a link
Adding Cells
The 'n' key followed by a direction key (s, f, c, e) will add a new cell and link it to the current cell in that direction. The new cell will become the current cell. (You must then type 'Q' to change its contents.)
Deleting Cells
The '#' key followed by a direction key (s, f, c, e) will delete the cell next to the current cell in that direction. The cell will only be deleted from the current rank.
Adding Dimensions
The 'D' key will initiate a series of dialog boxes which ask you to type in a name (id to use internally), a description (used in the menus) and color (for the arrows) for the new dimension. The new dimesion is added at ethe end of the dimension list.
Linking Cells
First mark a cell using the 'm' key. Then go to the cell you want to link it to, and press '-' and a direction key (s, f, c or e). The current cell will then be linked to the marked cell in the indicated direction.
Unlinking Cells
First mark a cell using the 'm' key. Then go to the cell you want to unlink it from, and press 'u' and a direction key (s, f, c or e). The marked cell will then be unlinked from the current cell in the indicated direction.
Relinking Cells
To make a cell 'hop' in a particular direction, press the '~' key followed by a direction key.
Saving
Scripting languages embedded in a browser are not allowed to access the user's hard disk! Pressing the '!' key will bring up a new window containing an XML representation of the current Zigzag workspace in a textbox. Please copy and paste this text into a text editor and save it yourself. (Sorry about that!) An alternative is available in IE5: you will be asked to confirm that you want an insecure ActiveX component to run, and an updated copy of the XML file will be stored on the desktop.
Evaluation
Some preliminary work has been done on Zigzag programming, based on Scheme (since ranks are like lists). The 'A' key (for 'Answer') will evaluate the function connected to the current cell in the 'defn' dimension and display the answer in a dialog box.
Common Gotchas
Please note in the demos that after choosing a dimension from either of the menus, you MUST click on the background to delselect the menu. If you forget to do this then the 'e', 'c', 's', and 'f' keys will be interpreted by the browser to mean "make a new choice from the menu", rather than "move up/down/left/right".

Things to Do

ZigZag is a registered software trademark of Project Xanadu