Another Approach to State
The OpenLaszlo platform contains a <state> tag. A <state> encapsulates a collection of properties (methods and attributes) and children that can be atomically attached to or removed from a node during program execution. This is actually pretty powerful, especially since a state can contain constraints. This is how dragging is implemented, for instance.
OpenLaszlo <state>s are independent from each other. Any number of <state>s may be applied to a view at once, or none.
In problem domains, some states really do combine this way. For example, a view may be being dragged, or not, independently of whether it contains unsaved data or not; and so on.
But there's another sense of "state", which is the state in a state machine. These states are mutually exclusive[1]. And they're a pain to implement with the <state> tag. You end up writing a code that turns on one state and turns off the others, in order to switch from one state-machine-state to another. Note the verbosity of the three state-changing lines in the fragment below:
[code]
...s1.apply(); s2.remove(); s3.remove(); ...
...s1.remove(); s2.apply(); s3.remove(); ...
...s1.remove(); s2.remove(); s3.apply(); ...
[/code]
Here's the cool thing, though. You can turn the states on and off automatically with constraints. Just add an attribute that names the state, and make the states conditional on the value of that attribute[2]:
[code]
...this.setAttribute('myState', 's1'); ...
...this.setAttribute('myState', 's2'); ...
...this.setAttribute('myState', 's3'); ...
[/code]
In fact, if the states are only used to hide and show views and layouts (and not to attach methods and attributes), you don't even need the <state> tag at all. You can simply conditionalize the views' visibility on the value of the attribute that holds the state:
[code]
It gets better. The views don't even need to be in the same node that holds the state variable. In expialidocio.us, I create a global "application state" object, and constrain views all over the canvas to the value of its "state" attribute:
[code]
...
[/code]
You can switch the visibility of views at any level of hierarchy, conditional on the value of application.state or other state variables. You can also switch the values of other attributes, such as position or opacity. And finally, you can conditionalize these attributes on more complex expressions, such as whether an application is either in "login" state or "running".
[code]
[/code]
h3. Notes
fn1. States are mutually exclusive in the case of a deterministic state machine. And this is what's usually used for modeling software and user interface components.
fn2. You can use numbers for state values instead of strings, but I recommend strings for readability, unless you can prove that it makes a performance difference to your application. And in a real application I use strings such as "login", "processing", and "running", instead of "s1", "s2", etc.
March 29th, 2006 at 7:22 am
[...] Update: Now that I’ve done more Ruby and DHTML programming, I can see that the diagram above gives OpenLaszlo short shrift. Although OpenLaszlo is lower level that Ruby with respect to code generation and a MOP, the use of databinding and constraints makes it higher level in a different set of ways. [...]
August 7th, 2006 at 6:30 pm
Hi,
You approach to state is very interesting. I’m putting it into practice in my application. Only, I got confused by the attribute accessing subtleties that I had to face:
(article not saved yet)
(…)
Debug.write(”saveArticleContent: ” + articleContent);
if (this.getAttribute(”articlestatus”)==”new”) {
Debug.write(”We should prompt the user with the name of the new article”);
storycontrols.setAttribute(”mystate”, “createarticlestate”);
}
Note that this.mystate in the state constraints didn’t work. I understood that “this” inside the constraint was pointing to the same thing as storycontrols, but that’s apparently not the way the compiler understands it.
Similarly I don’t understand why I couldn’t simply assign the “mystate” attribute using the “=” operator in the “saveArticleContent” method (which is a member of storyControls).
Any help is really appreciated!
August 7th, 2006 at 6:32 pm
Sorry I wanted to send code snippets along with my comment but that didn’t work. I you let me know your email address, I’d be glad to send it to you.