JSAPI Tutorial: Adding Likes to a User's Network Stream

Level: Intermediate

Prerequisite: Streaming Tutorial

Example: Network Likes Example

Summary:This tutorial builds on the Streaming Tutorial. In this tutorial we discuss adding "write" functionality to the page with likes and updates on the stream items.

Note that all code samples in this document use jQuery, so that's the syntax being used.

Setup

Your application needs to be set up as described in the Streaming Tutorial. The code can also be downloaded directly.

Making Raw JSAPI Calls

The JSAPI provides convenience methods for many of the most common REST API calls. It does not, however, cover the entire REST API, and does not currently support write operations. However, a Raw method is provided which can be used to access any resource method the REST API provides.

Details about Making Raw API Calls

The Raw method supports a couple of new chained methods beyond the standard ones.

When accessing a resource in this way, you need to look at the REST API documentation for that resource.


REST API "Like" Resource

In this case, because we are working with the "Like" resource, we can refer to the Comments and Likes document. That document covers all of the write operations of this type.

More details

From this document you can see that adding like to a network update is a PUT operation, written to

The body for this request, in XML, is listed as:

The JSAPI doesn't use XML, however. It uses JSON for all of the actions. So in order to understand what JSON to send, we can refer to the API Requests with JSON document. To perform any JSAPI writes you'll need to understand how to translate between the two, but for now you can see, from the bottom example, that this XML translates to "true" in JSON.


The Raw Like Call

Now we know what needs to happen - a PUT to the like resource for the update item, with "true" as the body.

Putting it All Together

Now we can put this into the original streaming application. To do that, we need to add some buttons for the user to click and some handlers to process those clicks.

First, add the buttons. These will be inserted in the loadData() function at the bottom of each streamitem.

And then some handlers to listen for the click events

Example Code