diff options
author | Stefan Radomski <radomski@tk.informatik.tu-darmstadt.de> | 2014-08-15 19:34:34 (GMT) |
---|---|---|
committer | Stefan Radomski <radomski@tk.informatik.tu-darmstadt.de> | 2014-08-15 19:34:34 (GMT) |
commit | 940de61e5b6d8651f6ea8b1626c92f5d80cb723c (patch) | |
tree | 5496b8b5274d9333794f90acdc31b39001707be9 /test/uscxml | |
parent | 9149b28c87c7a037dfd244aa5d4c1409b6593dca (diff) | |
download | uscxml-940de61e5b6d8651f6ea8b1626c92f5d80cb723c.zip uscxml-940de61e5b6d8651f6ea8b1626c92f5d80cb723c.tar.gz uscxml-940de61e5b6d8651f6ea8b1626c92f5d80cb723c.tar.bz2 |
Polished xhtml invoker
Diffstat (limited to 'test/uscxml')
-rw-r--r-- | test/uscxml/templates/xhtml-invoker.html | 17 | ||||
-rw-r--r-- | test/uscxml/test-xhtml-invoker.scxml | 126 |
2 files changed, 129 insertions, 14 deletions
diff --git a/test/uscxml/templates/xhtml-invoker.html b/test/uscxml/templates/xhtml-invoker.html index 7773231..bacfe79 100644 --- a/test/uscxml/templates/xhtml-invoker.html +++ b/test/uscxml/templates/xhtml-invoker.html @@ -1,6 +1,8 @@ <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> + + <!-- Get domLoaded event across browsers --> <script type="text/javascript"> // see http://stackoverflow.com/questions/1206937/javascript-domready var domLoaded = function(callback) { @@ -60,8 +62,8 @@ /* Other web browsers */ window.onload = callback; }; - - </script> + </script> + <script type="text/javascript"> function CometSession(options) { @@ -110,10 +112,13 @@ self.cometPoll.send(null); }; - this.post = function(name, data) { + this.post = function(name, data, contentType) { self.xhr.open("POST", self.server + (self.query ? "?" + self.query : "")); self.xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest'); self.xhr.setRequestHeader('X-SCXML-Name', name); + if (contentType) { + self.xhr.setRequestHeader('Content-Type', contentType); + } self.xhr.send(data); } @@ -147,7 +152,7 @@ } else { data = thing; } - this.post(name, data); + this.post(name, data, "application/json"); } // helper function to determine whether something is a html node @@ -173,8 +178,8 @@ <script type="text/javascript"> domLoaded(function () { scxml = new CometSession({ - element: document.getElementById("${scxml.invokeId}"), - server: "${scxml.server}", + //element: document.getElementById("${scxml.invokeId}"), + server: document.URL, onRcvd : function(data) { if (data.responseXML) { var type = data.getResponseHeader("X-SCXML-Type") || "replacechildren"; diff --git a/test/uscxml/test-xhtml-invoker.scxml b/test/uscxml/test-xhtml-invoker.scxml index aec4db3..0d85ffd 100644 --- a/test/uscxml/test-xhtml-invoker.scxml +++ b/test/uscxml/test-xhtml-invoker.scxml @@ -4,19 +4,129 @@ <script src="http://uscxml.tk.informatik.tu-darmstadt.de/scripts/dump.js" /> - <state id="start"> - <invoke type="xhtml" id="xhtml1"> - <!-- replacechildren (default), firstchild, lastchild, previoussibling, nextsibling, replace, delete, addattribute --> + <script> + var entered = {}; + </script> + + <state id="noBackChannelInlineDOM"> + <invoke type="xhtml" id="xhtml4"> + <!-- provide initial content as a inline DOM --> + <content> + <html:p>We can never get this data into SCXML, just wait 3s!</html:p> + <html:form id="form1"> + First name1: <html:input type="text" name="firstname" /><html:br /> + Last name1: <html:input type="text" name="lastname" /> + <html:input type="submit" value="Submit" /> + </html:form> + </content> + <finalize> + <script>dump(_event);</script> + </finalize> + </invoke> + + <onentry> + <send event="continue" delay="3s" /> + </onentry> + + <transition event="continue" target="backChannelDomOPContent" /> + </state> + + <state id="backChannelDomOPContent"> + <invoke type="xhtml" id="xhtml3"> + <!-- provide initial content as a DOM operation, this will load the template for backchanneling via _parent --> <content type="replacechildren" xpath="/html/body"> - <html:form onmouseover="scxml.send('onmouseover', arguments[0])"> + <html:p>Enter some details to continue!</html:p> + <html:form id="form1" onsubmit="_parent.send('form.submitted', [ document.forms['form1'].elements[0].value, document.forms['form1'].elements[1].value ]); return false;"> First name1: <html:input type="text" name="firstname" /><html:br /> Last name1: <html:input type="text" name="lastname" /> - <html:input onclick="scxml.send('onclick', arguments[0])" type="button" value="Submit" /> + <html:input type="submit" value="Submit" /> </html:form> </content> + <finalize> + <script>dump(_event);</script> + </finalize> + </invoke> + + <transition event="form.submitted"> + <script> + entered.first = _event.data[0]; + entered.second = _event.data[1]; + </script> + <send target="#_xhtml3"> + <!-- replace children in body by a form and register onclick on submit button --> + <content type="replacechildren" xpath="/html/body"> + <html:p>Thank you!</html:p> + </content> + </send> + <send event="continue" delay="1000ms" /> + </transition> + + <transition event="continue" target="backChannelNoContent" /> + + </state> + + <state id="backChannelNoContent"> + <!-- without a src and no content, we invoke with a back channel via template/xhtml-invoker.xhtml for later sends --> + <invoke type="xhtml" id="xhtml2"> + <finalize> + <script>dump(_event);</script> + </finalize> </invoke> - <state id="idle"> + <state id="waitForStabilize"> + <onentry> + <send event="continue" delay="10ms" /> + </onentry> + <transition event="continue" target="backChannelNoContentInitContent" /> + </state> + + <state id="backChannelNoContentInitContent"> + <onentry> + <!-- template initialized empty body and the scxml session --> + <send target="#_xhtml2"> + <!-- replace children in body by a form and register onclick on submit button --> + <content type="replacechildren" xpath="/html/body"> + <html:p>Enter some more details to continue!</html:p> + <html:form id="form1" onsubmit="_parent.send('form.submitted', [ document.forms['form1'].elements[0].value, document.forms['form1'].elements[1].value ]); return false;"> + First name1 (${entered.first}): <html:input type="text" name="firstname" /><html:br /> + Last name1 (${entered.second}): <html:input type="text" name="lastname" /> + <html:input type="submit" value="Submit" /> + </html:form> + </content> + </send> + </onentry> + + <transition event="form.submitted"> + <send target="#_xhtml2"> + <!-- replace children in body by a form and register onclick on submit button --> + <content type="replacechildren" xpath="/html/body"> + <html:p>Thank you!</html:p> + </content> + </send> + <send event="continue" delay="1000ms" /> + </transition> + + <transition event="continue" target="arbitraryURL" /> + + </state> + </state> + + <state id="arbitraryURL"> + <!-- simply open some arbitrary URL, we cannot communicate with these --> + <invoke src="http://www.heise.de" type="xhtml" id="xhtml1" /> + <onentry> + <!-- we need a delayed send for this to be a stable configuration for the invoker --> + <send event="continue" delay="10ms" /> + </onentry> + <transition event="continue" target="quit" /> + </state> + + + + <!-- <invoke type="xhtml" id="xhtml1"> + </invoke> --> + + <!-- state id="idle"> <transition target="idle" event="onmouseover"> <log expr="dump(_event)" /> </transition> @@ -27,7 +137,7 @@ </content> </send> </transition> - </state> + </state --> - </state> + <final id="quit" /> </scxml>
\ No newline at end of file |