Add zk web sample ref docs

docs/src/reference/asciidoc/sm-examples.adoc

@@ -89,6 +89,7 @@ State changed to LOCKED
 Event PUSH send
 ----
 
+[[statemachine-examples-showcase]]
 == Showcase
 Showcase is a complex state machine showing all possible transition
 topologies up to four levels of state nesting.
@@ -894,3 +895,67 @@ sm>Exit state UNLOCKED
 Entry state LOCKED
 ----
 
+[[statemachine-examples-web]]
+== Web
+Web is a distributed state machine example using a zookeeper to handle
+distribted state. This example is meant to be run on a multiple
+browser sessions agains a multiple different hosts.
+
+This sample is using a modified state machine structure from a
+<<statemachine-examples-showcase>> to work with a distributed state
+machine.
+
+[NOTE]
+====
+Due to nature of this sample an instanse of a `Zookeeper` is expected to
+be available from a localhost for every individual sample instance.
+====
+
+Lets go through a simple example where two different sample instances are
+started with command `java -jar
+spring-statemachine-samples-web-1.0.0.BUILD-SNAPSHOT.jar`. If you are
+running different instances on a same host you need to distinguish
+used port by adding `--server.port=<myport>` to the command. Otherwise
+default port for each host will be `8080`.
+
+In this sample run we have three hosts, `n1`, `n2` and `n3`. which all
+have a zookeeper running and a state machine sample running on a port
+`8080`.
+
+[source,text]
+----
+@n1:~# java -jar spring-statemachine-samples-web-1.0.0.BUILD-SNAPSHOT.jar
+@n2:~# java -jar spring-statemachine-samples-web-1.0.0.BUILD-SNAPSHOT.jar
+@n3:~# java -jar spring-statemachine-samples-web-1.0.0.BUILD-SNAPSHOT.jar
+----
+
+Lets take a sample run of this example assuming that we have three
+nodes, `n1`, `n2` and `n3` hosting `Zookeeper` and this statemachine
+web sample.
+
+When all instances are running you should see all showing similar
+information via a browser where you have states `S0`, `S1` and `S11`,
+and extended state variable `foo=0`. Main state is `S11`.
+
+image::images/sm-dist-n1-1.png[width=500]
+
+When you press button `Event C` in any of a browser window,
+distributed state is changed to `S211` which is the target state
+denoted by transition associated with a event `C`.
+
+image::images/sm-dist-n2-2.png[width=500]
+
+Then lets press button `Event H` and what is supposed to happen is
+that internal transition is happening on all state machines changing
+extended stare variable `foo` from value `0` to `1`. This change is
+then propagated to other state machines. You should only see variable
+`foo` to change from `0` to `1`.
+
+image::images/sm-dist-n3-3.png[width=500]
+
+Last we simply send event `Event C` which is supposed to take state
+machine state back to state `S11` and you should see this happening in
+all browser sessions.
+
+image::images/sm-dist-n1-4.png[width=500]
+