Polished xhtml invoker

1 files changed, 118 insertions, 8 deletions

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