Tutorial with exercises

server/README.md

@@ -10,6 +10,11 @@ Swim implements a general purpose distributed object model. The "objects" in thi
 
 [Creating a class](http://github.com/swimos/tutorial/tree/master/server/src/main/java/swim/tutorial/UnitAgent.java#L13) that extends `swim.api.agent.AbstractAgent` defines a *template* for Web Agents (though not a useful one until we add some [lanes](#lanes)).
 
+#### *Try it yourself:* 
+- [ ] *Navigate to [swim.tutorial.DataSource.java](https://github.com/swimos/tutorial/blob/master/server/src/main/java/swim/tutorial/DataSource.java)*
+- [ ] *Create additional web agents using the instructions in the code*
+- [ ] *Compare your answer with those in the [**tutorial_solutions**](https://github.com/swimos/tutorial/tree/tutorial_solutions) branch*
+
 Visit the [documentation](https://developer.swim.ai/concepts/agents/) for further details about Web Agents.
 
 ## Lanes
@@ -20,6 +25,12 @@ Continuing our analogy, *lane callback* functions serve as the "methods" of Web
 
 Each lane type defines a set of overridable (default no-op) lifecycle callbacks. For example, [sending a command message](#sending-data-do-swim) to any command lane will trigger its [`onCommand` callback](http://github.com/swimos/tutorial/tree/master/server/src/main/java/swim/tutorial/UnitAgent.java#L51-L54). On the other hand, [setting a value lane](http://github.com/swimos/tutorial/tree/master/server/src/main/java/swim/tutorial/UnitAgent.java#L53) will trigger its `willSet` callback, then update its value, then trigger its [`didSet` callback](http://github.com/swimos/tutorial/tree/master/server/src/main/java/swim/tutorial/UnitAgent.java#L40-L47).
 
+#### *Try it yourself:* 
+- [ ] *Navigate to [swim.tutorial.UnitAgent.java](https://github.com/swimos/tutorial/blob/master/server/src/main/java/swim/tutorial/UnitAgent.java)*
+- [ ] *Fill in the remaining code to create a new value lane called `stats` which gets populated by changes to the `histogram` map lane*
+- [ ] *Experiment with ways to transform the data entries in histogram. Ideas: mean, median, range, standard deviation, variance, etc!*
+- [ ] *Compare your answer with those in the [**tutorial_solutions**](https://github.com/swimos/tutorial/tree/tutorial_solutions) branch*
+
 Visit the [documentation](https://developer.swim.ai/concepts/lanes/) for further details about lanes.
 
 ## Standing a Swim Server
@@ -43,3 +54,10 @@ Visit the [documentation](https://developer.swim.ai/concepts) for further detail
 Swim client instances use Swim **links** to pull data from a Swim lanes. Like their corresponding lanes, links have overridable callback functions that can be used to [populate UIs](http://github.com/swimos/tutorial/tree/master/ui/index.html#L116-L141).
 
 Visit the [documentation](https://developer.swim.ai/concepts/links/) for further details about links.
+
+## *Visualizing Your Changes in the UI*
+
+- [ ] *Consider how the above changes to the server code may change the way you'd want to visualize your data*
+- [ ] *Navigate to the [ui folder](https://github.com/swimos/tutorial/tree/master/ui)*
+- [ ] *Experiment with the UI code to accommodate for your server-side changes*
+- [ ] *See the [**tutorial_solutions**](https://github.com/swimos/tutorial/tree/tutorial_solutions) branch for an example of this*

server/src/main/java/swim/tutorial/DataSource.java

@@ -40,6 +40,13 @@ void sendCommands() throws InterruptedException {
       //   *Web Agent* addressable by "/unit/master" RUNNING ON the
       //   *(Swim) server* addressable by hostUri
       this.ref.command(this.hostUri, "/unit/master", "publish", msg);
+
+      // TODO: Create two new web agents using the above format
+
+      // To instantiate more agents, follow the format of the URI pattern specified in TutorialPlane
+      // HINT: see line 12: @SwimRoute("/unit/:id")
+
+
       indicator = (indicator + 1) % 1000;
 
       // Throttle events to four every three seconds

server/src/main/java/swim/tutorial/UnitAgent.java

@@ -12,14 +12,36 @@
 import java.util.Iterator;
 
 public class UnitAgent extends AbstractAgent {
+
+  // TODO: complete the stats Value Lane
+  // @SwimLane("stats")
+
+  // HINT: Use the valueLane() method to instantiate the lane
+  // HINT: Use the .didSet() lifecycle callback to log a message showing updates to stats
+
+   @SwimLane("histogram")
+   private final MapLane<Long, Value> histogram = this.<Long, Value>mapLane()
+       .didUpdate((k, n, o) -> {
+         logMessage("histogram: replaced " + k + "'s value to " + Recon.toString(n) + " from " + Recon.toString(o));
+
+         // TODO: update stats with update logic
+
+         // HINT: access new data sent to histogram with 
+         		// n.getItem(0).longValue()
+
+         // HINT: use this data to calculate stats such as mean, variance, std dev, etc
+
+         // HINT: send new data to stats lane by calling 
+         		// stats.set($TRANSFORMED_DATA)
+
+		 dropOldData();
 
-  @SwimLane("histogram")
-  private final MapLane<Long, Value> histogram = this.<Long, Value>mapLane()
-      .didUpdate((k, n, o) -> {
-        logMessage("histogram: replaced " + k + "'s value to " + Recon.toString(n) + " from " + Recon.toString(o));
-        dropOldData();
-      });
+       })
+       .didRemove((k,o) -> {
+        // TODO: update stats with remove logic
 
+       });
+
   @SwimLane("history")
   private final ListLane<Value> history = this.<Value>listLane()
       .didUpdate((idx, newValue, oldValue) -> {

ui/README.md

@@ -4,6 +4,11 @@
 
 The minimum you need to visualize Swim data is a Swim client. That said, Swim comes with additional tools that let you see your data right away with no extra work.
 
+#### *Try it yourself:*
+
+- [ ] *Based on changes suggested in* [*the server README*](https://github.com/swimos/tutorial/blob/tutorial_solutions/server/README.md) *, update the UI code to accommodate your new server-side*
+- [ ] *See the [**tutorial_solutions**](https://github.com/swimos/tutorial/tree/tutorial_solutions) branch for an example of this*
+
 Read [chart.html](http://github.com/swimos/tutorial/tree/master/ui/chart.html) to build your own line chart.
 
 Read [gauge.html](http://github.com/swimos/tutorial/tree/master/ui/gauge.html) to build your own gauge.