Deployment of examples; example descriptions.

js/Makefile

@@ -21,3 +21,24 @@ clean:
 
 veryclean: clean
 	rm -rf node_modules/
+
+SYNDICATE_WEB=$(CURDIR)/../../syndicate-web
+deploy: all deploy-copy
+deploy-copy:
+	(git diff --quiet && git diff --cached --quiet) || (echo "Commit changes first."; false)
+
+	[ -d $(SYNDICATE_WEB) ]
+	[ -f $(SYNDICATE_WEB)/CNAME ]
+	[ -f $(SYNDICATE_WEB)/_config.yml ]
+	[ -f $(SYNDICATE_WEB)/index.md ]
+
+	[ ! -d $(SYNDICATE_WEB)/examples ] || (cd $(SYNDICATE_WEB); git rm -rf examples)
+	[ ! -d $(SYNDICATE_WEB)/dist ] || (cd $(SYNDICATE_WEB); git rm -rf dist)
+
+	git clone .. TEMP_CHECKOUT
+	cp -a TEMP_CHECKOUT/js/examples $(SYNDICATE_WEB)/examples
+	cp -a TEMP_CHECKOUT/js/dist $(SYNDICATE_WEB)/dist
+	rm -rf TEMP_CHECKOUT
+
+	(cd $(SYNDICATE_WEB); git add examples)
+	(cd $(SYNDICATE_WEB); git add dist)

js/examples/index.md

@@ -0,0 +1,63 @@
+---
+---
+
+# Syndicate/js Examples
+
+## Clickable Button
+
+This is a simple clickable button; each time the button is clicked,
+the number on the face of the button is incremented.
+
+The actor maintaining the counter also maintains the button's label
+and listens to click events. It uses the Syndicate/js DOM driver to
+publish the button's label text based on its internal state, and the
+Syndicate/js jQuery driver to subscribe to button click events.
+
+ - [DEMO](button/)
+ - [Source code](button/index.js) using the Syndicate/js DSL
+
+## jQuery Example
+
+This example is similar to the button example, but uses plain
+JavaScript instead of the Syndicate/js DSL, calling out to Syndicate
+as a library. It uses the Syndicate/js jQuery driver to receive click
+events from the button, but does not use the Syndicate/js DOM driver;
+instead, it updates the DOM directly.
+
+ - [DEMO](jquery/)
+ - [Source code](jquery/index.js) in plain JavaScript
+
+## Text Entry Widget
+
+This is a simple text entry GUI control, following a design of
+[Hesam Samimi](http://www.hesam.us/cs/cooplangs/textfield.pdf).
+
+Samimi's design proceeds in two stages. In the first, it calls for two
+components: one representing the *model* of a text field, including
+its contents and cursor position, and one acting as the *view*,
+responsible for drawing the widget and interpreting keystrokes. In the
+second stage, a *search* component is added, responsible for searching
+the current content of the model for a pattern and collaborating with
+the view to highlight the results.
+
+This Syndicate solution naturally has an actor for each of the three
+components. The model actor maintains the current contents and cursor
+position as assertions in the shared dataspace. The view actor
+observes these assertions and, when they change, updates the display.
+It also subscribes to keystroke events and translates them into
+messages understandable to the model actor. The addition of the search
+actor necessitates no changes to the model actor. The search actor
+observes the assertion of the current content of the field in the same
+way the view actor does. If it finds a matching substring, it asserts
+this fact. The view actor must observe these assertions and highlight
+any corresponding portion of text.
+
+There are two implementations, one using Syndicate events and actions
+directly, and one using the high-level Syndicate DSL.
+
+ - High-level DSL implementation
+    - [DEMO](textfield-dsl/)
+    - [Source code](textfield-dsl/index.js) using the Syndicate/js DSL
+ - Low-level implementation
+    - [DEMO](textfield/)
+    - [Source code](textfield/index.js) in plain JavaScript