svn commit: r1597265 - in /isis/site/trunk/content: components/viewers/restfulobjects/angularjs-tips.md documentation.md

[da...@apache.org]

Author: danhaywood
Date: Sat May 24 09:01:34 2014
New Revision: 1597265

URL: http://svn.apache.org/r1597265
Log:
angularjs tip

Added:
    isis/site/trunk/content/components/viewers/restfulobjects/angularjs-tips.md
Modified:
    isis/site/trunk/content/documentation.md

Added: isis/site/trunk/content/components/viewers/restfulobjects/angularjs-tips.md
URL: http://svn.apache.org/viewvc/isis/site/trunk/content/components/viewers/restfulobjects/angularjs-tips.md?rev=1597265&view=auto
==============================================================================
--- isis/site/trunk/content/components/viewers/restfulobjects/angularjs-tips.md (added)
+++ isis/site/trunk/content/components/viewers/restfulobjects/angularjs-tips.md Sat May 24 09:01:34 2014
@@ -0,0 +1,54 @@
+Title: AngularJS Tips
+
+The hypermedia API exposed by Isis' Restful Objects viewer is intended be support both bespoke custom-written viewers as well as generic viewers.  Indeed, we expect most clients consuming the API will be bespoke, not generic.
+
+This page captures one or two tips on using AngularJS to write such a bespoke client.
+
+### Invoking a GET link (eg invoking a query action)
+
+Suppose you have a `CustomerService` providing a `findCustomer` action:
+
+  public class CustomerService {
+
+    public String id() { return "customers"; }
+    
+    @ActionSemantics(Of.SAFE)
+    public Customer findCustomer(@Named("customerName") String customerName) { ... }
+  
+  }
+  
+Restful Objects will expose this as action with the following link that looks something like:
+
+  {
+    "rel" : "urn:org.restfulobjects:rels/invoke",
+    "href" : "http://localhost:8080/restful/services/customers/actions/findCustomer/invoke",
+    "method" : "GET",
+    "type" : "application/json;profile=\"urn:org.restfulobjects:repr-types/action-result\"",
+    "arguments" : {
+      "customerName" : {
+        "value" : null
+      }
+    }
+  }  
+  
+You can then invoke this using AngularJs' `$resource` service as follows.  
+
+  var findCustomerAction = $resource("http://localhost:8080/restful/services/customers/actions/findCustomer/invoke?:queryString");
+
+  var findCustomerArgs = { 
+    "customerName": { 
+        "value": "Fred" 
+      }
+  };
+  var findCustomerArgsStringified = JSON.stringify(findCustomerArgs);
+
+  findCustomerAction.get({queryString: findCustomerArgsStringified}, function(data) { ... } )
+
+Here the `:queryString` placeholder in the initial `$resource` constructor is expanded with a stringified version of the JSON object representing the args.  Note how the `findCustomerArgs` is the same as the `"arguments"` attribute in the original link (with a value provided instead of `null`).
+
+### Invoking a PUT or POSt link
+
+> The following notes need expanding.  Contributions welcome
+
+If the method is a PUT or a POST, then no `:queryString` placeholder is required in the URL, and the args are instead part of the body.  Use `$resource.put(...)` or `$resource.post(...)` instead.
+

Modified: isis/site/trunk/content/documentation.md
URL: http://svn.apache.org/viewvc/isis/site/trunk/content/documentation.md?rev=1597265&r1=1597264&r2=1597265&view=diff
==============================================================================
--- isis/site/trunk/content/documentation.md (original)
+++ isis/site/trunk/content/documentation.md Sat May 24 09:01:34 2014
@@ -504,6 +504,7 @@ Other
 #### Hints and Tips
 
 * [Using Chrome Tools](components/viewers/restfulobjects/using-chrome-tools.html) <a href="components/viewers/restfulobjects/using-chrome-tools.html"><img src="./images/tv_show-25.png"></a>
+* [AngularJS Tips](components/viewers/restfulobjects/angularjs-tips.html)
 
 }