| c4e24c7 by No'am Rosenthal at 2009-11-09 |
1 |
<HTML> |
|
2 |
<HEAD><TITLE>Statechartz Documentation</TITLE></HEAD> |
|
3 |
<BODY> |
|
4 |
<H2>Documentation for the Statechartz Javascript Library</H2> |
|
5 |
<H3>Overview</H3> |
|
6 |
The Statechartz Javascript library is meant to provide heirarchical statechart support for web-sites and web-apps, based on the <a href="http://www.w3.org/TR/scxml/">SCXML standard</a>. It includes most of the basic SCXML features, including state heirarchy, parallel states, final/initial/history pseudo-states, conditional transitions and executable activities. |
|
7 |
<br/> |
|
8 |
The Statechartz library is meant to help manage the complexity of web-apps, allowing for more dynamic web experience with less lines of code. |
|
9 |
|
|
10 |
<H3>Browser Support</H3> |
|
11 |
Statechartz is currently only tested with webkit browsers (QtWebkit / Arora, Safari, Chrome). Other browser support might be added in time. |
|
12 |
|
|
13 |
<H3>Authoring using SCXML</H3> |
|
14 |
The standard way to author for Statechartz is with SCXML. By having a separate SCXML file next to the HTML and Javascript assets, the flow can be separated from the graphics and the logic of the application. |
|
15 |
<br /> |
|
16 |
Note that only a subset of the SCXML standard is supported: |
|
17 |
The tags scxml, state, parallel, initial, final, history, transition, raise, send, if, else, elseif, script, data, and datamodel are the supported tags. |
|
18 |
<br/> |
|
19 |
An SCXML file can be loaded in the 2 following ways: |
|
20 |
<ul> |
|
21 |
<LI>Dynamically via the Statechartz.loadScxml(Document) function. This function accepts a DOM XML Document as a parameter, and returns a Statechart object. That statechart can be started with the start() function, and events can be raised to it with the raise() function.</LI> |
|
22 |
<LI>Statically via a link tag in the HTML head: <link rel="statechart" href="someURL.scxml"/> (See <a href="demo.html">demo.html</a>. When loaded statically, the statechart woulld be kept in document.statechart, and would start once the document is loaded. |
|
23 |
</LI> |
|
24 |
</ul> |
|
25 |
|
|
26 |
<H3>Authoring using agile Javascript syntax</H3> |
|
27 |
<H3>Connecting with HTML and CSS</H3> |
|
28 |
<H3>Gotchas</H3> |
|
29 |
</BODY> |
|
30 |
</HTML> |
