Below is the architecture as it is proposed to work and what we are working towards.  These ideas will evolve as the project moves forward.

The Big Picture

Extensible Application Platform (XAP) user interface and data binding are described by Extensible Application Language (XAL) files containing an XML-based markup language designed to support application development - rather than document markup. XAP maps XAL markup to specific UI widgets. An XAP DOM, separate from the HTML DOM, maintains the UI state.
(and updates the HTML DOM through UI bridges.)

An XAP application consists of server- and client-side components as follows:

On the server side

	Component	Description
1	Any Web server.	There are no specific server requirements; XAP code operates only on the client.
2	HTML boostraps or hosts.	An HTML file bootstraps the XAP application, or an HTML file hosts an XAP application.
3	One or more XAL documents.	XAL documents describe the user interface, data binding and modifications.

On the client side

	Component	Description
1	Web Browser	Runs in any Web browser.
2	XAP DOM	Holds the state of the XAP application and provides APIs for modification and structure listeners.
3	XAP Engine	Consists of an XML parser, modifications modules (XModify), XPath, containers for system services, and bridges for connecting XAL markup to HTML/DHTML/JavaScript.
4	Event Handlers	Coded in JavaScript on the client or located on the server as any request/response handler.

Figure 1b - XAP block diagram

Client Side Detail

The XAP engine works with the HTML DOM to display the user interface.

The XAP engine parses XAL documents which contain markup that builds the XAP DOM. The XAP DOM represents the user interface and state of the application. Each XML tag within an XAL document is either markup or an instruction to a system service. The XML can contain:

• user interface tags
• XModify statements that can declaratively change user interface or application state
• (XModfiy ?) statements that create or execute macros and managed client side code
• (XModfiy ?) statements that call a system service such as networking 
   
  
  On the client:
  

The above diagram shows:

1. User Interface component bridges map XML tags to user interface
2. XAP DOM - holds the state of the XAP application
3. Containers manage system services and client side code objects (MCOs)
4. XML Parser processes the markup; markup consists of UI elements and instructions to operate on the UI DOM or other DOMs
   • XModify: provides a declarative means of updating user interface and application state
   • XPath: used within XModify statements and whenever DOM path resolution is supported
   • MCOs: client side managed code objects written in JavaScript; contain business logic and can be called via XML handlers
   • System Services such as networking, style sheets, etc.
   • Macros that provide simple XML modifications that can be executed on the fly
5. UI Toolkits provide implementation of user interface components and make the relevant changes to the HTML DOM
6. Actual web browser DOM

XAP Architecture (simplified workflow)

The following diagram provides a high level overview of the XAP architecture with a workflow of XML input to the UI output. "A" is the XAP application, which is an XML file that consists of XAL markup and instructions. Subsequent changes to the DOM can be made either via additional XAP XML documents containing declarative modification instructures or programatically via object oriented interfaces.






The above diagram demonstrates how XAL XML is fed into XAP to build the user interface. Events generated by user interaction are fed back into the XAP application.

1. XML Parser processes the markup; markup consists of UI elements and instructions to operate on the UI DOM or other DOMs
2. Processed markup builds the UI DOM. The XAP DOM manages user interface state for the XAP portions of the application; listeners allow hooking into DOM changes.
3. Component bridges map XML tags to user interface
4. UI Toolkits provide implementation of user interface components and make the relevant changes to the HTML DOM
5. Actual browser DOM representing the web browsers user interface
6. Events are fired when the user interacts with the UI; these events are handled by the XAP application

XAP Architecture (component detail)

The following diagram shows the same workflow but breaks out the steps in more detail and provides more information on the system components.




This diagram shows:

1. XML Parser to process markup
2. Namespace handlers take actions based on specific namespaces
3. Containers manage system objects
   • MCOs: client side managed code objects written in JavaScript; contain business logic and can be called via XML handlers
   • System Services such as networking
   • Macros that provide simple XML modifications that can be executed on the fly
4. The XAP DOM manages user interface state for the XAP portions of the application; includes listeners that allow hooking into DOM changes.
5. Component bridges map XML tags to user interface
6. UI Toolkits provide implementation of user interface components and make the relevant changes to the HTML DOM
7. Actual browser DOM representing the web browsers user interface
8. Events; these can be handled by (1) client side code objects (MCOs), (2) network requests back to the web server or (3) UI state changes. UI state changes can be listened for.