Geek asks and answers

Metalanguage for defining the workflow of an HTML application

I am looking for a way for the language to express the HTML application workflow itself . If the user fills in certain values ​​on the form, another form should be displayed. Further, if the values ​​are completed, new parts of these child forms should be shown in these child forms.

I want to express the relationship between HTML forms , HTML elements in these forms, and the values ​​of these elements.

Based on information about the database, for example, in table fields and relationships in a table, I control through Doctrine, I generate ExtJS forms.

Now I need to inject the flow logic into my ExtJS forms so that I cannot directly copy the application stream with ExtJS code (JavaScript).

I want to create the appropriate JavaScript code at runtime based on a predefined configuration file.

For instance:

I have X forms

FORM 1. (displayed on startup)
 |
 |-> FROM 1.1 (only display after values have been inserted into FORM 1.)
 |
 |-> FROM 1.2 (only display after values have been inserted into FROM 1.1)
 |
FROM 2. (display when something inserted into FORM 1.)
 |
 |-> FROM 2.1 (layout and elements of this form depend upon what has been 
     inserted into FROM 1.)
 ....

In addition, I want to display only parts of the forms if the user has filled in something in the input field

FORM 1. (displayed on startup)
 |
 |-> LAYER 1. (only display/activate after field <count> of FROM 1. 
 |   has been filled in)
 |
 |-> LAYER 2. (only display/activate after field <count> of LAYER 1. 
 |   has been filled in)
 |
 ....

Then I want to display forms only if the value that the user filled in the form element passes a predefined condition

FORM 1 (displayed on startup)
 |
 |-> FROM 1.1 (only display if field <count> of FROM 1. is greater that 10
 |   count > 10)
 |
 |-> FROM 1.2 (if count < 10 display this form)
 |
 ....

The last thing I want, based on the values ​​inserted by the user in the parent form, is to establish rules for input elements in order to limit their input range (possible values)

Here is an example workflow

enter image description here

Is there a metalanguage for defining such a relationship?

- ?

,

J.

+3
2

, /, , , .

, Cucumber (http://cukes.info/). Cucumber - , , . . - Selenium (http://seleniumhq.org/), , .

, , .

Rob

+1

@Rob . , , .

javascript

:


https://github.com/bemson/Flow/wiki/Flow-Use-Cases

( javascript) .

- (_in _out) , . , _vars, , .

. https://github.com/bemson/Flow/wiki/Using-Flow#s3-1.

-, (FSM) JavaScript, XML, JavaScript. , XML , . .

.

<fsm>
  <states>
    <state name="Start">
      <enter call="initApp();" />
      <exit call="exitApp();" />
      <to>
        <from state="" call="displayStartPage();" />
        <from state="loggedOut" call="showLogoutMessage();displayStartPage();" />
       </to>
    </state>
    <state name="loggedIn">
      <include state="authenticated" />
      <exclude state="loggedOut" />
      <negate state="loggedOut" />
    </state>       
  </states>
</fsm>


<fsm>       ... the root node of the fsm (I renamed it to better reflect the purpose)
<states>    ... a collection of possible states (a state can have sub-states)
<state>     ... a possible state
<exclude>   ... if a state is active excluded one should be inactive
<include>   ... if a state is active the included state should also be active
<require>   ... should check that a javascript condition is true
<unrequire> ... the negation of <require>
<negate>    ... negate a state if you enter another state
<affirm>    ... make another state active, if entering a specific state
<enter>     ... fire a trigger when state gets active
<exit>      ... fire a trigger when state gets in-active
<from>/<to> ... specify state transitions and actions according to these transitions
<lock>      ... lock state, until state machine is reset

, . :

testState   ... to test the state of the FSM
negateState ... negate a state 
affirmState ... set a new state and issue according transition events
flipState   ... set state from active to inactive and vice versa 
determine   ... determine current state


. http://blog.metawrap.com/2008/07/21/javascript-finite-state-machinetheorem-prover/


http://blog.metawrap.com/2008/09/25/practical-applications-of-finite-state-machines-in-web-development/
.

, , .

http://camiloazula.wordpress.com/2010/10/14/fsm/

.

, , , . , , , jQuery JS Framework.

, IBM , .

http://www.ibm.com/developerworks/library/wa-finitemach1/ http://www.ibm.com/developerworks/library/wa-finitemach2/ http://www.ibm.com/developerworks/library/wa-finitemach3/

, , .

Spring Web Flow, Springs, .

, -, XML, .

XML javascript ( XML), . ExtJS,

http://docs.sencha.com/ext-js/4-0/#/api/Ext.EventManager-method-addListener

addListener

.

, - .

JS

0

More articles:


All Articles