cocoon-docs mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From stev...@outerthought.org
Subject [WIKI-UPDATE] GettingStartedWithFlow Tue Apr 29 10:00:03 2003
Date Tue, 29 Apr 2003 08:00:03 GMT
Page: http://wiki.cocoondev.org/Wiki.jsp?page=GettingStartedWithFlow , version: 27 on Tue Apr
29 07:51:31 2003 by TonyCollen

- ''TODO: Describe what happens when a request is made for the game and follow the execution
of the Flowscript. -- [TonyCollen]''
+ Alright, now let's follow the execution of this Flow and pipeline:
+ The player accesses the URL {{http://host/cocoon/game/}} and the {{<map:match pattern="">}}
matches, and starts the pipeline. 
+ The function {{main()}} which is referenced in {{flow/game.js}} is called, and a new Continuation
object is created.  Without getting into too much detail,  the state of the Javascript code
is saved, and can be recalled any number of times.  
+ 
+ ''TODO: Explain the concept of continuations in further detail. -- [TonyCollen]''
+ 
+ We now enter the code in {{game.js}}:  
+ *A random number between 1 and 10 is chosen.
+ *Variables containing a hint for the player and the player's current number of guesses are
initialized.
+ 
+ The Flow now enters the {{while(true)}} loop which basically keeps the game going until
the player guesses the correct number.
+ 
+ We now get to the following line, where things start to get interesting:
+ 
+ {{{
+ sendPageAndWait("guess.jxt", { "random" : random, "hint" : hint, "guesses" : guesses} );
+ }}}
+ 
+ The Flow layer sends the contents of the URI "guess.jxt" which is matched in the sitemap
(see above).  We also pass an inline Javascript object, containing three key/value pairs,
one named "random" which contains the value of the variable {{random}} as initialized above,
and so on for   {{hint}} and {{guesses}}.   The keys are substituted later down the line,
when the JXTemplateGenerator comes into play.
+ 
+ We could also do the following:
+ {{{
+ sendPageAndWait("guess.jxt", { "foo" : random } );
+ }}}
+ 
+ In this case, the value of {{random}} would be able to be substituted in our JXTemplate,
but under the name "foo"" instead -- we'd just have to make sure we have the correct keyname
in our template.
+ 
+ The Flow Layer also does another interesting thing:  __it halts the execution of the Javascript!__
 Through the magic of continuations, the Flow Layer is able to resume execution of the script
at the exact line in which it left off.  This creates some very powerful situations with respect
to web programming, and forces the reader to think very differently about how web applications
are designed.
+ 
+ Picking back up in the script execution, the client is sent through the pipeline matching
"guess.jxt".  Referring back to the sitemap, we match {{*.jxt}}, and run the file through
the JXTemplateGenerator, which substitutes the keynames for the values sent from the {{sendPageAndWait()}}
function.  
+ 
+ One thing to note is in the form which is sent back to Cocoon when the player submits the
guess:
+ 
+ {{{
+ <form method="post" action="${continuation.id}.kont">
+ }}}
+ 
+ Here, {{ ${continuation.id} }} is resolved to a unique identifier which points to the current
continuation.  One can think of this somewhat of a session ID. 
+ 
+ When the player submits the form, it is submitted to a unique URL which contains the continuation
ID, plus ".kont", which we end up matching in the sitemap:
+ 
+ {{{
+ <map:match pattern="*.kont">
+     <map:call continuation="{1}"/>
+ </map:match>
+ }}}
+ 
+ When Cocoon sees a URL like this, it attempts to restart the continuation with the specified
ID, and we re-enter the Javascript code where we left off previously.
+ 
+ ''TODO: Explain map:match pattern="invalidContinuation" -- [TonyCollen]''
+ 
+ 



Mime
View raw message