Enhancing Batik's DOMViewer

This page should help the realization of the "Enhancing the DOMViewer" project by Ivan Andjelkovic. The project is a part of the Google Summer of Code 2007 Program.

This page should be used for developing the specification for the project and reviewing the progress of implementation. I hope to collaborate with people from Batik who will help me improve the specification.

The main goal of the project is to allow better document inspection and editing of the document using Batik's DOMViewer.
The user should be able to inspect the document and track the changes through the Viewer when the document changes.
The user should be able to add, remove or edit nodes (attributes) in the document through the Viewer.
The user should be able to browse the history of the document and perform undo or redo actions.

Tracking the changes to the document

Tracking the changes on the document by using DOM Mutation Events Listeners. The Viewer should be updated whenever the document changes. The Viewer should keep it’s previous view.

Editing the document

The user should be able to add, edit or remove the nodes from the document, by using the pop - up menus registered on the DOM document tree, the panel for element editing, or the characted data panel for node editing.

Tracking the history

Keeping the changes of the document in the history should allow the user to undo and redo the changes made on the document, a single change or a custom number of actions (by using the dropdown component for that purpose). Due to memory issues, history size should be set initially to some value.

Implementation status

  1. Allowed ‘Live track’ option:
    1. DOM document tree (JTree) gets updated on insert/remove node events,
    2. Panel/attribute table gets updated on attribute modified event,
    3. Character panel gets updated on character data changed event,
    4. Is always turned on.
  2. Added panel for adding, editing, and previewing the element (it's xml representation):
    1. The element can be viewed and modified, as well as it’s sub tree (by directly editing xml),
    2. Support for well formed check of the xml in the panel,
    3. The element can be created and added to the document at a specified location,
    4. When the node from the tree gets selected, it’s associated element from the document is shown in the panel,
    5. Nodes of other types then elements can be edited using character data panel.
  3. Enhanced DOM document tree for browsing the document:
    1. Allowed multiple dnd support (nodes changing their place in the document),
    2. Auto scroll support,
    3. Visual tips for dnd (to be able to choose the exact location of nodes to be repositioned, e.g. between two tree node items),
    4. Added pop - up menu and items for creating new elements, removing the selected ones and inserting element templates,
    5. Scroll & select the appropriate node in the DOM document tree when it gets inserted into document.

  4. Created node templates (for quick add): created predefined nodes with the required attributes and their default values: e.g. <rect width=”0” height=”0”/>

  5. Allowed the tree selection to reflect on the canvas as well: When the node(s) from the DOM document tree get selected, the ‘overlay’ on the canvas appears to show the element being selected
  6. Added support for browsing the document history:
    1. Support for undo/redo actions (including naming of actions),
    2. Added the dropdown component to support undo/redo mechanism for custom number of actions,
    3. Added support for compound commands (such as removal of a custom number of nodes, etc).